$.ajaxSetup 不工作

Posted 2023-02-19

【中文标题】$.ajaxSetup 不工作

【英文标题】：$.ajaxSetup not working

【发布时间】：2017-11-13 13:53:47

【问题描述】：

我有以下函数来设置我的 AJAX 请求的标头：

self.authenticate = function () 
    self.token = sessionStorage.getItem(tokenKey);
    var headers = ;

    if (self.token) 
        headers.Authorization = 'Bearer ' + self.token;
        $.ajaxSetup(
            headers: headers
        );
    

但这不起作用，当我检查开发人员收费 (F12) 或 Fiddler 中的标头时，我看不到 custon 标头，但是当我在请求上设置标头而不是通过 ajaxSetup效果很好。

正在布局页面中调用authenticate 函数：

$(document).ready(function () 
     var avm = new AuthenticationViewModel();
     avm.authenticate();
);

而self.token 不是null。

例如，对于这个请求：

self.getUsers = function (callback) 
    $.get("../API/Users/GetUsers/",callback);

这些是标题：

我错过了什么？

【问题讨论】：

我必须问一个显而易见的问题。您实际上是在任何地方调用身份验证函数吗？

@Archer 请查看我编辑的问题。

在avm.authenticate(); 和您的$.get("../API/Users/GetUsers/"); 处设置断点并确保： 1. 实际调用了身份验证。 2. 在获取请求之前调用身份验证。

@YeldarKurmangaliyev 我这样做了，两者的答案都是 - 是的。

在 if (self.token) 之前，输入 console.log(self.token) 并告诉我你得到了什么

【参考方案1】：

语法应该是这样的

headers:  'x-my-custom-header': 'some value' 

即;你可以将你的函数重写为

self.authenticate = function () 
    self.token = sessionStorage.getItem(tokenKey);

    if (self.token) 
       //headers.Authorization = 'Bearer ' + self.token;
       $.ajaxSetup(
           headers: Authorization:  'Bearer ' + self.token
       );
   

【讨论】：

我认为是一样的，但我试过了，没有帮助:(

【参考方案2】：

$.ajaxSetup 为未来的 Ajax 请求设置默认值。

不建议按照 JQuery 文档中的建议使用它。

无论如何，因为它为将来的调用设置了默认值，所以它必须在依赖于这些默认值的所有 ajax 调用之前执行。例如，如果您没有提及呼叫的url，则在$ajaxSetup 中配置的默认url 将是呼叫的url。如果您拨打的电话取决于这些默认值，那么此代码

self.authenticate = function () 
    self.token = sessionStorage.getItem(tokenKey);
    var headers = ;
    if (self.token) 
        headers.Authorization = 'Bearer ' + self.token;
        $.ajaxSetup(
            headers: headers
        );
    
 

必须在进行以下调用之前执行。

self.getUsers = function () 
    $.get("../API/Users/GetUsers/");

现在检查一下

***************Plunker for answer****************

在那个 plunker 中，通过按 F12 转到 开发者控制台 中的 network 选项卡，并检查$.ajax() 发出的调用中的标题和$.get()

在 plunker 中我观察到（要阅读的要点），

如果呼叫是

$.ajax()

，则显示标题，呼叫的 url 是 url，在 $.ajaxSetup 中提到 如果呼叫是

$.get()

则标题未显示，呼叫的 url 是 plunker url 意味着在您的情况下它将是

http://MySite/

等

$.ajax() 是最可配置的，您可以在其中获得细粒度 控制 HTTP 标头等。您也可以直接获得 使用此方法访问 XHR 对象。稍微细一点 还提供了错误处理。因此可以更复杂和 通常是不必要的，但有时非常有用。你必须处理 通过回调自己返回数据。

$.get() 只是 $.ajax() 的简写，但抽象了一些 配置，为它设置合理的默认值 躲着你。将数据返回给回调。它只允许 GET-requests 所以伴随着类似的 $.post() 函数 抽象，仅用于 POST

更多信息

DIFFERENCE BETWEEN $.ajax() and $.get(), $.post()

如果需要，只需测试 plunker。

---

$.ajax() 调用的图像

---

$.get() 调用的图像

因此，如果您想设置headers，只需使用$.ajax() 而不是$.get()

希望这会有所帮助:)

【讨论】：

感谢您详细解释的答案，我尝试将 $.get() 更改为 $.ajax() 但仍然是同样的问题...

@user3378165 为您的问题添加一个 plunker。我会解决它或检查我添加的运行良好的 plunker

我检查了你的 plunker，它似乎是正确的，但对我来说这不起作用......

你能对你的问题做一个演示吗？

【参考方案3】：

我最终搬家了：

$(document).ready(function () 
     var avm = new AuthenticationViewModel();
     avm.authenticate();
);

从Layout 页面到页面本身，这解决了问题。

AuthenticationViewModel-创建一个新的AuthenticationViewModel，用于登录用户并获取他们的信息。