4

反応ルーターを使用して、サーバー側の別のページからページをリダイレクトする必要があります。私が書いたコードはクライアント側で動作しますが、サーバー レンダーでは動作しません。ここでコードを見つけることができます：

https://github.com/jurgob/iso-login/blob/e26af0152896a949435db62549027b2683276db7/src/shared/components/LoginPage.js

これは/src/shared/components/LoginPage.js内のリダイレクト コードです。

componentWillMount() {
    ...
    this.props.history.replaceState(null, '/home');
  }

ノート：

https://github.com/jurgob/iso-login/blob/e26af0152896a949435db62549027b2683276db7/src/shared/routes.jsを見ると

やった：

function requireAuth(nextState, replaceState) {
  // replaceState({ nextPathname: nextState.location.pathname }, '/login');
}
...
<Route path="home" component={HomePage} onEnter={requireAuth} />

このコードは機能していますが、コンポーネント内でリダイレクトを行いたい

4

2 に答える 2

1

これを処理するには、いくつかの異なる方法があります。

1 - クライアント側でリダイレクトを実際に発生させても問題ない場合は、次のようなことができます

history.push('/newPath/');

これは、2 つの異なる種類のリダイレクト (クライアント上とサーバー上) を持たないようにするために、私が使用したソリューションです。私の場合、「コンテキスト」小道具を渡しました（コードのサーバー側部分のみのため、私の方法はより似ています

componentWillMount() {
  if (this.props.context) { // context only available on server side
    this.props.context.doLogout();
  }
  this.props.history.push('/newPath/');
}

2 - サーバーにリダイレクトを実行させたい場合は、エクスプレスまたは使用しているフレームワークから応答オブジェクトを渡す必要があります。

componentWillMount() {
  // you may have to this.props.history.push('/currentPath');
  this.props.res.redirect(302, '/newPath/');
}

必要に応じて喜んで詳しく説明します-私はこれに時間を費やし、前の解決策を選択しました（正確さよりもコードの単純さですが、あなたにとってうまくいくものは何でも）。

于 2015-12-22T02:34:29.240 に答える