H5 form multipart/form-data submit picture

now the interface side gives an interface for uploading pictures and says that it wants to be in multipart/form-data format. Now there is a problem when transmitting data. The code is as follows

              <f7-input type="file" id="z_img" placeholder="Name"/>
              <span @click="shangchuan()"></span>
              
                        shangchuan:function(){
            var self = this
            var token_all = self.$global.token;
            var qurl = self.$global.qurl;
            var tupian = document.getElementById("z_img")
            var img_src = tupian.files[0]
            var data1 = new FormData();
            data1.append("file",img_src)
             self.$$.ajax({
                 url: qurl + "/api/common/uploadFile",
                 method: "post",
                 data: {data1},
                 processData : false,
                 contentType : false,
                 cache: false,
                 async:false,
                 headers: {
                 "Content-Type": "multipart/form-data; boundary=----WebKitFormBoundarykZiow0s1qkwq4AJH"
                 },
                 beforeSend: function (xhr) {
                 },
                 success: function (xhr111, status) {
                     const info = JSON.parse(xhr111);
                      console.log(status)
                        console.log(xhr111)

                 },
                 error: function (xhr111) {
                 },
                 complete: function (xhr) {
                     // $$(".gjjzdiv").hide();
                 }
             });

          }

and then upload

in Google browser.

web

ask me how to change it. I"ve never uploaded a picture before

Mar.16,2021

$.ajax({
  ....
  data: data1,
  ....
});
Menu