表单提交方式文件上传和ajax异步文件上传





一:首先是我在spring mvc下的表单提交方式上传

ssm的包配置我就不一一详细列出来了,但是上传的包我还是列出来





这一段我也不知道怎么给大家讲解就是直接贴代码了哈

前端的代码

<%@ 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>文件的上传和下载</title>
<script type="text/javascript" src="js/jquery-1.9.1.min.js"> </script>
<script type="text/javascript" src="js/jquery-form.js"> </script>
<script type="text/javascript">
</script>
</head>
<body>
<form method="POST" enctype="multipart/form-data" class="fill" action="testFileUpload4Files">
<table>
<tr>
<!-- 这里是多个文件上传 -->
<td>添加:</td>
<td><input type="file" name="file" /><br /> <input
type="file" name="file" /><br /> <input type="file" name="file" /><br />
<input type="file" name="file" /><br /></td>
</tr>
<tr>
<td>描述:</td>
<td><input type="text" name="desc" />
</td>
</tr>
<tr>
<td colspan="2"><input type="submit" value="上传" />
</td>
</tr>
</table>
</form>
</body>
</html>

这里的enctype默认是application/x-www-form-urlencoded当我们设置为multipart/form-data用以支持向服务器发送二进制数据这样我们才能上传。就是这样直接传递到服务器里面去

接下来就是支持多文件传递的服务端的代码

 @RequestMapping("/testFileUpload4Files")
public String addUser(@RequestParam("file") CommonsMultipartFile[] files,
HttpServletRequest request) {
for (int i = 0; i < files.length; i++) {
System.out.println("fileName:" + files[i].getOriginalFilename());
if (!files[i].isEmpty()) {
try {
files[i].transferTo(new File("d:\\temp\\" + files[i].getOriginalFilename()));
} catch (IllegalStateException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
}
}
return "/success";
}

现在就是直接选择文件提交表单就可以传递数据

二:ajax的异步文件上传



相信多数人都会提交表单方式上传文件但是遇到ajax可能有些没遇到过或者没得demo,我也是今天看了不少demo才知道可以用jquery-form.js这个插件来实现

插件里面我们可以直接调用ajaxForm实现异步上传,里面的种种方法定制上传样式就大家去实现了这里就只实现简单的上传,哈哈直接代码

前端代码

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"
contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path;
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta charset="utf-8">
<title>springmvc上传文件</title>
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="js/jquery-form.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("input[type='submit']").on("click", function() {
$(".fill").ajaxForm({
url : "testFileUpload4Files1", // 请求的url
type : "post", // 请求方式
dataType : "text", // 响应的数据类型
async : true, // 异步
success : function(data) {
alert(data);
},
error : function() {
alert("数据加载失败!");
}
});
});
});
</script>
</head>
<body>
<form method="POST" enctype="multipart/form-data" class="fill">
<table>
<tr>
<td>添加:</td>
<td><input type="file" name="file" /><br /> <input
type="file" name="file" /><br /> <input type="file" name="file" /><br />
<input type="file" name="file" /><br />
</td>
</tr>
<tr>
<td>描述:</td>
<td><input type="text" name="desc" /></td>
</tr>
<tr>
<td colspan="2"><input type="submit" value="上传" /></td>
</tr>
</table>
</body>
</html>

服务端我是返回他的一个文件名表示上传成功

@ResponseBody
@RequestMapping(value="/testFileUpload4Files1",produces = "text/html;charset=UTF-8")
public String ajaxUpload(@RequestParam("file") CommonsMultipartFile[] files,
HttpServletRequest request) {
StringBuffer buffer = new StringBuffer(); for (int i = 0; i < files.length; i++) {
buffer.append(files[i].getOriginalFilename());
System.out.println("fileName:" + files[i].getOriginalFilename());
if (!files[i].isEmpty()) {
try {
files[i].transferTo(new File("d:\\temp\\" + files[i].getOriginalFilename()));
} catch (IllegalStateException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
}
}
return buffer.toString();
}

好的写完了  提供大家参考的主要还是源码大家可以直接看源码

spring mvc ajax异步文件的上传和普通文件上传的更多相关文章

  1. 高性能的关键:Spring MVC的异步模式

    我承认有些标题党了,不过话说这样其实也没错,关于“异步”处理的文章已经不少,代码例子也能找到很多,但我还是打算发表这篇我写了好长一段时间,却一直没发表的文章,以一个更简单的视角,把异步模式讲清楚. 什 ...

  2. Spring MVC的异步模式

    高性能的关键:Spring MVC的异步模式   我承认有些标题党了,不过话说这样其实也没错,关于“异步”处理的文章已经不少,代码例子也能找到很多,但我还是打算发表这篇我写了好长一段时间,却一直没发表 ...

  3. Spring MVC的异步模式DefferedResult

    原文:http://www.importnew.com/21051.html 什么是异步模式 要知道什么是异步模式,就先要知道什么是同步模式,先看最典型的同步模式: (图1) 浏览器发起请求,Web服 ...

  4. Spring使用ajax异步上传文件

    单文件上传 <!-- 创建文件选择框 --> 文件上传 :<input type="file" id="file" name="fi ...

  5. Spring MVC+ajax进行信息验证

    本文是一个ajax结合Spring MVC使用的入门,首先我们来了解一下什么是Ajax AJAX 不是新的编程语言,而是一种使用现有标准的新方法.AJAX 最大的优点是在不重新加载整个页面的情况下,可 ...

  6. Spring MVC的异步模式(ResponseBodyEmitter、SseEmitter、StreamingResponseBody) 高级使用篇

    DeferredResult高级使用 上篇博文介绍的它的基本使用,那么本文主要结合一些特殊的使用场景,来介绍下它的高级使用,让能更深刻的理解DeferredResult的强大之处. 它的优点也是非常明 ...

  7. spring mvc对异步请求的处理

    在spring mvc3.2及以上版本增加了对请求的异步处理,是在servlet3的基础上进行封装的. 1.修改web.xml <?xml version="1.0" enc ...

  8. spring mvc ajax 提交复杂数组类型

    The server refused this request because the request entity is in a format not supported by the reque ...

  9. spring mvc ajax请求

    jar包中增加 jackson-annotations-2.5.0.jar jackson-core-2.5.0.jar jackson-databind-2.5.0.jar springmvx.xm ...

随机推荐

  1. (四)创建ROS程序包(就是软件包)

    你的 ROS 程序包都放到下面这个目录里, 切换到这个目录: $ cd ~/catkin_ws/src 使用下面的命令: 创建一个 ROS 程序包 名字就叫:beginner_tutorials $ ...

  2. 运行SVO

    安装与运行的所有文档:https://github.com/uzh-rpg/rpg_svo/wiki 有两种安装方式: 有ros:https://github.com/uzh-rpg/rpg_svo/ ...

  3. 线特征---LSD算法(二)

    上一节介绍了一些资源和实验结果,这节主要是介绍LSD算法理论. 直线段检测算法---LSD:a Line Segment Detector LSD的核心是像素合并于误差控制.利用合并像素来检测直线段并 ...

  4. pthreads v3在centos7下的安装与配置

    我的centos版本是7.4.1708,php的版本是7.2.4(注意要是线程安全版),如下图所示: 首先我们在如下网址下载好pthreads的源码: http://pecl.php.net/pack ...

  5. Faiss教程:索引(2)

    索引的I/O与复制 所有的函数都是深复制,我们不需要关心对象关系. I/O函数: write_index(index, "large.index"): 写索引到文件 Index * ...

  6. 比特币测试网络搭建以及RPC服务开启-配置注意事项

    .bitcoin QA Test环境 启动指定参数: "C:\Program Files (x86)\Bitcoin\bitcoin-qt.exe" -testnet -serve ...

  7. 前端基础之BOM和DOM day52

    前端基础之BOM和DOM   前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互 ...

  8. BZOJ 1093 [ZJOI2007]最大半连通子图 - Tarjan 缩点

    Description 定义一个半联通图为 : 对任意的两个点$u, v$,都有存在一条路径从$u$到$v$, 或从$v$到$u$. 给出一个有向图, 要求出节点最多的半联通子图,  并求出方案数. ...

  9. Cross-platform Tools

    MinGW和Cygwin都解决了C++跨平台交叉编译的问题,使Linux下的程序在Windows上编译运行成为可能. MinGW给习惯在Linux上开发的人员在windows上提供了一套类似的工具集: ...

  10. VS2010错误

    1.用VS2010生成C++程序时,链接器工具错误 LNK1123: fatal error LNK1123: failure during conversion to COFF: file inva ...