element upload 后台如何接数据---记录

本人小白一个，在项目中使用element upload踩了好多坑。项目前台为vue+element,后台为Springboot,图片存储在七牛云上。采坑原因对底层东西不理解，对项目所使用的框架不熟悉。

问题描述：

    element upload传输的数据格式：request payload(刚刚看到都不明白这是一种数据格式)

在后台使用了各种方法接数据都不行，后面直接从HttpServletRequest中拿数据流来接数据还是不行。最后查询了一下request payload才发现request payload是一种数据格式，百度request payload的接收方法才成功接收到request payload。

 @RequestMapping("/upload")
    public String uploadPic(HttpServletRequest request,HttpServletResponse resp){

            InputStream is;
            ServletOutputStream out;
            String key=null;
       
        try {
            Collection<Part> parts=request.getParts();
            Iterator<Part> iterator=parts.iterator();
            while (iterator.hasNext()) {
                Part part = iterator.next();
                System.out.println("类型名称————" + part.getName());
                System.out.println("-----类型------->" + part.getContentType());
                System.out.println("提交的类型名称———" + part.getSubmittedFileName());
                System.out.println("流————" + part.getInputStream());
                is = part.getInputStream();
               

            }
        } catch (Exception e) {
            e.printStackTrace();

        }
        return key;
    }

后面直接从HttpServletRequest中拿数据流来接数据还是不行的原因：request payload把每传输的一个数据分布封装成了一个Part,首先要从request中拿到Part,才能从Part中拿到数据。

使用element upload想要传输额外的数据怎么办？？？

 <div>
              <el-upload
                class="upload-demo"
                 action="http://localhost:8080/productPic/upload2"
                :on-preview="handlePreview"
                :on-remove="handleRemove"
                :on-success="uploadBack"
                :file-list="fileList2"
                list-type="picture"
                :data="picData"
               >
                <el-button size="small" type="primary" >点击产品图片上传</el-button>
                <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
              </el-upload>
            </div>

额外的数据可以放到：data中传输，其中data中的数据也随action发出请求时与选择的图片数据（这里传输的为图片）一起以request payload数据格式传输，传输的顺序为data-->图片数据

picData:{pid,uls}

后台按传输的顺序接就可以了

 public void uploadPicEdit(HttpServletRequest request,HttpServletResponse resp){
     
        String fileName=null;
        InputStream is;
        int pid=-1;
        String urls="";
        String key="";
        ServletOutputStream out;
        try {
            Collection<Part> parts=request.getParts();
            Iterator<Part> iterator=parts.iterator();
            while (iterator.hasNext()) {
                Part part = iterator.next();
                String partName=part.getName();
                if( part.getContentType()==null){
                    is=part.getInputStream();
                    byte[]bytes=new byte[1024];
                    int nRead = 1;
                    int nTotalRead = 0;
                    while (nRead > 0) {
                        nRead = is.read(bytes, nTotalRead, bytes.length - nTotalRead);
                        if (nRead > 0)
                            nTotalRead = nTotalRead + nRead;
                    }
                    is.close();
                    String str = new String(bytes, 0, nTotalRead, "utf-8");
                    if("pid".equals(partName)){
                        pid=Integer.parseInt(str);
                    }
                    if("urls".equals(partName)){
                        urls=str;
                    }
            

                }else {
                    is=part.getInputStream();
                     productPicService.uploadPic(is);
                }
            }
}