web客户端通过ajaxfileupload方式上传文件
fileUpload.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jQuery/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="jQuery/ajaxfileupload.js"></script>
<script type="text/javascript">
function fileClick(){
if (confirm("摄像文件录制完成，是否上传？(默认存放目录：C:\\OCXRecordFiles)")) {
$("#file").click();
} else {
return;
};
}
function ajaxFileUpload()
{
alert("ajaxFileUpload()函数");
$.ajaxFileUpload
(
{
url:'fileUploadServlet',//用于文件上传的服务器端请求地址
secureuri:false,//一般设置为false
fileElementId:'file',//文件上传空间的id属性 <input type="file" id="file" name="file" />
dataType: 'json',//返回值类型 一般设置为json
data: {//加入的文本参数
"logoPath": "param1",
"logoName": "param2"
},
success: function (data, status) //服务器成功响应处理函数
{
alert("ajax成功返回");
//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 true;
} function openBrowse(){
var ie=navigator.appName=="Microsoft Internet Explorer" ? true : false;
if(ie){
document.getElementById("file").click();
document.getElementById("filename").value=document.getElementById("file").value;
}else{
var a=document.createEvent("MouseEvents");//FF的处理
a.initEvent("click", true, true);
document.getElementById("file").dispatchEvent(a);
}
}
</script>
</head>
<body>
<input type="file" id="file"name="file" style="display:none" onchange="ajaxFileUpload()"/>
<input type="button" name="button" value="点我就像点击“浏览”按钮一样" onclick="javascript:openBrowse();" />
<input type="text" id="filename"/>
<!--
<input type="file" id="file" name="file" onchange="ajaxFileUpload()" accept="audio/mp4, video/mp4, image/jpeg" style=""/>
<input type="button" value="上传" onclick="fileClick()">
-->
<!--
<style>
#file{position:absolute;filter:alpha(opacity=0);opacity:0;size:1;width:50px}
</style> <input type="file" id="file" name="file" onchange="ajaxFileUpload()" accept="audio/mp4, video/mp4, image/jpeg" />
<input type="button" value="上传" >
-->
<FORM METHOD=POST ACTION="fileUploadServlet" enctype="multipart/form-data">
<A hideFocus class=addfileA id=aComposeAttach href="#"> <INPUT hideFocus class=addfileI type=file size=1 name="FF" onchange="this.form.submit()"></A>
<INPUT TYPE="submit" value="提交">
</FORM> </body>
</html>
后台 FileUploadServlet.java
package com.zm.servlet;
import java.io.File;
import java.io.IOException;
import java.util.Iterator;
import java.util.List; import javax.servlet.ServletException;
//import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse; import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.FileUploadException;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload; /**
* Servlet implementation class FileUpload
*/
//@WebServlet("/FileUpload")
public class FileUploadServlet extends HttpServlet {
private static final long serialVersionUID = 1L; /**
* @see HttpServlet#HttpServlet()
*/
public FileUploadServlet() {
super();
// TODO Auto-generated constructor stub
} /**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub File tmpDir = new File("E:/Downloads/tmp/"); //临时存放目录
String saveDir = "E:/Downloads/upload/"; //最终存放目录 // 检查是否有一个文件上传请求
boolean isMultipart = ServletFileUpload.isMultipartContent(request);
if (!isMultipart) {
return;
} // 创建一个基于硬件磁盘文件项的工厂
DiskFileItemFactory factory = new DiskFileItemFactory(); //指定在内存中缓存数据大小,单位为byte,这里设为1Mb
factory.setSizeThreshold(1024);
//设置一旦文件大小超过getSizeThreshold()的值时数据存放在硬盘的目录
factory.setRepository(tmpDir); ServletFileUpload upload = new ServletFileUpload(factory); //setProgressListener
//upload.setProgressListener(new FileUploadProgressListener()); // Parse the request
List items = null;
try {
items = upload.parseRequest(request);
} catch (FileUploadException e1) {
// TODO Auto-generated catch block
e1.printStackTrace();
} // Process the uploaded items
Iterator iter = items.iterator();
while (iter.hasNext()) {
FileItem item = (FileItem)iter.next(); //整个表单的所有域都会被解析，要先判断一下是普通表单域还是文件上传域
if (item.isFormField()) {
String name = item.getFieldName();
String value = item.getString();
System.out.println(name + ":" + value);
} else {
String fieldName = item.getFieldName();
String fileName = item.getName();
String contentType = item.getContentType();
boolean isInMem = item.isInMemory();
long sizeInBytes = item.getSize();
if(fileName.contains(":")){
String[] sArray = fileName.split("\\\\");
int iLength = sArray.length;
fileName = sArray[iLength -1];
}
System.out.println(fieldName + ":" + fileName);
System.out.println("类型：" + contentType);
System.out.println("是否在内在：" + isInMem);
System.out.println("文件大小" + sizeInBytes); File uploadedFile = new File(saveDir + fileName);
try {
item.write(uploadedFile);
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
}
} /**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
this.doGet(request, response);
} }
web.xml
<!-- 测试jquery fileUpload -->
<servlet>
<servlet-name>fileUploadServlet</servlet-name>
<servlet-class>com.zm.servlet.FileUploadServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>fileUploadServlet</servlet-name>
<url-pattern>/fileUploadServlet</url-pattern>
</servlet-mapping>
web客户端通过ajaxfileupload方式上传文件的更多相关文章
- 通过Ajax方式上传文件，使用FormData进行Ajax请求
通过传统的form表单提交的方式上传文件: <form id= "uploadForm" action= "http://localhost:8080/cfJAX_ ...
- 【转】JQuery插件ajaxFileUpload 异步上传文件（PHP版）
前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错,但是由于手机不支持flash,所以不得不再找一个文件上传插件来用了.后来发现a ...
- [转] 通过Ajax方式上传文件，使用FormData进行Ajax请求
通过传统的form表单提交的方式上传文件: <form id= "uploadForm" action= "http://localhost:8080/cfJAX_ ...
- JQuery插件ajaxFileUpload 异步上传文件（PHP版）
太久没写博客了,真的是太忙了.善于总结,进步才会更快啊.不多说,直接进入主题. 前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错 ...
- ajaxfileupload异步上传文件
ajaxfileupload插件可以以异步方式上传文件(其实现:iframe),不像传统那样需要刷新,下面就介绍下其使用 1.HTML部分(先引入jquery): <!DOCTYPE html& ...
- Ajax方式上传文件
用到两个对象 第一个对象:FormData 第二个对象:XMLHttpRequest 目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象,但IE9尚未支持 For ...
- Android必知必会-使用okhttp的PUT方式上传文件
注:如果移动端排版有问题,请看 简书版 (<-点击左边),希望CSDN能更好的支持移动端. 背景 公司的文件上传接口使用PUT协议,之前一直用的都是老项目中的上传类,现在项目中使用了okhttp ...
- koa2：通过Ajax方式上传文件，使用FormData进行Ajax请求
koa2通过表单上传的网上很多,但通过Ajax方式上传文件,使用FormData进行Ajax请求,不好找. 参考了这个用base64上传图片的例子.https://github.com/Yuki-Mi ...
- 前端 - jquery方式 / iframe +form 方式 上传文件
环境与上一章一样 jquery 方式上传文件: HTML代码 {#html代码开始#} <input type="file" id="img" > ...
随机推荐
- C# @符号的多种使用方法
1.限定字符串用 @ 符号加在字符串前面表示其中的转义字符“不”被处理.如果我们写一个文件的路径,例如"D:/文本文件"路径下的text.txt文件,不加@符号的话写法如下:str ...
- OpenGL5-纹理贴图
代码下载 #include "CELLWinApp.hpp"#include <gl/GLU.h>#include <assert.h>#include & ...
- Bootstrap学习笔记(二) 表单
在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...
- 暑假集训(4)第四弹 -----排列，计数（hdu1465)
题意概括:嗯,纵使你数次帮助小A脱离困境,但上一次,小A终于还是失败了.那数年的奔波与心血,抵不过轻轻一指,便彻底 湮灭,多年的友谊终归走向末路.这一切重击把小A彻底击溃! 不为什么,你到底还是要继续 ...
- event事件：
onabort: 图像的加载被中断onblur: 元素失去焦点onchange: 域的内容被改变onclick: 当用户点击某个对象时调用的事件句柄ondblclick: 当用户双击某个对象时调用的事 ...
- mysql中使用update select
UPDATE t_user INNER JOIN t_shake ON t_shake.user_id = t_user.user_id SET t_user.shake_total_num = t_ ...
- jdbc学习（一）——SqlServer、Oracle和MySQL
一.jdbc介绍 jdbc全称:java数据库连接(Java Database Connectivity),是sun公司定义的一套访问数据库的规范(接口和类,由各种数据库公司进行实现),主要放在jav ...
- CorelDRAW 文件实用工具 CDRTools 2
随着 CorelDRAW 更新脚步越来越频繁,版本之间兼容性问题越来越突出,特别是跨版本之间打开会有很多问题,比如:文字跑位.透镜变向.位图出错.颜色改变,甚至会造成文件损坏.最好的办法就是哪一个版本 ...
- 谈谈python 中__name__ = '__main__' 的作用
最近刚刚学习python,看到别人的源代码中经常出现这样一个代码段: if __name__ = '__main__' dosomting() 觉得很晕,不知道这段代码的作用是什么,后来上网查了一些资 ...
- Linux命令执行顺序— ||和&&和;
command1 && command2: &&左边的command1执行成功(返回0表示成功)后,&&右边的command2才能被执行. comman ...