实现后端对Ajax的FormData对象所传文件的接收
ServletFileUpload的依赖库链接:
/s/14MfxOghnP-t1Q-sAQDh6kA
提取码:hcyc
前端FormData:
<form method="post" enctype="multipart/form-data" action="" style=" width: 80%; margin:0 auto;">
<!-- form要设置 enctype="multipart/form-data",formdata识别标识 -->
<label >
<input type="file" name="file" style="left:-10030px;position:absolute;">
<span>附件选择</span>
</label>
<!-- file input渲染 -->
</div>
<span style="color:red"></span>
</div>
<!-- 文件名 -->
<button class="layui-btn" lay-submit lay-filter="formDemo" onclick="load()">发布</button>
<!-- 按钮 -->
</form>
<script type="text/javascript">
let input=("test1");
let span=("filename");
=function(){
=[0].name;
<!-- 文件名获取赋值 -->
}
function load(){
let my;
let form=("form1");
let data=new FormData(form);
<!-- 将表单转为对象 -->
if(){
my=new XMLHttpRequest();
}else{
try{
my=new ActiveXObject("");
}catch(e){
my=new ActiveXObject("");
}
}
<!-- ajax -->
let pp=("div");
="0%";
="15px";
="progress";
="0%";
="background:rgba(0,255,0,0.75);box-shadow:0px 0px 50px 0px #fff;border-radius:30px;padding-left:50%"
(pp);
<!-- 进度条 -->
let progress=("progress");
=function(){
if(==4&&==200){
="100%";
="100%";
alert();
();
}
};
<!-- 传输成功 -->
<!-- 上传中触发 -->
=function(event){
if(){<!-- 文件长度是否可计算 -->
let x=(/)*100;<!-- 已上传大小/总大小 -->
let x2=(x);<!-- 取整数 -->
=x2-1+"%";
=x2-1+"%";
}
}
=function(){
<!-- 上传完成触发 -->
}
('POST','/maven_web/upload',true);
<!-- FormData只能用POST方式 ,并且不能设置RequestHeader-->
if(confirm("你确定提交吗?")){
(data);
}else{
();
alert("提交已取消!");
}
}
</script>
后端处理:
package PCServlet;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
/**
* Servlet implementation class A
*/
@WebServlet("/upload")
public class PCMessageReceiver extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
("utf-8");
("text/html;charset=utf-8");
String hasMultipart=""; //是否携带附件
File file=null;
FileItem fileitem=null;
String s=().toString().replaceAll("-", "");
String UUID=s;
boolean bb=(request);
<!-- 判断是否有enctype="multipart/form-data" -->
if(bb) {
FileItemFactory factory=new DiskFileItemFactory();
ServletFileUpload load=new ServletFileUpload(factory);
try {
List<FileItem> list=(request);
<!-- 解析请求 -->
Iterator<FileItem> it=();
while(()) {
FileItem item=();
if(()) {
<!-- 判断是否是普通表单字段 -->
String fieldName=();
<!-- 表单字段名 -->
switch(fieldName) {
case "title":title=("utf-8");break;
case "city":level=("utf-8");break;
case "class":(("utf-8"));break;
case "desc":area=("utf-8");break;
}
// (("utf-8"));
<!-- 获取value值;必须附上utf-8编码,否则出现中文乱码 -->
}else {
if(!().isEmpty()) {<!-- 判断是否选择文件 -->
fileitem=item;
String name=();
<!-- 获取文件名(完整路径) -->
name=(("/")+1);
hasMultipart=name;
InputStream in=().getResourceAsStream("properties/");
Properties p=new Properties();
(in);
String path=(String)("upload");
<!-- 文件保存路径 -->
name=(("."));
file=new File(path,UUID+name);
}
}
}
} catch (Exception e) {
// TODO Auto-generated catch block
();
}
}
try {if(fileitem!=null) {
(file);
<!-- 保存文件 -->
}
} catch (Exception e) {
// TODO Auto-generated catch block
();
}
}
}
注意:只要使用FormData,那么就只能使用以上方式获取参数,即使没有上传文件