这篇文章主要介绍了使用创建交互式、快速动态网页应用的网页开发技术实现上传文件,无需任何插件,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
本文实例为大家分享了使用创建交互式、快速动态网页应用的网页开发技术实现上传文件的具体代码,供大家参考,具体内容如下
需求:
在前端页面选择文件上传到服务器的指定位置
前端代码
表单id=上传表单方法= post enctype= multipart/form-data
标签上传电子书/标签
输入类型=文件名称=文件
按钮id=上传类型=按钮名称=按钮上传/按钮
/表单
$(#upload ).单击(函数(){
var formData=new formData($( # upload form )[0]);
$.ajax({
类型: post ,
url: https://****:8443/fileUpload ,//上传文件的请求路径必须是绝对路劲
数据:formData,
缓存:假,
processData: false,
contentType: false,
}).成功(函数(数据){
console.log(数据);
警报(上传成功数据);
文件名=数据;
}).错误(函数(){
警报(上传失败);
});
});
首先创建一个表单数据实例,也就是空对象,将页面中现有形式表单将他初始化。通过创建交互式、快速动态网页应用的网页开发技术提交给后台
后端代码
@ post映射(value=/file upload )
@ResponseBody
公共字符串文件上载(@ request param(value= file )多部分文件文件,模型模型,HttpServletRequest请求){
if (file.isEmpty()) {
System.out.println(文件为空空);
}
字符串fileName=file。getoriginalfilename();//文件名
系统。出去。println(文件。getoriginalfilename());
字符串后缀名称=文件名。子字符串(文件名。lastindexof( . )));//后缀名
字符串文件路径= C://pdf//;//上传后的路径
fileName=UUID.randomUUID()后缀姓名;//新文件名
文件目的地=新文件(文件路径文件名);
System.out.println(pdf文件路径为:目的地。getpath());
如果(!dest.getParentFile().exists()) {
dest.getParentFile().mkdirs();
System.out.println(上传可移植文档格式文件的扩展名(可移植文档格式的缩写)文件);
System.out.println(pdf文件路径为:目的地。getpath());
}
尝试{
文件。transfer to(dest);
} catch (IOException e) {
e。printstacktrace();
}
字符串fileName=/pdf/ fileName;
返回文件名;
}
注意
1.@RequestParam(value="file ")中的文件需要和投入中的名字属性一致。
2.提交按钮类型Type="Button "如果为"提交"的话,提交完数据会刷新一次页面。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。