Тонкий токен JWT (отправленный по запросу Axios) не найден - PullRequest
Новая
       15

Тонкий токен JWT (отправленный по запросу Axios) не найден

1 голос
/ 04 июня 2019

Я настраиваю веб-сайт Vue js / Vuetify с PHP Slim Framework API и tuuopla slim-jwt-auth в качестве промежуточного программного обеспечения для аутентификации токена JWT.Незащищенные маршруты работают нормально, но когда я пытаюсь отправить запросы axios на защищенные маршруты в API, я получаю только ошибку токена, не найденную.

Я не знаю, связана ли проблема с Vue js, axios или APIконфигурации.curl и Почтальон выдает декодированный ключ, как и ожидалось, при доступе к защищенному маршруту, только веб-сайт Vue js выдает эти ошибки.Для запуска API я использую встроенный сервер PHP: `php -S localhost: 8000 -t public /

В любом случае localStorage.getItem("token") существует, так как я пытался печатать их перед каждымзапрос также в перехватчике.

Вот тестовый компонент: 

<template>
 <v-btn @click="test">Test</v-btn>
 <v-btn @click="test2">Test</v-btn>
</template>
<script>
  methods: {
    test() {
      axios
        .post("api/user",{},{
            headers: {
              Authorization: `Bearer ${localStorage.getItem("token")}`
            }
          }
        )
        .then(res => console.log(res))
        .catch(err => console.log(err));
    },
    test2() {
      var yourConfig = {
        headers: {
          Authorization: "Bearer " + localStorage.getItem("token")
        }
      };
      axios
        .get("test", yourConfig)
        .then(res => console.log(res))
        .catch(err => console.log(err));
    }
  },
</script>

axios config (пробовал с и без перехватчика) 

axios.defaults.baseURL = "http://localhost:8000";
axios.interceptors.request.use(
  config => {
    let token = localStorage.getItem("token");

    if (token) {
      config.headers["Authorization"] = `Bearer ${token}`;
    }
    console.log(token)
    return config;
  },

  error => {
    return Promise.reject(error);
  }
);

Slim index.php (пример защищенных и незащищенных маршрутов для моих тестов) 

...
use Slim\Http\Request;
use Slim\Http\Response;

$app->group('/api', function (\Slim\App $app) {
    $app->get('/user', function (Request $request, Response $response, array $args) {
        return $response->withJson($request->getAttribute('decoded_token_data'));
    });
});
$app->get('/test', function (Request $request, Response $response, array $args) {
    return $response->withJson(["hi"=>"hello"]);
});

// Run app
$app->run();

middleware.php (перепробовал много конфигураций) 

<?php
// Application middleware
use Slim\Http\Request;
use Slim\Http\Response;

use Monolog\Logger;
use Monolog\Handler\RotatingFileHandler;


$logger = new Logger("slim");
$rotating = new RotatingFileHandler(__DIR__ . "/logs/slim.log", 0, Logger::DEBUG);
$logger->pushHandler($rotating);

$app->add(new \Tuupola\Middleware\JwtAuthentication([
    "secure" => false,
    "logger" => $logger,
    "relaxed" => ["localhost:8080"],
    "attribute" => "decoded_token_data",
    "secret" => "mykey",
    "algorithm" => ["HS256"],
    "rules" => [
        new \Tuupola\Middleware\JwtAuthentication\RequestPathRule([
            // Degenerate access to '/api'
            "path" => ["/api"],
            // It allows access to 'login' without a token
            "passthrough" => [
                "/login_admin"
                //"/login_admin"
            ]
        ])
    ],
    "error" => function ($response, $arguments) {
        $data["status"] = "error";
        $data["message"] = $arguments["message"];
        return $response
            ->withHeader("Content-Type", "application/json")
            ->write(json_encode($data, JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT));
    }
]));

Ошибки при попытке доступа к маршруту api/user:

  • Консоль Chrome: 
OPTIONS http://localhost:8000/api/user net::ERR_ABORTED 401 (Unauthorized)
Access to XMLHttpRequest at 'http://localhost:8000/api/user' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.
  • Ответ API: 
{
    "status": "error",
    "message": "Token not found."
}
...