jquery之ajaxfileupload异步上传插件(附工程代码)

jquery之ajaxfileupload异步上传插件(附工程代码)_jquery

WBOY

Lepaskan： 2016-05-16 17:36:30

asal

1011 orang telah melayarinya

点我下载工程代码
由于项目需求，在处理文件上传时需要使用到文件的异步上传。这里使用Jquery Ajax File Uploader这个组件下载地址：http://www.phpletter.com/download_project_version.php?version_id=6
服务器端采用struts2来处理文件上传。
所需环境：
jquery.js
ajaxfileupload.js
struts2所依赖的jar包
及struts2-json-plugin-2.1.8.1.jar
编写文件上传的Action

复制代码代码如下:

 
package com.ajaxfile.action; 
import java.io.File; 
import java.io.FileInputStream; 
import java.io.FileOutputStream; 
import org.apache.struts2.ServletActionContext; 
import com.opensymphony.xwork2.ActionSupport; 
@SuppressWarnings("serial") 
public class FileAction extends ActionSupport { 
private File file; 
private String fileFileName; 
private String fileFileContentType; 
private String message = "你已成功上传文件"; 
public String getMessage() { 
return message; 
} 
public void setMessage(String message) { 
this.message = message; 
} 
public File getFile() { 
return file; 
} 
public void setFile(File file) { 
this.file = file; 
} 
public String getFileFileName() { 
return fileFileName; 
} 
public void setFileFileName(String fileFileName) { 
this.fileFileName = fileFileName; 
} 
public String getFileFileContentType() { 
return fileFileContentType; 
} 
public void setFileFileContentType(String fileFileContentType) { 
this.fileFileContentType = fileFileContentType; 
} 
@SuppressWarnings("deprecation") 
@Override 
public String execute() throws Exception { 
String path = ServletActionContext.getRequest().getRealPath("/upload"); 
try { 
File f = this.getFile(); 
if(this.getFileFileName().endsWith(".exe")){ 
message="对不起,你上传的文件格式不允许!!!"; 
return ERROR; 
} 
FileInputStream inputStream = new FileInputStream(f); 
FileOutputStream outputStream = new FileOutputStream(path + "/"+ this.getFileFileName()); 
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; 
} 
} 

struts.xml

复制代码代码如下:

 
text/html 
 
text/html

注意结合Action观察struts.xml中result的配置。
contentType参数是一定要有的，否则浏览器总是提示将返回的JSON结果另存为文件，不会交给ajaxfileupload处理。这是因为struts2 JSON Plugin默认的contentType为application/json，而ajaxfileupload则要求为text/html。
文件上传的jsp页面

复制代码代码如下: