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" > ...
随机推荐
- spring读取prperties配置文件（1）
博客地址http://www.cnblogs.com/shizhongtao/p/3438431.html 属性文件命名是*.properties,在java中,用类java.util.Propert ...
- ZigBee协议学习之网络层
ZigBee的体系结构中,底层采用IEEE 802.15.4的物理层和媒介层,再次基础上,ZigBee联盟建立了自己的网络层(NWL)和应用层框架. ZigBee网络层的主要功能包括设备的连接和断开. ...
- 从 Java 代码逆向工程生成 UML 类图和序列图
from:http://blog.itpub.net/14780914/viewspace-588975/ 本文面向于那些软件架构师,设计师和开发人员,他们想使用 IBM® Rational® Sof ...
- 锋利的qjuey-ajax
jquery 中的ajax load方法主要获取web服务器上静态数据 1 load方法载入HTML文档 load(url [,data] [,callback]) $(function(){ $ ...
- DB2删除数据时的小技巧
大家对如何删除数据都不陌生,我们习惯性的这么写: 其实这么写性能并不好,尤其是删除大量数据的时候,要想获得更好的性能,可以采用如下方式: 那如果要把一个表的所有数据都删除了,该怎么办?有人可能会说,这 ...
- 基于css3新属性transform及原生js实现鼠标拖动3d立方体旋转
基于css3新属性transform,实现3d立方体的旋转 通过原生JS,点击事件,鼠标按下.鼠标抬起和鼠标移动事件,实现3d立方体的拖动旋转,并将旋转角度实时的反应至界面上显示 实现原理:通过获取鼠 ...
- OWIN OAuth 2.0 Authorization Server
http://www.asp.net/aspnet/overview/owin-and-katana/owin-oauth-20-authorization-server The assumption ...
- phpcmsv9全站搜索,不限模型
简单修改一下v9默认的搜索功能,可以不按模型搜索全站内容 下面是被修改后的search模块中的index.php文件 <?php defined('IN_PHPCMS') or exit('No ...
- 解决java.io.IOException: Cannot run program "cygpath": CreateProcess error=2, 系统找不到指定的文件 的错误
一.外部环境: 系统环境:Windows 8 磁盘分区:只有C盘 开发环境:IntelliJ IDEA Community Edition 2016.1.3(64) 执行代码:rdd.saveAsTe ...
- thinkphp 使用过程中遇到的一个小函数
1.实现导出Excel文件,并在导出的文件中显示图片 //导出 public function push(){ $goods_list=M('Dajia')->select(); $data = ...