willTransitionTo
認証に静的メソッドを 使用しています。これは、私が多少従っている例です。
私transition.retry()
は元のクエリ文字列とともに元のルートに行きます。ただし、クエリ文字列の先頭に疑問符がないため、遷移で意図されたルートに移動する代わりに、次のようになります。/authToken=xyz123
そう、
- ユーザーはhttp://wickedsweet-react-site.com/?authToken=xyz123にアクセスします
- http://wickedsweet-react-site.com/waitforserverauthへの反応ルート (経由
transition.redirect
) - サーバーは認証中であり、戻ります
- http://wickedsweet-react-site.com/authToken=xyz123 oopsへのルートを反応させます (経由
transition.retry()
)
のストリッピングを回避するにはどうすればよい?
ですか? ちなみに、すでに認証済みなので、この時点では authToken クエリ文字列は必要ありませんが、今のところ、それは二次的な問題です。
これが私のwillTransitionTo
方法です。
mixins: [Reflux.connect(stores.AuthDataStore, 'auth_data')],
statics: {
willTransitionTo: function (transition, params, query) {
var auth_data = stores.AuthDataStore.getData();
if (!auth_data.authenticated) {
some_global_object.authTransition = transition;
if (query.authToken && !_.isEmpty(query.authToken)) {
auth.authenticate({token: query.authToken}); // tells server to auth
transition.redirect("/waitforserverauth", params, {}); //don’t want the query-string after this point
return;
}
}
}
}
認証のために、「authToken」というクエリ文字列パラメーターにトークンを渡しています。ユーザーがauthTokenを渡すとwillTransitionTo
、サーバーに認証を依頼し、サーバーの認証をリッスンするWaitingForAuthページにユーザーをリダイレクトするために使用しています。これが WaitingForAuth React ページです。
var WaitingForServerAuth = React.createClass({
mixins: [Reflux.connect(stores.AuthDataStore, 'auth_data')],
componentWillUpdate: function(nextProps, nextState) {
if (nextState.auth_data.authenticated && some_global_object.authTransition) {
some_global_object.authTransition.retry();
}
},
render: function() {
return (<div><Loading /></div>);
}
});
サーバーが認証を返し、トークンが有効な場合、 WaitingForAuth が実装さcomponentWillUpdate
れ、リダイレクトで中止された元の遷移が再試行されます。