Как разрешить URL путем выборки и перенаправления без обновления с реакцией - PullRequest
Новая
       9

Как разрешить URL путем выборки и перенаправления без обновления с реакцией

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

Мне нужно получить текущий URL в моем приложении реагирования, потому что наш front / nginx может ответить перенаправлением, которое не будет выполнено, если у пользователя активен рабочий-сервис.

, поэтому у меня в данный момент естьэта логика в моем 404 компоненте на didMount.

fetch('/test/page/xxxx/', {redirect: 'follow'}).then(res => {
  if(res.status === 200 && res.redirected) {
    console.log(res)
    // this.props.push(res.url)
    // window.location.replace(res.url)
    // window.location.hash = res.url
    console.log('Redirected to ' + res.url)
  }
})

Res.url, который я получаю в ответе, является полным URL-адресом, например: https://example.net/xxx/xxx/xxxx, что затрудняет мне использование push отact-router-redux, потому что он ожидаетотносительный URL.Может кто-нибудь помочь мне с регулярным выражением, которое может получить слагов из res.url, или у кого-нибудь есть другие идеи, как решить эту проблему?

Ответы [ 2 ]

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

Самый простой способ получить путь (относительный URL) - это проанализировать его с помощью API интерфейса URL 

const { pathname } = new URL("https://example.net/aaa/bbb/ccc");
console.log(pathname) // "/aaa/bbb/ccc"

В контексте вашего кода 

fetch("/test/page/xxxx/", { redirect: "follow" }).then(res => {
  if(res.status === 200 && res.redirected) {
    const { pathname } = new URL(res.url);
    this.props.push(pathname);
  }
});

ПРИМЕЧАНИЕ. Не поддерживается в IE11 и ниже.Если требуется поддержка этого браузера, существует полифилла https://github.com/lifaon74/url-polyfill

Также есть предложение , которое будет добавлено в babel, ожидается, что в скором времени появится функция этапа 0

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

В window имеется интерфейс URL [1] , который можно использовать для создания объекта URL.

A URLобъект имеет свойство pathname, которое используется для получения компонента пути URL. 

this.props.push(
  new URL(res.url).pathname
)
...