您的位置：首页 > 运维架构 > Apache
Apache开源项目Java部分清单(英文去链接版)

2013-02-18 23:03 543 查看
采用dwr+ajax和struts开发文件上传进度条

编写监听器以及相关的类

不用自己写了，源码可以从
 http://www.telio.be/blog/2006/01/06/ajax-upload-progress-monitor-for-commons-fileupload-example里面下载， 
下载地址
 http://www.telio.be/blog/wp-content/uploads/2006/01/ajax-upload-1.0.war 
下载完之后，你需要解包，在命令行中：

jar xvf ajax-upload-1.0.war

源码就在\WEB-INF\src下面

将要用到的文件有resources文件夹下，\WEB-INF\下面的dwr.xml和lib下面的jar文件

上传页面

在上面解开的包里面有index.jsp这个是上传页面，upload.jsp负责上传，resources包里面包含了dwr与服务器通讯的javascript脚本，你需要把index.jsp的form中的action换成你的struts action即可，然后把form中的file名改成你actionform中的file属性名，把页面中剩余的file去掉

index.jsp上传页面示例代码：

<%@ page contentType="text/html; charset=gb2312" language="java"

import="java.util.*" errorPage=""%>

<%

String path=request.getContextPath();

%>

<html locale="true">

<head>

<SCRIPT language=javascript>

function check_file() {

var strFileName=document.forms(0).file;

if (strFileName.value==""){

alert("请选择要上传的文件");

return false;

}

startProgress();

}

function loadmessage(){

<%

if (request.getAttribute("message") != null) {

%>

window.alert("<%=request.getAttribute("message")%>");

window.returnValue="yes";

<%}%>

}

</SCRIPT>

<title>上传</title>

<script src='<%=path%>/resources/js/upload.js'> </script>

<script src='<%=path%>/dwr/interface/UploadMonitor.js'> </script>

<script src='<%=path%>/dwr/engine.js'> </script>

<script src='<%=path%>/dwr/util.js'> </script>

<style type="text/css">

#progressBar { padding-top: 5px; }

#progressBarBox { width: 350px; height: 20px; border: 1px inset; background: #eee;}

#progressBarBoxContent { width: 0; height: 20px; border-right: 1px solid #444; background: blue; }

</style>

<LINK href="<%=path%>/css/style.css" type="text/css" rel="stylesheet">

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

</head>

<style type="text/css">

<!--

body {

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

}

-->

</style>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="loadmessage()">

<form name="form" method="post" action="<%=path%>/upload.do?method=upload" enctype="multipart/form-data"  onSubmit="return check_file()">

<table width="60%"  border="0" cellspacing="1">

<tr background-color=" #E7F5FE">

<td width="30%" align="right">从文件导入：</td>

<td width="51%"><input type="file" name="file" class="input"></td>

<td width="27%"><input type="submit" name="files" class="button_4"

style="border-style:None;width:71px;" value="确定" id="uploadbutton">

</td>

</tr>

<tr align="left" background-color=" #E7F5FE">

<td colspan="3">

<div id="progressBar" style="display: none;">

<div id="theMeter">

<div id="progressBarText"></div>

<div id="progressBarBox">

<div id="progressBarBoxContent"></div>

</div>

</div>

</div>

</td>

</tr>

</table>

</form>

</body>

</html>

并且要修改一下\resources\js中的upload.js文件：

/* Licence:

*   Use this however/wherever you like, just don't blame me if it breaks anything.

*

* Credit:

*   If you're nice, you'll leave this bit:

*

*   Class by Pierre-Alexandre Losson -- http://www.telio.be/blog 
*   email : plosson@users.sourceforge.net

*/

function refreshProgress()

{

UploadMonitor.getUploadInfo(updateProgress);

}

function updateProgress(uploadInfo)

{

if (uploadInfo.inProgress)

{

document.getElementById('uploadbutton').disabled = true;

document.getElementById('file').disabled = true;

var fileIndex = uploadInfo.fileIndex;

var progressPercent = Math.ceil((uploadInfo.bytesRead / uploadInfo.totalSize) * 100);

document.getElementById('progressBarText').innerHTML = '文件读取进度: ' + progressPercent + '%';

document.getElementById('progressBarBoxContent').style.width = parseInt(progressPercent * 3.5) + 'px';

window.setTimeout('refreshProgress()', 1000);

}

else

{

document.getElementById('uploadbutton').disabled = false;

document.getElementById('file').disabled = false;

}

return true;

}

function startProgress()

{

document.getElementById('progressBar').style.display = 'block';

document.getElementById('progressBarText').innerHTML = '文件读取进度: 0%';

document.getElementById('uploadbutton').disabled = true;

// wait a little while to make sure the upload has started ..

window.setTimeout("refreshProgress()", 1000);

return true;

}

配置dwr.xml

放在/WEB-INF/下面

<dwr>

<allow>

<create creator="new" javascript="UploadMonitor">

<param name="class" value="be.telio.mediastore.ui.upload.UploadMonitor"/>

</create>

<convert converter="bean" match="be.telio.mediastore.ui.upload.UploadInfo"/>

</allow>

</dwr>

web.xml中配置dwr，省略spring，struts等的配置

<servlet>

<servlet-name>dwr-invoker</servlet-name>

<display-name>DWR Servlet</display-name>

<servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>

<init-param>

<param-name>debug</param-name>

<param-value>false</param-value>

</init-param>

<init-param>

<param-name>logLevel</param-name>

<param-value>WARN</param-value>

</init-param>

</servlet>

<servlet-mapping>

<servlet-name>dwr-invoker</servlet-name>

<url-pattern>/dwr/*</url-pattern>

</servlet-mapping>

编写struts的MultipartRequestHandler ：AjaxMultipartRequestHandler

实现 MultipartRequestHandler接口并在struts-config.xml的controller中替换默认的multipartClass

<controller>

<set-property property="multipartClass"

value="org.springside.components.ajaxupload.AjaxMultipartRequestHandler" />

</controller>

其实这个类AjaxMultipartRequestHandler编写很简单，把struts的src源码中的org.apache.struts.upload.CommonsMultipartRequestHandler.java修改一下就可以了：

在public void handleRequest(HttpServletRequest request)

throws ServletException {

方法中把定义factory之前的那几行代码注释掉然后写入

UploadListener listener = new UploadListener(request, 30);

FileItemFactory factory = new MonitoredDiskFileItemFactory(listener);

之后再注释掉

// upload.setSizeThreshold((int) getSizeThreshold(ac));

// upload.setRepositoryPath(getRepositoryPath(ac));

这个类就算写完了

编写struts上传类

就用你原来编写的struts上传类

上传方法代码段示例：

/**

* 上传文件

*/

public ActionForward upload(ActionMapping mapping, ActionForm form,

HttpServletRequest request, HttpServletResponse response)

throws Exception {

String path = getServlet().getServletContext().getRealPath("/");

log.info(">>>>>>>>>>>>>>>path:" + path);

if (form == null) {

return mapping.findForward("success");

}

FileUploadForm fuf = (FileUploadForm) form;

FormFile file = fuf.getFile();

try {

if (file == null) {

log.info(">>>>>>>>>>>>>>>file为空");

return mapping.findForward("success");

}

} catch (Exception e) {

e.printStackTrace();

}

String fname = file.getFileName();

int t = 0;

for (int i = 0; i < fname.length(); i++) {

if (fname.charAt(i) == '.') {

t = i;

}

}

String filename = null;

if (t > 0) {

filename = fname.substring(0, t);

}

log.info(">>>>>>>>>>>>>>>文件名：" + filename);

String filepath = path + "dataimport/upfiles/" + fname;

File f = new File(path + "dataimport/upfiles/");

log.info(">>>>>>>>>>>>>>>文件生成路径：" + filepath);

if (!f.exists()) {

f.mkdirs();

} else {

log.info(">>>>>>>>>>>>>>>路径存在");

}

InputStream stream = file.getInputStream();

OutputStream os = new FileOutputStream(path + "dataimport/upfiles/"

+ fname);

int readBytes = 0;

byte buffer[] = new byte[8192];

while ((readBytes = stream.read(buffer, 0, 8192)) != -1) {

os.write(buffer, 0, readBytes);

}

os.close();

stream.close();

file.destroy();

String message = "成功！";

request.setAttribute("message", message);

return mapping.findForward("success");

}
附件是spring文件上传！！
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理
标签：
相关文章推荐
新的分享
章节导航