如何将 img 标签的里的文件上传？

有一个下面这样的标签：

<img style="width:40%" id="bimg" src="../img/barcode.png"/>

 如何将文件图片上传那？

 我们先看下传统上传文件：

//上传文件
        function upload_FileInfo(){
            let formData = new FormData();
            formData.append("file", document.getElementById('file_1').files[0]);
            let url=sensorServer.getUploadFileUrl();
            $.ajax({
                url:url,
                type:"post",
                data:formData,
                processData:false,
                contentType:false,
                success:function(data){
                    console.log(JSON.stringify(data));
                    if(data.msg=="操作成功"&&data.data!=null){
                        let uploadSuccessPath=data.data;
                        let postSData={"appkey":"cad_background","appval":data.data};
                        let resultCount=sensorServer.updateSettingsInfo(postSData);
                        if(resultCount==1) {
                            layer.msg("上传成功！");
                        }else{
                            layer.msg("保存失败！");
                        }
                    }else{
                        alert(JSON.stringify(data));
                        layer.msg("上传失败！");
                    }
                },
                error:function(e){
                    alert("错误！！");

                }
            });
        }

传统文件上传只需要做个获取file的 文件即可。那么img标签怎么做那？

继续看下去： 

 只需要将文件做个转换即可。

let imagesName=new Date().getUTCMinutes()+".png";
        let fileData=document.getElementById('image1');
        let fileOfBlob=dataURLtoFile(fileData.src,imagesName);

        formData.append("file",fileOfBlob);

function dataURLtoFile(dataurl, filename) {
    //获取代码请加微信
    //这种方式电脑可以。手机不可以。
}

这样就可以上传文件了；

但是经过测试后发现，电脑可以手机不可以怎么办？只要更改下获取base64就可以了。

//上传文件
            function upload_FileInfo(){
                let formData = new FormData();
          
          let imagesName=new Date().getUTCMinutes()+".png";
          let fileData=document.getElementById('bimg');
          let base64=""; //getBase64Image(fileData);
          
          //回调调用 -huochengyan
          toDataURL(fileData.src, function(dataUrl) {
            console.log('RESULT:', dataUrl);
            base64=dataUrl;
            let fileOfBlob=dataURLtoFile(base64,imagesName);
              formData.append("file",fileOfBlob);
                //formData.append("file", document.getElementById('file_1').files[0]);
                let url=sensorServer.getUploadFileUrl1();
                $.ajax({
                    url:url,
                    type:"post",
                    data:formData,
                    processData:false,
                    contentType:false,
                    success:function(data){
                        console.log(JSON.stringify(data));
                        if(data.msg=="操作成功"&&data.data!=null){
                            let uploadSuccessPath=data.data;
                            let postSData={"appkey":"cad_background","appval":data.data};
                            let resultCount=sensorServer.updateSettingsInfo(postSData);
                            if(resultCount==1) {
                                alert("上传成功！");
                            }else{
                                layer.msg("保存失败！");
                            }
                        }else{
                            alert(JSON.stringify(data));
                            alert("上传失败！");
                        }
                    },
                    error:function(e){
                        alert("错误！！");
                
                    }
                });
            
          })
             }

//
    
        function toDataURL(url, callback) {
             公众号回复即可获取代码
        }
        //调用
       // toDataURL('https://www.111.com/1.jpg', function(dataUrl) {
       //   console.log('RESULT:', dataUrl)
       // })

 好了手机端也可以了。