• 售前

  • 售后

热门帖子
入门百科

vue form表单post请求结合Servlet实现文件上传功能

[复制链接]
楚一帆 显示全部楼层 发表于 2021-10-25 19:55:02 |阅读模式 打印 上一主题 下一主题
前端测试页面代码:
  1. <template>
  2. <div>
  3.   <input type="file" name="file" @change="change($event)">
  4. </div>
  5. </template>
  6. <script>
  7. export default {
  8.   created(){
  9.    this.path = this.$route.query;
  10.    for (let i in this.path) {
  11.     this[i] = decodeURIComponent(this.path[i]);
  12.    }
  13.   },
  14.   methods:{
  15.    change(ev){
  16.     let file = ev.target.files[0];
  17.     let size = file.size;
  18.     let name = file.name;
  19.     if(size > 314572800){
  20.      this.$message.warning('上传文件不能超过300M');
  21.      return;
  22.     }
  23.     let formData = new FormData();
  24.     formData.append('file',file,name)
  25.     this.$axios.post('/JT3'+this.getddRecordDelete,formData,{
  26.      headers:{"Content-Type":"multipart/form-data"}
  27.     }).then(data=>{
  28.      console.log(data);
  29.     })
  30.    }
  31.   }
  32. }
  33. </script>
  34. <style scoped>
  35. </style>
复制代码
后端servlet吸取代码
  1. package jt3.control.zygkh;
  2. import java.io.File;
  3. import java.io.FileOutputStream;
  4. import java.io.IOException;
  5. import java.io.InputStream;
  6. import java.util.List;
  7. import javax.servlet.ServletException;
  8. import javax.servlet.annotation.WebServlet;
  9. import javax.servlet.http.HttpServlet;
  10. import javax.servlet.http.HttpServletRequest;
  11. import javax.servlet.http.HttpServletResponse;
  12. import org.apache.commons.fileupload.FileItem;
  13. import org.apache.commons.fileupload.FileUploadException;
  14. import org.apache.commons.fileupload.disk.DiskFileItemFactory;
  15. import org.apache.commons.fileupload.servlet.ServletFileUpload;
  16. import jtacc.filter.JTKit;
  17. import jtacc.jtpub.DT;
  18. @WebServlet(urlPatterns = "/upfile/file")
  19. public class UploadServlet extends HttpServlet {
  20.         private static final long serialVersionUID = 1L;
  21.         protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  22.                 System.out.println(11);
  23.                 this.doPost(request, response);
  24. }
  25. protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  26.         String uri="/u/file/"+DT.getFormatDate("yyyyMMdd")+"/"; //定义路径
  27.         String tmpPath=JTKit.getBaseDIR()+uri;//此处为个人项目路径,根据需求定义路径
  28.         DiskFileItemFactory factory = new DiskFileItemFactory();
  29.                 factory.setRepository(new File(tmpPath));//临时文件存储路径
  30.                 ServletFileUpload fileUpload = new ServletFileUpload(factory);//核心操作对象
  31.                 fileUpload.setHeaderEncoding("utf-8");//防乱码
  32.                 try {
  33.                         //此处如果要实时强行转换则需要下载jar包(commons-fileupload-1.3.3.jar)
  34.                         List<FileItem> list = fileUpload.parseRequest(request);
  35.                         for (FileItem fileItem : list) {
  36.                                 InputStream in = fileItem.getInputStream();
  37.                                 String filename = fileItem.getName();
  38.                                 if (fileItem != null) {
  39.                                         System.out.println(filename);
  40.                                         int len = 0;
  41.                                         byte[] array = new byte[1024];
  42.                                         FileOutputStream fos = new FileOutputStream(tmpPath+filename);
  43.                                         while((len = in.read(array))!=-1){//表示每次最多读1024个字节
  44.                                                 fos.write(array,0,len);
  45.                                                 fos.flush();
  46.                                         }
  47.                                         fos.close();
  48.                                         in.close();
  49.                                         fileItem.delete();
  50.                                         response.setCharacterEncoding("UTF-8");
  51.                                         String realPath = uri+filename;
  52.                                         response.getWriter().append(realPath);
  53.                                 }
  54.                         }
  55.                 } catch (FileUploadException e) {
  56.                         // TODO Auto-generated catch block
  57.                         e.printStackTrace();
  58.                 }
  59. }
  60. }
复制代码
测试效果

补充:Servlet获取表单提交过来的数据
在Servlet的doPost方法:
  1. protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  2. }
复制代码
中获取表单数据,首先,为了防止出现中文乱码问题,需要给request设置编码为“UTF-8”:
  1. request.setCharacterEncoding("utf-8");
复制代码
获取单个字符串的方式:
  1. <pre style="font-family: 宋体; font-size: 12pt; background-color: rgb(255, 255, 255);"><span style="font-size:18px; font-family: Arial, Helvetica, sans-serif; background-color: rgb(240, 240, 240);">String username = request.getParameter("username");</span>
复制代码
获取字符串数组的方式:
  1. String[] favorites = request.getParameterValues("favorite");
复制代码
以上为个人经验,盼望能给各人一个参考,也盼望各人多多支持草根技能分享。如有错误或未思量完全的地方,望不吝赐教。

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

帖子地址: 

回复

使用道具 举报

分享
推广
火星云矿 | 预约S19Pro,享500抵1000!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

草根技术分享(草根吧)是全球知名中文IT技术交流平台,创建于2021年,包含原创博客、精品问答、职业培训、技术社区、资源下载等产品服务,提供原创、优质、完整内容的专业IT技术开发社区。
  • 官方手机版

  • 微信公众号

  • 商务合作