Получение «обратный вызов URL несовпадение» с Auth0

Question

У меня есть клиент Auth0, настроенный с помощью следующего URL обратного вызова:

http://localhost:4200

Я могу войти в очень хорошо.

Проблема в том, что я перехожу к определенному URL-адресу в своем приложении: http://localhost:4200/places. Вот что происходит:

1. Я перейти к http://localhost:4200/places
2. Угловая перенаправляет меня (правильно), чтобы http://localhost:4200
3. Я пытаюсь войти
4. Я получаю сообщение об ошибке от Auth0 говоря «URL» http://localhost:4200/places "является а не в списке разрешенных URL-адресов обратного вызова ».

Auth0 прав, http://localhost:4200/places не в моем списке разрешенных URL-адресов обратного вызова —, и я не хочу, чтобы это было. Я не хочу перечислять любые URL-адреса, которые мой пользователь может отбросить на экран входа в систему.

Так почему-то происходит, что рассказывает Auth0, что ссылающийся URL является http://localhost:4200/places, а не http://localhost:4200, даже если http://localhost:4200 это на самом деле URL в адресной строке при попытке войти в систему.

Я понимаю, мог бы указать http://localhost:4200 как redirectUrl и «исправить» проблему, но тогда мне пришлось бы делать redirectUrl быть разными на dev, постановке и производстве. Кажется, это не так, как обычно люди обходят эту проблему.

Как я могу получить Auth0, чтобы не перенаправлять меня на /places?

Answer 1

Я пережил эту же проблему и решил ее с предложением Шрека выше (не тем же Шреком, как и я). Однако мне пришлось использовать window.top.location.origin вместо window.top.location.hostname. Для меня window.top.location.origin соответствует значениям Разрешенных обратных вызовов в моих настройках клиента в Auth0.

Вот мой код:

let stateOptions = 
    { 
     "auth0_authorize": this.authNonce, 
     "return_url": router.url 
    }; 

    let options = 
     { 
      closable: false, 
      languageDictionary: 
      { 
       emailInputPlaceholder: "something@youremail.com", 
       title: "Log me in" 
      }, 
      auth: 
      { 
       redirectUrl: window.top.location.origin, 
       redirect: true, 
       responseType: 'token', 
       params: 
       { 
        state: btoa(JSON.stringify(stateOptions)), 
        scope: 'openid user_id name nickname email picture' 
       } 
      } 
     }; 

    this.lock = new Auth0Lock('[your-auth0-clientid]', '[your-auth0-domain]', options); 

Answer 2

эта проблема смутили меня долгое время. Наконец, я понял это на странице конфигурации в Auth0.

Это очень смешно, чтобы сделать это. Я не знаю, почему Auth0 использует это, чтобы сохранить URL-адрес обратного вызова. Фактически, мы всегда устанавливаем RedirectURL в коде. Это полностью отличается от авторизации в google. В любом случае проблема решена.

К слову, я google для этой ошибки в самом начале, но я нашел это решение на странице конфигурации Auth0. Наверху есть видеоурок.

Надеюсь, это помогло.