首页 > 解决方案 > 使用 JWT 访问 Rest API 适用于 Postman 但不适用于 Axios

问题描述

我有一个用 JWT 保护的 Laravel 制作的 Api 休息。登录正常工作,但是,当使用登录返回的承载令牌时,我收到错误:

从源“http://api-laravel3.test/api/movies”访问 XMLHttpRequest 'http://localhost:8080' 已被 CORS 策略阻止:对预检请求的响应未通过访问控制检查:它没有 HTTP ok 状态。

通过承载令牌的邮递员访问工作正常。问题出现在axios

     var token = localStorage.getItem('user-token');

      axios.get('http://api-laravel3.test/api/movies', { 
        headers:{
          'Content-Type': 'application/json',
          'Authorization': 'Bearer '+token,
        }
      }).then(function (response) {
        console.log('OK ' + response.status);
        return response.data
      })
      .catch(function (error) {
          console.log('Error: ' + error.response );
          //return Promise.reject(error);
      });

标签: jsonwebaxiosjwttoken

解决方案


我相信,您可以通过在 /public/index.php 中添加这些行来解决您的问题。但如果你介意,它并不优雅。

header('Access-Control-Allow-Origin: *');  
header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
header("Access-Control-Max-Age", "3600");
header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');
header("Access-Control-Allow-Credentials", "true");

为了获得更好的解决方案,您可以为您的 Laravel 应用程序创建一个新的中间件。您应该查看此答案以了解更多信息:https ://stackoverflow.com/a/44683779/4448438


推荐阅读