Question

我在尝试使用'fileuploader'上传之前先检查文件，现在我的beforeSend功能：

beforeSend: function(item, listEl, parentEl, newInputEl, inputEl) {
            var file = item.file;

            let readfile = function(file){
                return new Promise(function(resolve, reject){
                console.log(file);
                    var reader = new FileReader();
                    var duration = 0;
                    reader.onload = function() {
                        var aud = new Audio(reader.result);
                        aud.onloadedmetadata = function(){
                            resolve(aud.duration);
                        }; 
                    };
                reader.readAsDataURL(file); 
                });
            }

          return readfile(file).then(function(res){ 
                if(res>60){ 
                    console.log('more than 60');
                    return false; 
                 }
                 else{
                    console.log('uploaded');
                    return true;
                 }

        }); 

        },

我的readfile函数实际上等待promises完成，但是在readfile函数完成之前，beforeSend函数没有暂停。

我该怎么做？

我知道它没有返回false，因为即使我在我的承诺上返回false，仍然会发出http请求。

Answer 1

你可以这样做。

$(document).on('sendAjax',function(){
//Write your ajax code here
});

$(document).trigger("sendAjax");

创建自定义事件sendAjax，将其与文档绑定，并在成功上载文件后触发事件。在$(document).ready()

中获取文件上传功能

$(document).ready(function(){
 function myfunction(){
  var file = item.file;

            let readfile = function(file){
                return new Promise(function(resolve, reject){
                console.log(file);
                    var reader = new FileReader();
                    var duration = 0;
                    reader.onload = function() {
                        var aud = new Audio(reader.result);
                        aud.onloadedmetadata = function(){
                            resolve(aud.duration);
                        }; 
                    };
                reader.readAsDataURL(file); 
                });
            }

          return readfile(file).then(function(res){ 
                if(res>60){ 
                    console.log('more than 60');
                    return false; 
                 }
                 else{
                    console.log('uploaded');
                    $(document).trigger("sendAjax"); 
                    return true;
                 }

        }); 
 }
});

通过这种方式，只有在成功上传文件后才会发送ajax。

希望它有所帮助。

Answer 2

根据jQuery代码，beforeSend()不使用回调函数返回的值，而是检查是否返回false

https://github.com/jquery/jquery/blob/d7237896c79a5a10d85fcdec199c5657a469a92b/src/ajax.js#L652

// Allow custom headers/mimetypes and early abort
if ( s.beforeSend &&
       ( s.beforeSend.call( callbackContext, jqXHR, s ) === false || completed ) ) {

     // Abort if not done already and return
     return jqXHR.abort();
}

因此，在您的承诺解析之后，不仅会返回false未使用的任何值，beforeSend回调将已经完成并且ajax请求已经开始/结束。

如果你想事先做一些异步操作，你需要在实际的jQuery.ajax()电话

之前进行

示例：

new Promise((resolve,reject)=>{
   //...
}).then(()=>{
   return $.ajax({
     //....
   });
});

在ajax beforeSend

2 个答案: