中止多文件上传 AJAX 请求

     2023-02-22     93

关键词:

【中文标题】中止多文件上传 AJAX 请求【英文标题】:Abort a multiple file upload AJAX request 【发布时间】:2015-01-02 22:44:45 【问题描述】:

我正在尝试使用进度条中止多文件上传,显示过程状态。

我想要实现的是在中止按钮单击时完全中止多个文件上传;停止进度条并清除在最初触发的多文件上传过程中可能已上传的每个文件。

下面是我的代码:

var AJAX = $.ajax( 
    xhr: function() 
        var XHR = new window.XMLHttpRequest();

        XHR.upload.addEventListener('progress', function(e) 
          if (e.lengthComputable) 

            var PROGRESS = Math.round((e.loaded/e.total)*100);
            $('#PROGRESS_BAR').text(PROGRESS);

         , false); return XHR; ,
    url        : '/php.php',
    type       : 'POST',
    data       : DATA,
    cache      : false,
    processData: false,
    contentType: false,
    beforeSend : function()  , 
    success    : function()   
);

$(document).on('click', '.ABORT', function(e)      
    AJAX.abort();
);

我使用上面的代码来动态上传带有进度条的图片。

我发现很多文章使用.abort() 来停止进程,但这似乎只适用于浏览器端而不是服务器端。

我可以通过什么方式完全停止上传:在客户端和服务器端,.abort() 无法让我获得理想的结果?

【问题讨论】:

【参考方案1】:

试试这个:

var XHR = new window.XMLHttpRequest();
var AJAX = $.ajax( 
    xhr: function() 
        XHR.upload.addEventListener('progress', function(e) 
          if (e.lengthComputable) 

            var PROGRESS = Math.round((e.loaded/e.total)*100);
            $('#PROGRESS_BAR').text(PROGRESS);

         , false); return XHR; ,
    url        : '/php.php',
    type       : 'POST',
    data       : DATA,
    cache      : false,
    processData: false,
    contentType: false,
    beforeSend : function()  , 
    success    : function()   
);

$(document).on('click', '.ABORT', function(e)      
    XHR.abort();
);

【讨论】:

能否请您澄清一下您的代码和@user3565264 代码之间的区别?当用户取消上传时,服务器端的清理过程如何处理? 变化是 XHR 的可见性。将其移出功能后,单击功能可见。请看:w3schools.com/js/js_scope.asp

按退出键中止 AJAX 文件上传

】按退出键中止AJAX文件上传【英文标题】:AbortAJAXfileuploadbypressingescapekey【发布时间】:2013-10-3018:06:23【问题描述】:我正在尝试abort()AJAX文件上传。我尝试添加事件侦听器,并尝试使用abort()获取任何keypress,尽管我在控制台中... 查看详情

上传文件处理数据的时候提示正在中止线程

...ajax上传文件时文件较大循环处理数据的时候提示“正在中止线程”并没有使用多线程终于在网上找到这个文章 https://www.cnblogs.com/oec2003/p/3437304.htmlAsp.Net正在中止线程引发的问题 背景:Asp.Net做的一个同步程序,同步的方... 查看详情

NodeJs上传文件错误:请求中止

】NodeJs上传文件错误:请求中止【英文标题】:NodeJsUploadfileError:RequestAborted【发布时间】:2014-05-2606:41:37【问题描述】:我正在尝试从使用Cordova(Phonegap)开发的应用程序上传文件(图片),但我总是获得Error:RequestAborted。一开始... 查看详情

如何获得对http请求文件上传中止的响应?

】如何获得对http请求文件上传中止的响应?【英文标题】:Howtogetresponseonhttprequestfileuploadaborted?【发布时间】:2012-12-1901:54:15【问题描述】:我将使用nodejs和express上传文件。我看到bodyParser完成了工作......app.use(express.bodyParser("lim... 查看详情

如何取消/中止 jQuery AJAX 请求?

】如何取消/中止jQueryAJAX请求?【英文标题】:Howtocancel/abortjQueryAJAXrequest?【发布时间】:2011-05-3120:56:40【问题描述】:我有一个AJAX请求,每5秒发出一次。但问题出在AJAX请求之前,如果前一个请求未完成,我必须中止该请求并... 查看详情

使用 jQuery 中止 Ajax 请求

】使用jQuery中止Ajax请求【英文标题】:AbortAjaxrequestsusingjQuery【发布时间】:2010-10-0114:07:17【问题描述】:是否有可能使用jQuery,我取消/中止了我尚未收到响应的Ajax请求?【问题讨论】:也许我误解了这个问题,但你不能简单... 查看详情

在其他函数中中止 Ajax 请求

】在其他函数中中止Ajax请求【英文标题】:AbortAjaxRequestinotherfunction【发布时间】:2015-09-1512:51:44【问题描述】:我想中止另一个函数中的Ajax请求示例:varxhr=false;$(function(e)$(document).on(\'click\',\'.menue-button\',function(e)//SomeJSxhr=$.ajax(... 查看详情

淘汰赛:Ajax 请求中止

】淘汰赛:Ajax请求中止【英文标题】:knockout:Ajaxrequestabort【发布时间】:2018-09-1307:01:23【问题描述】:我想在新请求运行时阻止以前的ajax请求。我这样做就像下面的代码。但是,它不起作用。我在beforeSend()函数中添加了用于中... 查看详情

在 AngularJS 中中止挂起的 ajax 请求

】在AngularJS中中止挂起的ajax请求【英文标题】:AbortpendingajaxrequestinAngularJS【发布时间】:2015-01-0211:29:31【问题描述】:如何中止AngularJS中待处理的ajax请求?我正在使用Service进行ajax调用,并且如果在同一路由上发出新请求,我... 查看详情

中止先前正在运行的 Ajax 请求 [重复]

】中止先前正在运行的Ajax请求[重复]【英文标题】:AbortapreviousrunningAjaxrequest[duplicate]【发布时间】:2013-12-0804:03:15【问题描述】:是否可以中止以前运行的Ajax请求?varxhr=$.ajax(type:"POST",url:"some.php",data:"name=John&location=Boston",succ... 查看详情

使用 jQuery deferred 中止 AJAX 请求链

】使用jQuerydeferred中止AJAX请求链【英文标题】:AbortchainofAJAXrequestswithjQuerydeferred【发布时间】:2018-06-2202:50:43【问题描述】:我正在进行一系列AJAX调用,如下例所示,我在http://www.dotnetcurry.com/jquery/1022/jquery-ajax-deferred-promises找到... 查看详情

验证失败后,servlet中止多部分表单数据提交(代码片段)

...将整个文件上传到servlet。我只想在订单ID验证失败时立即中止此Multipart表单提交,而不等待将整个视频文件上传到servlet。我尝试使用abort方法,但eclipse没有显示任何建议。答案您可以尝试两种解决方案:在进一步处理文件之前... 查看详情

PrimeFaces 4.0/JSF 2.2.x 中的文件上传不适用于 AJAX - javax.servlet.ServletException:请求内容类型不是多部分/表单数据

】PrimeFaces4.0/JSF2.2.x中的文件上传不适用于AJAX-javax.servlet.ServletException:请求内容类型不是多部分/表单数据【英文标题】:Fileuploaddoesn\'tworkwithAJAXinPrimeFaces4.0/JSF2.2.x-javax.servlet.ServletException:Therequestcontent-typeisnotamultipart/form 查看详情

Ajax/jQuery 超时中止

】Ajax/jQuery超时中止【英文标题】:Ajax/jQueryAbortontimeout【发布时间】:2013-08-2623:58:55【问题描述】:新手-问题-试图解决的问题:如果有一些打开的连接没有被XMLHttprequest关闭,我们想中止它们。在有Ajax调用的javascript文件中,我... 查看详情

使用 jQuery 中止 JSONP ajax 请求

】使用jQuery中止JSONPajax请求【英文标题】:AbortJSONPajaxrequestwithjQuery【发布时间】:2011-09-2206:50:04【问题描述】:我正在使用JSONPajax调用从不同的域加载一些内容,如果用户在按钮上引起“鼠标悬停”,所有这些内容都会执行。... 查看详情

jQuery 中止请求

】jQuery中止请求【英文标题】:jQueryabortingrequest【发布时间】:2013-04-2412:59:00【问题描述】:jQuery有一些中止API,可用于尝试中止请求。jQuery真的可以自己决定中止Ajax请求吗?例如,假设有一堆Ajax请求正在运行,其中一个返回... 查看详情

含义模式:JS Ajax 请求中的“中止”

】含义模式:JSAjax请求中的“中止”【英文标题】:meaningmode:\'abort\'inJSAjaxrequest【发布时间】:2012-09-0319:18:03【问题描述】:我不确定我是否理解JQAjax请求中\'abort\'选项的用途。它是干什么用的?$.ajax(**mode:\'abort\',**dataType:\'html\... 查看详情

使用 jQuery 中止待处理/积压的 AJAX 请求

】使用jQuery中止待处理/积压的AJAX请求【英文标题】:Abortingpending/backlogofAJAXrequestsusingjQuery【发布时间】:2013-06-0414:00:53【问题描述】:我有以下脚本:$(document).ready(function()$(\'#input\').keyup(function()sendValue($(this).val());););functionsendV... 查看详情