c#.Netマルチファイルアップロードと自動圧縮画像

必要:
プロジェクトには添付ファイルをアップロードする必要があります.タイプはpdf、word、excel、画像などで、アップロードしたファイルに画像があれば自動的に圧縮する必要があります.
ソリューション:
Web側でcanvasを使用して画像を小さなフォーマットに圧縮します.
開発中に多くの難点に遭遇し、コードを貼って参考にします.jsコード:

 /*
    ：      ，  jquery（            ）
    ：2019-01-25
    ：gaobin
  */
var ud_upload = {
    paras: {
        btn: "",//       id
        fileName: "AttachmentFile",//  file   
        uploadPath: "",//    
        accept: "image/*",//   "image/*",    ：*/*  
        isMultiple: true,//        
        data: function () {
            return {};
        },
        complete: function () { }
    },

    upload: function (file, name) {
        console.log("  ");
        var _this = this;
        //         
        var formData = new FormData();
        //        form 
        formData.append("AttachmentFile", file);
        if (typeof file === "string") {
            formData.append("AttachmentFileTitle", name);
        }
        var _data = _this.paras.data();
        // form       
        for (var key in _data) {
            formData.append(key, _data[key]);
        }
        $.ajax({
            url: _this.paras.uploadPath,
            type: 'POST',
            dataType: "JSON",
            data: formData,
            processData: false,  //tell jQuery not to process the data
            contentType: false,  //tell jQuery not to set contentType
            async: false,
            cache: false,
            success: function (res) {
                _this.paras.complete(res);

                //filesArr.count--;
                //delete filesArr.arr[0];
            }
        });

        // }
    },
    filesArr: { count: 0, arr: [] },
    callback: function callback(img, file) {
        //       img          

        //    img
        var data = compress(img, {});
        img = null;
        this.uploadImg(data, file.name);
    },
    init: function (paras) {
        //     
        //top.loading();
        var _this = this;


        //    
        var _p = $.extend({}, _this.paras, paras);
        _this.paras = _p;

        $("#" + paras.btn).bind("click", function () {

            //    ,  id    ，     
            $("#" + paras.fileName + _p.btn).click();
        });

        var _temp_form = $("
", {
            //"id": "form_update_id",
            // "enctype": "multipart/form-data"
        });

        _temp_form.append($("", {
            "id": _p.fileName + _p.btn,
            "type": "file",
            "accept": _p.accept,
            "multiple": _p.isMultiple,
            "name": _p.fileName,//       ，   action       
            change: function () {
                //      

                //      ，      this.files           
                var files = Array.prototype.slice.call(this.files);
                var imgarray = [];
                files.forEach(function (fileItem, fi) {


                    //   image  ，   appliction  
                    if (fileItem.type.indexOf("image/") == 0) {
                        //file image  
                        var reader = new FileReader();
                        reader.onload = function () {
                            imgarray[fi] = new Image();

                            //   ，   this，      img    
                            imgarray[fi].onload = function () {

                                //    img
                                var base64 = compress(imgarray[fi], {});
                                //     
                                console.log(fileItem.name + base64);
                                // _this.filesArr.arr.push(base64);
                                _this.upload(base64, fileItem.name);

                            }; //       
                            imgarray[fi].src = event.target.result;//base64
                        };
                        reader.readAsDataURL(fileItem);//       result   DataURL, DataURL         img.src

                    } else {
                        //          ，  4MB    
                        if (files[fi].size > (4 * 1024 * 1024)) {
                            $.msg.alert("《" + files[fi].name + "》  4 ，    ");
                            //      ，       
                            // break;
                        }
                        //  
                        //_this.filesArr.arr.push(fileItem);
                        _this.upload(files[fi]);
                    }

                });
                //-end     

            }
        }));

        $("body").append(_temp_form);
        return this;
    }
};

サービス側のコードには難点はありません.書かなければダウンロードできます.
難点:
同時に複数のファイルをアップロードしたとき、最後のアップロードしか成功しなかったことに気づき、私は直接thisを使用しました.filesはループアップロードして、テストして午後この行のコードが比較的に肝心であることを発見して、var files=Array.prototype.slice.call(this.files); これに変更すると、複数のファイルが正常にアップロードされます.
すべてのソースコードはダウンロードすることができます:同時に複数のファイルをアップロードして、ピクチャーは自動的に圧縮します