jquery中angularjs拦截器的等价物

Question

我想像 $httpProvider.interceptors 在 agularjs 中那样拦截来自 REST 请求的响应： https://docs.angularjs.org/api/ng/service/$http

我正在使用 jQuery 制作一个非常小的界面，并且不想为此使用 angular。 你有和Idea吗？

实际上，我要解决的真正问题与此相同： Dealing with a 301 and location headers for a REST response in cross-domain

但我想用 jquery 以同样的方式解决它。

我尝试了这个但没有成功：（只捕获 0 状态而不是 301...）

How can I intercept ajax responses in jQuery before the event handler?

为了回答 V31，我这样做了：

$.ajaxSetup({
    error: function(jqXHR, textStatus, errorThrown) {
        if (jqXHR.status == 301) {
            alert("Element not found.");
        } else {
            console.log(jqXHR.status);
            console.log("Error: " + textStatus + ": " + errorThrown);
        }
    }
});

这是我的控制台：

上面写着：

XMLHttpRequest cannot load *******. The request was redirected to '**************', which is disallowed for cross-origin requests that require preflight. 
0 
Error: error:  

Answer 1

如果准确地解释 OP 的问题，要求是根据从 $.ajax() 调用返回的 statusCode (301) 执行任务？ ;在 success 、 error 回调之前还是代替？

似乎在给定响应 statusCode 之后发生了 OP 处的 error 回调。下面的部分应在任何可能附加到 $.ajax() 的 success 、 error 回调之前调用 statusCode 回调。

试试

    $.ajaxSetup({
        statusCode: {
            301: function (data, textStatus, jqxhr) {
                var callback = function (name) {
                  $("#results").html(name)
                };
                if (jqxhr.status === 301) {
                // do stuff
                    alert(jqxhr.readyState, jqxhr.getAllResponseHeaders());
                    callback("response: " + String(data || jqxhr.responseText) 
                            + "<br />textStatus: " + textStatus 
                            + "<br />statusCode : " + jqxhr.status 
                            + "<br />statusText : " + jqxhr.statusText);
                };

            }
        }
    });

jsfiddle http://jsfiddle.net/guest271314/D23k2/

见http://api.jquery.com/jquery.ajax/#jQuery-ajax-settings

Answer 2

您可以使用 ajaxSetup 来捕获 301 错误，如下所示：

$.ajaxSetup({
    error : function(jqXHR, textStatus, errorThrown) {
        if (jqXHR.status == 0) {
            alert("Element not found.");
        } else {
            alert("Error: " + textStatus + ": " + errorThrown);
        }
    }
});

更多关于jquery ajax setup

更新：

要处理 CORS 问题，您需要启用跨域调用，如下所示：

var app = angular.module('myApp', []);

  app.config(function($httpProvider) {
      //Enable cross domain calls
      $httpProvider.defaults.useXDomain = true;

      //Remove the header used to identify ajax call  that would prevent CORS from working
      delete $httpProvider.defaults.headers.common['X-Requested-With'];
  });

正如您所提到的，服务器端代码不在您手中，您需要向该方提出请求，以便将这些标头包含在其 API 调用的响应中（如果尚未完成）

 'Access-Control-Allow-Origin' => '*', 
 'Access-Control-Allow-Methods' => ['OPTIONS', 'GET', 'POST']