jsp中使用jquery的ajaxfileupload插件怎么实现异步上传

jsp中使用jquery的ajaxfileupload插件怎么实现异步上传,第1张

JSP页面中引入的script代码

<script>

function

ajaxFileUpload()

{

$("#loading").ajaxStart(function(){

$(this).show()

})//开始上传文件时显示一个图片

.ajaxComplete(function(){

$(this).hide()

})//文件上传完成将图片隐藏起来

$.ajaxFileUpload({

url:'AjaxImageUploadAction.action',//用于文件上传的服务器端请求地址

secureuri:false,//一般设置为false

fileElementId:'imgfile',//文件上传空间的id属性

<input

type="file"

id="imgfile"

name="file"

/>

dataType:

'json',//返回值类型

一般设置为json

success:

function

(data,

status)

//服务器成功响应处理函数

{

alert(data.message)//从服务器返回的json中取出message中的数据,其中message为在struts2中定义的成员变量

if(typeof(data.error)

!=

'undefined')

{

if(data.error

!=

'')

{

alert(data.error)

}else

{

alert(data.message)

}

}

},

error:

function

(data,

status,

e)//服务器响应失败处理函数

{

alert(e)

}

}

)

return

false

}

</script>

struts.xml配置文件中的配置方法:

<struts>

<package

name="struts2"

extends="json-default">

<action

name="AjaxImageUploadAction"

class="com.test.action.ImageUploadAction">

<result

type="json"

name="success">

<param

name="contentType">text/html</param>

</result>

<result

type="json"

name="error">

<param

name="contentType">text/html</param>

</result>

</action>

</package>

</struts>

上传处理的Action

ImageUploadAction.action

package

com.test.action

import

java.io.File

import

java.io.FileInputStream

import

java.io.FileOutputStream

import

java.util.Arrays

import

org.apache.struts2.ServletActionContext

import

com.opensymphony.xwork2.ActionSupport

@SuppressWarnings("serial")

public

class

ImageUploadAction

extends

ActionSupport

{

private

File

imgfile

private

String

imgfileFileName

private

String

imgfileFileContentType

private

String

message

=

"你已成功上传文件"

public

File

getImgfile()

{

return

imgfile

}

public

void

setImgfile(File

imgfile)

{

this.imgfile

=

imgfile

}

public

String

getImgfileFileName()

{

return

imgfileFileName

}

public

void

setImgfileFileName(String

imgfileFileName)

{

this.imgfileFileName

=

imgfileFileName

}

public

String

getImgfileFileContentType()

{

return

imgfileFileContentType

}

public

void

setImgfileFileContentType(String

imgfileFileContentType)

{

this.imgfileFileContentType

=

imgfileFileContentType

}

public

String

getMessage()

{

return

message

}

public

void

setMessage(String

message)

{

this.message

=

message

}

@SuppressWarnings("deprecation")

public

String

execute()

throws

Exception

{

String

path

=

ServletActionContext.getRequest().getRealPath("/upload/mri_img_upload")

String[]

imgTypes

=

new

String[]

{

"gif",

"jpg",

"jpeg",

"png","bmp"

}

try

{

File

f

=

this.getImgfile()

String

fileExt

=

this.getImgfileFileName().substring(this.getImgfileFileName().lastIndexOf(".")

+

1).toLowerCase()

/*

if(this.getImgfileFileName().endsWith(".exe")){

message="上传的文件格式不允许!!!"

return

ERROR

}*/

/**

*

检测上传文件的扩展名是否合法

*

*/

if

(!Arrays.<String>

asList(imgTypes).contains(fileExt))

{

message="只能上传

gif,jpg,jpeg,png,bmp等格式的文件!"

return

ERROR

}

FileInputStream

inputStream

=

new

FileInputStream(f)

FileOutputStream

outputStream

=

new

FileOutputStream(path

+

"/"+

this.getImgfileFileName())

byte[]

buf

=

new

byte[1024]

int

length

=

0

while

((length

=

inputStream.read(buf))

!=

-1)

{

outputStream.write(buf,

0,

length)

}

inputStream.close()

outputStream.flush()

}

catch

(Exception

e)

{

e.printStackTrace()

message

=

"文件上传失败了!!!!"

}

return

SUCCESS

}

}

转载,仅供参考。

引入jQuery库

引入ajaxfileupload.js上传插件库(这也是jQuery的一个插件)

以ASP.NET为例

<input type="file" id="uploadfile" name="uploadfile"/>

<script type="text/javascript">

$("#uploadfile").change(function(){

$.ajaxFileUpload({

url: '../ajax/AjaxCallback.ashx',//处理上传用的后台程序,可以是PHP,也可以是ASP等

secureuri: false,//异步

fileElementId: 'uploadfile',//上传控件ID

dataType: 'json',//返回的数据信息格式

success: function(data, status) {

if (data.code == '10000') {

alert("上传成功")

} else {

alert("上传失败")

}

}, error: function(data, status, e) {

alert(e)

}

})

})

</script>

后台CS代码

/// <summary>

/// 图片上传

/// </summary>

private void ImageUpload()

{

Response.ContentType = "text/html"//这里一定要html

if (Request.Files.Count >0)

{

HttpPostedFile file = Request.Files[0]

if (file.ContentLength >0)

{

string suffix = file.FileName.Substring(file.FileName.LastIndexOf('.'))//后缀

if (".jpg.png.gif.jpeg".IndexOf(suffix.ToLower()) == -1)//文件格式,这里采用图片格式说明

{

Response.Write("{\"msg\":\"文件格式不正确!\",code:\"10001\"}")

return

}

try

{

file.SaveAs(Server.MapPath("~/uploadfile/") + newName)

Response.Write("{\"msg\":\"" + newName + "\",code:\"10000\"}")

return

}

catch (Exception ex)

{

Response.Write("{\"msg\":\"" + HttpUtility.HtmlEncode(ex.Message) + "\",code:\"10001\"}")

return

}

}

Response.Write("{\"msg\":\"请选择要上传的文件!\",code:\"10001\"}")

return

}

Response.Write("{\"msg\":\"请选择要上传的文件!\",code:\"10001\"}")

return

}


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/tougao/11600424.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-17
下一篇 2023-05-17

发表评论

登录后才能评论

评论列表(0条)

保存