Ajax异步上传在SSM框架中的应用
最近在做毕业设计,由于毕设中要实现图片上传和视频上传的功能。突然发现原来的Form表单中的file已经满足不了我了,于是在一番折腾之后终于让我找到了一个简便的上传方式。下面来和大家分享一下我的过程。
第1步:首先你需要一个ajax的上传文件的脚本,就是这个脚本,在github上找到的,非常好用,云盘链接下载。下载完成后将它加进你的项目中。
链接:https://pan.baidu.com/s/1i57vxB3 密码:5ype
第2步:配置spring-servlet.xml文件,具体配置内容如下:
<!-- 文件上传 -->
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <property name="maxUploadSize">
<value>104857600</value>
</property>
<property name="maxInMemorySize">
<value>4096</value>
</property>
</bean>
第3步:在jsp页面中引用上传的脚本,调用ajaxFileUpload函数
<script src="js/ajaxfileupload.js" type="text/javascript"></script>
<script type="text/javascript">
function imageUpload(){
$.ajaxFileUpload({
url : 'uploadSong.do', //用于文件上传的服务器端请求地址
fileElementId : 'file1', //文件上传空间的id属性 <input type="file" id="file" name="file" />
type : 'post',
dataType : 'text', //返回值类型 一般设置为json
success : function(data, status) //服务器成功响应处理函数
{
alert("歌曲上传成功");
},
error : function(data, status, e)//服务器响应失败处理函数
{
alert("歌曲上传失败");
}
});
}
</script>
第4步:在controller中处理请求发来的数据
/**
* 歌曲上传
* @return
* @throws IOException
*/
@RequestMapping(value = "uploadSong", method = RequestMethod.POST)
public @ResponseBody
String uploadSong(HttpServletRequest request,
HttpServletResponse response, ModelMap model,HttpSession session) throws IOException {
MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
MultipartFile mFile = multipartRequest.getFile("song");
String path="H:\\毕业设计\\KTVworkspace\\KtvSystem\\WebContent\\video\\";//替换成你所要保存的文件的位置
String filename = mFile.getOriginalFilename();
System.out.println("filename:"+filename);
InputStream inputStream = mFile.getInputStream();
byte[] b = new byte[1048576];
int length = inputStream.read(b);
String url =path + filename;
System.out.println(url);
FileOutputStream outputStream = new FileOutputStream(url);
outputStream.write(b, 0, length);
inputStream.close();
outputStream.close();
return filename;
}
哈哈哈,大功告成!
Ajax异步上传在SSM框架中的应用的更多相关文章
- 基于Flask开发网站 -- 前端Ajax异步上传文件到后台
大家好,我是辰哥~ 辰哥最近利用空闲时间在写一个在线可视化平台,过程中也觉得一些技术还是比较有意思的,所以就以模块化的形式分享出来.如:从网页界面(前端)上传文件到服务器(后端). 放一下该模块的界面 ...
- html5+php实现文件的断点续传ajax异步上传
html5+php实现文件的断点续传ajax异步上传 准备知识:断点续传,既然有断,那就应该有文件分割的过程,一段一段的传.以前文件无法分割,但随着HTML5新特性的引入,类似普通字符串.数组的分割, ...
- Spring使用ajax异步上传文件
单文件上传 <!-- 创建文件选择框 --> 文件上传 :<input type="file" id="file" name="fi ...
- ajax异步上传文件和表单同步上传文件 的区别
1. 用表单上传文件(以照片为例)-同步上传 html部分代码:这里请求地址index.php <!DOCTYPE html> <html lang="en"&g ...
- 利用struts2进行单个文件,批量文件上传,ajax异步上传以及下载
利用struts2进行单个文件,批量文件上传,ajax异步上传以及下载 1.页面显示代码 <%@ page language="java" import="java ...
- java使用xheditor Ajax异步上传错误
java使用xheditor Ajax异步上传时候错误如下:the request doesn't contain a multipart/form-data or multipart/mixed s ...
- 【文件上传】文件上传的form表单提交方式和ajax异步上传方式对比
一.html 表单代码 …… <input type="file" class="file_one" name="offenderExcelFi ...
- ajax 异步上传视频带进度条并提取缩略图
最近在做一个集富媒体功能于一身的项目.需要上传视频.这里我希望做成异步上传,并且有进度条,响应有状态码,视频连接,缩略图. 服务端响应 { "thumbnail": "/ ...
- ajax异步上传文件FormDate方式,html支持才可使用
今天需要做一个头像的预览功能,所以我想到了异步上传文件. 总结几点: 异步上传难点: 文件二进制流如何获取 是否需要设置表单的头,就是content-Type那里.异步,所以无所谓了吧. 其他就差不多 ...
随机推荐
- java+上传大视频文件断点续传
上周遇到这样一个问题,客户上传高清视频(1G以上)的时候上传失败. 一开始以为是session过期或者文件大小受系统限制,导致的错误. 查看了系统的配置文件没有看到文件大小限制, web.xml中s ...
- Libreoffice/Office:禁止首字母自动大写功能
造冰箱的大熊猫@cnblogs 2019/1/24 在LibreOffice(5.1.6.2)中,要禁止或者使能首字母自动大写功能,点击菜单项“Tools>>AutoCorrect Op ...
- 一篇不错的BIO, NIO文章
菜菜的我硬是读了2个小时, 哭了 BIO到NIO源码的一些事儿之BIO https://juejin.im/post/5c2cc075f265da611037298e#heading-3 整体上 BI ...
- flask框架(六): 实现支持正则的路由
一:默认路由 @app.route('/user/<username>') @app.route('/post/<int:post_id>') @app.route('/pos ...
- 通过PCI9030向外部RAM写数据失败现象
我们的系统方案是:以9030作为PCI接口芯片,本地端映射了一片IDT70V06的双端口RAM.进行数据传输压力测试时,发现PC机向IDT70V06写数据偶尔会失败.这一问题是什么原因造成的呢? 最初 ...
- mysql中in查询中排序
mysql中in查询条件的时候,很多时候排序是不规则的,如何按照in里面的条件进行排序呢? mysql中给出了办法,在in后面加order by field,order by field的首个条件是按 ...
- 未关闭虚拟机直接关闭vmware引发的一系列问题——Windows下linux虚拟机
虚拟机长时间挂起重新打开时卡顿,无法开启,脑抽直接关闭了vmware软件引起的一系列问题. 原因是关闭了vmware,但是相应的虚拟机并没有关闭,所以虚拟机不能重开 会出现如下提示 解决方案如下: 1 ...
- Vue_(组件)过渡效果
Vue.js进入/离开 & 列表过渡 传送门 进入/离开过渡效果:Vue在插入.更新或移除DOM时,可以设置一些动画效果: 过渡效果中也提供了对应的钩子函数,这些钩子函数需要在<tran ...
- 「CF803C」 Maximal GCD
题目链接 戳我 \(Solution\) 令\(gcd\)为\(x\),那么我们将整个序列\(/x\),则序列的和就变成了\(\frac{n}{x}\),所以\(x\)必定为\(n\)的约数所以现在就 ...
- 08.青蛙跳台阶 Java
题目描述 一只青蛙一次可以跳上1级台阶,也可以跳上2级.求该青蛙跳上一个n级的台阶总共有多少种跳法(先后次序不同算不同的结果). 思路 暴力枚举(自顶向下递归): 若台阶数小于等于0,返回0: 若台阶 ...