h5里js和servlet实现文件上传的实现步骤

来源：懂视网责编：小采时间：2020-11-27 15:27:29

h5里js和servlet实现文件上传的实现步骤

h5里js和servlet实现文件上传的实现步骤:这次教大家的是在H5里如何用JS和servlet来实现文件上传，不过有一个前提条件，必须要是h5和jsp3.0版本，因为用到了新属性，获取file对象和后台得到part对象。下面给大家看一个案列前台jsp<%@ page language="java" cont

推荐度：

点击下载本文 文档为doc格式

导读h5里js和servlet实现文件上传的实现步骤:这次教大家的是在H5里如何用JS和servlet来实现文件上传，不过有一个前提条件，必须要是h5和jsp3.0版本，因为用到了新属性，获取file对象和后台得到part对象。下面给大家看一个案列前台jsp<%@ page language="java" cont

这次教大家的是在H5里如何用JS和servlet来实现文件上传，不过有一个前提条件，必须要是h5和jsp3.0版本，因为用到了新属性，获取file对象和后台得到part对象。

下面给大家看一个案列

前台jsp

<%@ page language="java" contentType="text/html; charset=utf-8"
 pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://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-3.2.1.min.js"></script>
</head>
<body>
 <p>
 name:<input type="text" id="name"/>
 文件：<input type="file" id="file"/>
 <br>
 <button id="btu" onclick="btu()">提交</button>
 </p>
</body>
 
<script>
 function btu(){
 var name=$("#name").val();
 var file=$("#file")[0].files[0];//新特性，获取文件对象
 var fordata=new FormData();//新特性，得到formData对象，把获取的值扔进去，相当于map
 fordata.append("name",name);
 fordata.append("file",file);
 console.log(file)
 $.ajax({
 url:"/war-2/UpdataFile",
 data:fordata,
 cache:false,
 processData:false, //必须写
 contentType:false, //必须写
 type:"post",
 success:function(data){
 
 }
 })
 }
</script>
</html>

后台java

package up;
 
import java.io.File;
import java.io.IOException;
import java.util.Collection;
 
import javax.servlet.ServletException;
import javax.servlet.annotation.MultipartConfig;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.Part;
 
/**
 * Servlet implementation class UpdataFile
 */
@MultipartConfig(location="E:/")
@WebServlet("/UpdataFile")
public class UpdataFile extends HttpServlet {
 private static final long serialVersionUID = 1L;
 
 private File file;
 protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
 // TODO Auto-generated method stub
 System.out.println("1111111111");
 }
 
 /**
 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
 */
 protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
 // TODO Auto-generated method stub
 //得到part对象，这个对象有write的方法，直接写到指定位置。但是千万别忘了写@MultipartConfig(location="E:/")注解，不指定位置默认是写到注解指定的位置。
 Part part = request.getPart("file");
 //普通的字段可以采用常规的getparamter的方法得到。
 System.out.println(new String(request.getParameter("name").getBytes("iso-8859-1"),"utf-8"));
 System.out.println(part.getName());
 System.out.println(part.getHeader("Content-Disposition"));
 System.out.println(part.getSize());
 String fileName = getFileNameFromPart(part); 
 part.write(fileName); 
 }
 //截取文件名 
 public String getFileNameFromPart(Part part) { 
 String header = part.getHeader("Content-Disposition"); 
 String fileName = header.substring(header.indexOf("filename=\"")+10, header.lastIndexOf("\"")); 
 return fileName; 
 } 
}

相信看了这些案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！

h5里js和servlet实现文件上传的实现步骤

推荐度：

点击下载本文 文档为doc格式

标签：文件实现 js

热门焦点

h5里js和servlet实现文件上传的实现步骤

h5里js和servlet实现文件上传的实现步骤

h5里js和servlet实现文件上传的实现步骤

最新推荐

猜你喜欢

热门推荐