您的位置:首页 > 编程语言 > Java开发

Struts2 + jquey.uploadify 实现无刷新带进度条上传

2010-03-20 13:30 459 查看
首先新建一个Struts2 的项目。

创建一个Action用来处理文件上传 UploadAction.action

package com.fileUpload.Action;

import java.io.BufferedInputStream;
import java.io.BufferedOutputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileOutputStream;
import java.io.InputStream;
import java.io.OutputStream;
import java.util.Date;

import org.apache.struts2.ServletActionContext;

import com.opensymphony.xwork2.ActionSupport;

public class UploadAction extends ActionSupport {

/**
*
*/
private static final long serialVersionUID = 2854105381965508552L;

private static final int BUFFER_SIZE = 20 * 1024; // 20K

private File myFile; // 与页面 <input type="file"> 控件的 name 保持一致

private String fileName; //
private String contentType;

public File getMyFile() {
return myFile;
}

public void setMyFile(File myFile) {
this.myFile = myFile;
}

public String getFileName() {
return fileName;
}

// 是setMyFileFileName而不是setFileName 。 struts2的规则。MyFile 是上面private File
// myFile

public void setMyFileFileName(String fileName) {
this.fileName = fileName;
}

public String getContentType() {
return contentType;
}

// 同上
public void setMyFileContentType(String contentType) {
this.contentType = contentType;
}

public String execute()
{
String newFileName = new Date().getTime() + getExtention(fileName);

File imageFile = new File(ServletActionContext.getServletContext()
.getRealPath("/upload")
+ "/" + newFileName);

upload(myFile, imageFile);

return SUCCESS;
}

private static void upload(File src, File dst) {
try {
InputStream in = null;
OutputStream out = null;
try {
in = new BufferedInputStream(new FileInputStream(src),
BUFFER_SIZE);
out = new BufferedOutputStream(new FileOutputStream(dst),
BUFFER_SIZE);
byte[] buffer = new byte[BUFFER_SIZE];
while (in.read(buffer) > 0)
{
out.write(buffer);
}
}
finally
{
if (null != in)
{
in.close();
}
if (null != out)
{
out.close();
}
}
}
catch (Exception e)
{
e.printStackTrace();
}
}

private static String getExtention(String fileName) {
int pos = fileName.lastIndexOf(".");

return fileName.substring(pos);
}

}


从Jquery 官方下载 jquery.uploadify 这个文件上传插件。解压 放到WebRoot 下

新建一个Jsp(html)页面

<%@ page language="java"  pageEncoding="utf-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link href="jquery.uploadify/default.css" mce_href="jquery.uploadify/default.css" rel="stylesheet" type="text/css"/>
<link href="jquery.uploadify/uploadify.css" mce_href="jquery.uploadify/uploadify.css" rel="stylesheet" type="text/css"/>

<mce:script type="text/javascript" src="jquery.uploadify/jquery-1.3.2.min.js" mce_src="jquery.uploadify/jquery-1.3.2.min.js"></mce:script>
<mce:script type="text/javascript" src="jquery.uploadify/swfobject.js" mce_src="jquery.uploadify/swfobject.js"></mce:script>
<mce:script type="text/javascript" src="jquery.uploadify/jquery.uploadify.v2.1.0.min.js" mce_src="jquery.uploadify/jquery.uploadify.v2.1.0.min.js"></mce:script>
<mce:script type="text/javascript"><!--

$(document).ready(function(){
$("#uploadTest").uploadify({
'uploader'       : 'jquery.uploadify/uploadify.swf',
'script'         : 'upload.action',
'cancelImg'      : 'jquery.uploadify/cancel.png',
'fileDataName'   : 'myFile',
'queueID'        : 'fileQueue',
'auto'           : false,
'multi'          : true,
'button Text'    : " 浏 览 ",
'simUploadLimit' : 20,
'sizeLimit'      : 999999999999,
'queueSizeLimit' : 20,
'fileDesc'       : '支持格式:jpg,gif,png,bmp',
'fileExt'         : '*.jpg;*.gif,*.jpeg,*.png,*.bmp'
});
});
// --></mce:script>

</head>

<body>

<div id="fileQueue"></div>
<input type="file"  name="myFile" id="uploadTest" >
<a href="javascript:$('#uploadTest').uploadifyUpload()" mce_href="javascript:$('#uploadTest').uploadifyUpload()">上传</a>
<a href="javascript:$('#uploadTest').uploadifyClearQueue()" mce_href="javascript:$('#uploadTest').uploadifyClearQueue()">取消上传</a>
</body>
</html>


Struts.xml

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">

<struts>

<constant name="struts.multipart.maxSize" value="10000000"></constant>
<package name="default" namespace="/" extends="struts-default">

<action name="upload"  class="com.fileUpload.Action.UploadAction">
<result name="success" type="redirect">/index.jsp</result>
</action>
</package>

</struts>


OK ,大功告成!
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: