带有 jQ​​uery Ajax 的 JWT 令牌

Posted 2023-03-04

【中文标题】带有 jQ​​uery Ajax 的 JWT 令牌

【英文标题】：JWT token with jQuery Ajax

【发布时间】：2016-03-06 00:08:56

【问题描述】：

我有一个由 Laravel、Dingo 和 JWT 令牌驱动的 API。使用 PAW 测试 API 调用非常有效。在没有中间件 JWT 令牌禁用的情况下使用 jQuery 运行 API 调用可以正常工作。但是，一旦我尝试使用 JWT 令牌运行 Ajax 请求，我就会得到 401。

我是否错过了 Ajax 请求的技巧。你能看出这段代码有问题吗？

$.ajax(
    url: "http://api.domain.app/products",
    dataType : 'jsonp',
    type: 'GET',
    beforeSend : function(xhr) 
        xhr.setRequestHeader("Accept", "application/json");
        xhr.setRequestHeader("Content-Type", "application/json");
        xhr.setRequestHeader("Authorization", "Bearer XXXX");
    ,
    error : function() 
        // error handler
    ,
    success: function(data) 
        console.log(data);
        return data;
    
);

由于跨域，我不得不使用 jsonp。但同样，关闭 JWT 中间件也可以正常工作。

希望你能给点建议..

【参考方案1】：

我从子域中删除了 API 并且它工作正常。肯定跟jsonp和JWT Tokens有关。

【讨论】：

您的代码是正确的。可能你的 CORS 请求有问题。

您是否将 jwt 存储在窗口本地/会话存储中？因为这不适用于子域。

【参考方案2】：

HTTP 状态代码 401 表示“未授权”，这意味着需要进行身份验证，但身份验证失败或尚未正确提供。 在这种情况下，这是因为它没有被正确提供。您正在尝试在 beforeSend 参数中提供它。 beforeSend 为您提供了在发送 XMLHttpRequest 之前对其进行操作的机会，但问题是，您使用的是 JSONP。而JSONP，因为JSONP只是一个<script>标签插入技巧，它不使用XMLHttpRequest，所以操作它是没有意义的。

Here 很好地解释了 JSONP 到底是什么。

你的问题是，“你能看出这段代码有问题吗？”，我在上面已经回答过了。 不过，您可能想问的是“我如何获得使用 jQuery 的授权问题？”。 您说“由于跨域，我不得不使用 jsonp”，如果您详细说明“由于跨域”，则导致解决方案的答案将更容易产生。 The answer in this issue 可能会解决您的问题，但如果没有更多信息，这很难说。