时间戳

首页 > 解决方案 > 我的应用程序中无法使用外部 API 和内部请求验证令牌签名

laravel-5 - 我的应用程序中无法使用外部 API 和内部请求验证令牌签名

问题描述

在 Laravel 5.8 / vuejs / vuex / mysql 应用程序中，我使用 jwt-auth 并且当我登录系统时（使用 mysql 用户表的标准身份验证）我使用方法：

export function setAuthorizationToken(token) {
    axios.defaults.headers.common["Authorization"] = `Bearer ${token}`
}

它工作正常。

接下来我需要重新制作 SignUp/SignIn 以使用外部 API 进行 SignUp/SignIn 操作。所以我的应用程序需要使用外部 API 进行 SignUp/SignIn ，但我也请求控制我的应用程序以从我的 sql 读取/写入数据。

对外部 API 的登录请求仅返回令牌，我将其保存在上面的 setAuthorizationToken 方法中。接下来我需要从这个外部 API 读取用户详细信息并将其保存在 vuex 存储中。我做到了，它工作正常，但问题是我的下一个 axios 请求我的控件从 db 读取数据触发错误：

无法验证令牌签名。

我明白为什么，但是有办法解决它吗？是否可以在需要时为 axios 替换 Bearer？也许一些替换 axios 以同时使用 axios 和替换？

"laravel/framework": "5.8.*",
"tymon/jwt-auth": "^1.0.0",


"vue": "^2.5.17",
"axios": "^0.18",
"vuex": "^3.1.0"

谢谢！

修改：

搜索登录决定我热衷于我在 cookie 'external_token' 中获得的令牌

    const headers = {
        'Content-Type': 'application/json',
        'X-Auth-Token': getCookie('external_token'),
        'Access-Control-Allow-Origin' : '*',
        "Access-Control-Allow-Methods": "GET",
    };
    axios.get(user_details_url, headers)
        .then((response) => {
        ...
        })
        .catch((err) =>{
        })

但我在控制台中遇到错误：

Access to XMLHttpRequest at 'http://remoteserver.com/api/user' from origin 'http://local-wiznext.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

remoteserver.com 是带有 API 的远程服务器， http: //local-wiznext.com是我正在开发的本地服务器

在寻找决策时，我发现了几个附加参数要添加到我的 axios 请求的标头中：

    const headers = {
        'Content-Type': 'application/json',
        'X-Auth-Token': getCookie('external_token'),
        'Access-Control-Allow-Origin' : '*',
        "Access-Control-Allow-Methods": "GET",
        'crossDomain': true,
       'dataType': 'jsonp',
    };
    // axios.get(url, {headers})

但我得到了同样的 CORS 错误。如果有办法修复此错误并运行请求？

修改#2：

我的服务器管理员使用此选项 https://support.cloudways.com/enable-cors-headers/ 并启用 CORS 标头并重新启动 debian，但我仍然收到 CORS 错误。任何想法如何解决问题？

标签： laravel-5vuejs2axiosvuexjwt-auth

解决方案

我从这个问题中可以理解的是，您有一个使用不同令牌的外部 API 和内部 API。因此，您可以在 SignUp/SignIn 之后在 cookie 中设置令牌，而不是在 SignUp/SignIn 之后设置令牌。对于外部令牌，您可以将其命名为external_token，对于内部令牌，您可以token在 cookie 中设置。现在，每当您触发 axios 调用时，您都会提前知道 API 是外部的还是内部的，并且基于此，您将仅为该 API 调用设置令牌，而不设置默认的授权标头。

推荐阅读