Auth0 с ReactJS и Lumen - аудитория выглядит как случайная строка - PullRequest
Новая
       13

Auth0 с ReactJS и Lumen - аудитория выглядит как случайная строка

0 голосов
/ 29 октября 2018

В настоящее время я разрабатываю приложение, которое имеет внешний интерфейс ReactJS и внутренний интерфейс Lumen. Я пытаюсь использовать Auth0, чтобы сделать API доступным только для определенных пользователей.

В настоящее время у меня есть настройка аутентификации JWT в Lumen. Используя почтальон, я могу успешно отправлять запросы на данные при настройке токена на предъявителя теста, предоставляемого Auth0.

Вот настройки, которые я использую для проверки JWT: 

$verifier = new JWTVerifier([
    'supported_algs' => ['RS256'],
    'valid_audiences' => ['http://example.com'],
    'authorized_iss' => ['https://example.eu.auth0.com/'],
]);

Я начал с ReactJS и до сих пор могу войти в систему с Auth0 совершенно нормально. Ниже приведены настройки для подключения auth0: 

auth0 = new auth0.WebAuth({
    domain: AUTH_CONFIG.domain,
    clientID: AUTH_CONFIG.clientId,
    redirectUri: AUTH_CONFIG.callbackUrl,
    responseType: 'token id_token',
    scope: 'openid profile'
  });

При успешном входе в систему возвращаются access_token и id_token.

Теперь приходит расстраивающая часть .. Я делаю GET-запрос данных из моего API следующим образом: 

axios({
      url:'http://example.com/public/api/enquiries',
      headers: {
        'Content-Type': 'application/json',
        'Authorization':'Bearer ' + localStorage.getItem('id_token'),
      }
    }).then(function(response) {
      console.log(response);
    });

Это возвращает следующую ошибку из моего Lumen API: 

Invalid audience Wo6olMsBdA0U0azY4q09iZ7bjXPbYSvd; expected http://example.com

Я выполнил var_vump декодированных данных в Lumen, и все данные верны, ЗА исключением пункта aud, который выглядит как: Wo6olMsBdA0U0azY4q09iZ7bjXPbYSvd.

Я добавил вышеуказанную строку в качестве принятой аудитории, и запрос был успешно выполнен, но это, безусловно, не правильно. Кто-нибудь может указать мне правильное направление?

Очень ценится.

1 Ответ

0 голосов
/ 29 октября 2018

Нашел проблему.

Поэтому, когда данные были возвращены для access_token и id_token, access_token выглядел слишком маленьким, чтобы использоваться для JWT, и поэтому я предположил, что id_token был правильным носителем для использования. Однако то, что мне не хватало в моем проекте React при запуске auth0, было опцией «аудитория», и поэтому access_token не был готов к JWT. Добавление этого дало мне более длинный access_token, который был готов JWT. Разбор этого в моем API как предъявителя работал как надо.

Код инициализации для auth0 в реакции должен был быть: 

auth0 = new auth0.WebAuth({
    domain: AUTH_CONFIG.domain,
    clientID: AUTH_CONFIG.clientId,
    redirectUri: AUTH_CONFIG.callbackUrl,
    responseType: 'token id_token',
    scope: 'openid profile',
    audience: 'http://example.com'
  });

.. для тех, кто сталкивается с такой же проблемой.

...