如何處理未兌現的承諾錯誤？

Question

我是Promises的新手，我確信自己的代碼有誤。 結果是正確的，但console.log中有Uncaught (in promise)警告。 這里發生的是用戶可以提交一個表單，其中包含一些required字段，一些optional字段和圖像。 提交后，我得到的圖像將被壓縮，調整大小和方向，以便將其作為少量Kbs上傳到服務器。

在coontroller中，我按照上述方式驗證了代碼，某些字段是必需的，因此在Ajax調用內部發生error情況下，如果缺少字段，我會得到textStatus。

這段代碼所發生的是，如果用戶輸入了圖像，但沒有輸入任何或某些必填字段，則XHR textstatus錯誤對象顯示為Uncaught (in promise) （缺少必填字段）。

我錯過了如何處理承諾中的錯誤（拒絕嗎？）的要點，所以我真的不知道如何解決這個問題。

我的猜測是，如果用戶提交圖像但未提交必填字段，則應有一種方法可以在承諾期間檢查該內容，以便即使用戶提交了圖像也被拒絕（因為僅圖像就不夠用）。 這是reject嗎？ 但是哪里？ 以及.then（）之后如何調用錯誤？ 如果用戶提交一些必填字段或全部但不提交圖像怎么辦？ 如果我讓諾言運行，那么諾言中會出現undefined錯誤，這就是為什么我添加了檢查以查看是否存在任何文件以及是否為映像的原因。

這是我的腳本：

$(document).ready(function () {

    $("#AddModel").on("submit", function (e) {

        e.preventDefault();

        // gets the file from the form input
        var files = $('#modelpic').prop('files');

        var form = $(this);

        // this strips the submitted form from the file and returns a new form with all the
        // inputs but the file
        var processedFormData = noFileFormData(form[0]);

        // only if there's a file and it's an image
        if( files.length !== 0 && /^image/.test(files[0].type)){

            //this calls the promise that manipulates the image and returns a blob
            processImage(files[0]).then(([img, ia])=> {

                processedFormData.append('image', ia, 'processed.jpg');

                return $.ajax({
                    type: 'POST',
                    url: form.prop('action'),
                    processData: false,
                    contentType: false,
                    cache: false,
                    data: processedFormData,
                    success: function (data) {

                        //displays preview of the post

                    },

                    error: function (textStatus) {

                        //displays errors


                    }
                });

            });
        }else{

                //displays an error re the image is not present.
                // Now this is not optimal as the image is not the only required field

        }
    });
});

這是准備操作圖像的Promise函數，它調用其他一些函數進行實際處理：

function processImage(file) {

    return new Promise(function (resolve, reject) {

        if (file.type.match('image.*') && file.length != 0) {

            var reader = new FileReader();

            reader.readAsDataURL(file);

            reader.onloadend = function () {

                var base64img = this.result;

                var exif = EXIF.readFromBinaryFile(base64ToArrayBuffer(this.result));
                var srcOrientation = exif.Orientation;

                resetOrientationResizeCompress(base64img, srcOrientation).then((img)=> {

                    dataURItoBlob(img).then((ia)=> {

                        resolve([img, ia]);

                    });

                });
            };
        }else{

            //don't really know what to do here really, or if this is the way

            reject();

        }
    });
}

Answer 1

它告訴您您沒有捕獲錯誤拒絕，請將.catch追加到processImage(files[0])承諾中。