Правильное перенаправление в Vue SPA после успешного выполнения Oauth с паспортом Laravel (неявный знак выдачи) - PullRequest
Новая
       10

Правильное перенаправление в Vue SPA после успешного выполнения Oauth с паспортом Laravel (неявный знак выдачи)

0 голосов
/ 14 декабря 2018

У меня есть бэкэнд Laravel и внешний интерфейс Vue SPA.До сих пор мне удавалось работать с токенами Implicit Grant.Моя проблема связана с перенаправлением.

После успешной аутентификации Laravel перенаправляет на http://localhost:8080/auth/callback#access_token=AUTH_TOKEN&token_type=TOKEN_TYPE&expires_in=EXPIRES_IN вместо http://localhost:8080/auth/callback?access_token=AUTH_TOKEN&token_type=TOKEN_TYPE&expires_in=EXPIRES_IN (обратите внимание на # и?).Я должен вручную ввести правильный URL-адрес после успешной аутентификации.

Как я могу убедиться, что он перенаправлен на правильный URL-адрес в первую очередь?

1 Ответ

0 голосов
/ 18 декабря 2018

Исходя из этого ответа переполнения стека, мне удалось найти обходной путь.Эта функция не является ошибкой и перенаправлением на myurl.com?не решает проблему.Вот мое решение.В моем файле индекса маршрутизатора у меня есть две записи.

Первая - это перенаправление, которому OAuth API возвращает токен.Метод маршрутизатора beforeEnter получает строку URL, заменяя знак # на?и следующий метод перенаправляет приложение на маршрут сохранения.

Метод indexOf получает индекс?во вновь сформированном URL и передает его методу подстроки, который усекает часть http (s): //, так что это решение можно адаптировать как к http, так и к https.

Результаты усеченияв ?access_token.Затем он добавляется к следующей записи пути метода, и в результате к компоненту можно получить доступ из / в файле save с помощью объекта route.query. 

{
  path: `/auth/callback`,
  beforeEnter: (to, from, next) => {
    let url = window.location.href
    if(url.includes('#')) {
      let newUrl = url.replace('#', '?');
      next({path: `/save${newUrl.substring(newUrl.indexOf('?'))}`})
    }
    next();
  },
},
{
  path: `/save`,
  component: Auth,
  props: (route) => ({
    access_token: route.query.access_token
  })
},
...