ajaxFileUpload文件上传

时间:2023-03-09 06:48:23
ajaxFileUpload文件上传

一、简介

  ajaxFileUpload是一种异步的文件上传控件,通过ajax进行文件上传,并获取上传处理结果。在很多时候我们需要使用到文件上传的功能,但是不需要使用那些强大的上传插件。此时就可以使用ajaxFileUpload。它基于jquery,本质是使用iframe完成上传。下载地址为:下载 。

二、实例  

  网页代码如下:

 <%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>文件上传</title>
</head>
<body>
<div>
<form id="formItem">
<div id="contentTable" style="border:0px;">
<h1 class="title" style="font-size:15px;border-bottom:1pxsolid#DFE3E6;">excel文件上传</h1>
<table width="80%">
<tr>
<td width="30%" align="right">
选择要上传的excel文件
</td>
<td width="70%" style="text-align:center;">
<input type="file" id="file1" name="file"/>
</td>
</tr>
</table>
<div>
<input type="button" value="导入&nbsp;"/>
</div>
</div>
</form>
</div>
<scriptsrc="${pageContext.request.contextPath}/res/js/jquery-1.9.1.min.js"type="text/javascript"></script>
<scriptsrc="${pageContext.request.contextPath}/res/js/ajaxfileupload.js"></script>
<scripttype="text/javascript">
var flag=false;
$(function(){
//文件类型过滤
$(":button").click(function(){
varfilepath = $("#file1").val();
vararr = new Array();
arr = filepath.split(".");
var fileType = new Array(["xls"],["xlsx"]);
for(var i = 0; i < fileType.length; i++){
if(arr[1] == fileType[i]){
flag = true;
}
}
if(flag){
ajaxFileUpload();
}else{
alert("请选择excel文件上传")
return false;
}
})
}); functionajaxFileUpload(){
$.ajaxFileUpload
(
{
url : '${pageContext.request.contextPath}/file/upload.action',//用于文件上传的服务器端请求地址
secureuri : false,//一般设置为false
fileElementId : 'file1',//文件上传空间的id属性
dataType : 'json',//返回值类型一般设置为json
success : function(data,status)//服务器成功响应处理函数
{
if(data){
alert("上传成功!");
$("#file1").val("");
}
flag = false;
},
error : function(data,status,e)//服务器响应失败处理函数
{
alert(e);
}
}
)
return false;
}
</script>
</body>
</html>

  服务器端代码如下:

    /**
*使用springmvc进行文件上传处理
*/
@RequestMapping("upload")
@ResponseBody
public boolean upload(HttpServletRequest request, HttpServletResponse response ) throws UnsupportedEncodingException
{
String path = request.getSession().getServletContext().getRealPath("");
Calendar calendar = Calendar.getInstance();
calendar.setTime(new Date());
request.setCharacterEncoding("UTF-8");
path = String.format("%s\\%s\\%s\\%s\\%s\\%s", path, "file", "upload", calendar.get(calendar.YEAR),
calendar.get(calendar.MONTH), calendar.get(calendar.DAY_OF_MONTH));
File filepath = new File(path);
if (!filepath.exists()) {
filepath.mkdirs();
} MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
// 获得文件
MultipartFile multipartFile = multipartRequest.getFile("file");
String filename = multipartFile.getOriginalFilename();
OutputStream os = null;
InputStream is = null;
File uploadFile = null;
try {
is = multipartFile.getInputStream();
if (is != null) {
uploadFile = new File(filepath, System.currentTimeMillis() + ".xls");
os = new FileOutputStream(uploadFile);
IOUtils.copy(is, os);
os.flush();
}
} catch (IOException e) {
e.printStackTrace();
return false;
} finally {
IOUtils.closeQuietly(os);
IOUtils.closeQuietly(is);
}
return true;
}