0
Reactで認証しようとしています。私のLogin.jsファイルには、json（セッションストレージで使用される）とLinkコンテナの送信ボタンをフェッチするhandleClick関数があります。今私のindex.jsファイルでは、私は代わりにrequireAuth関数があります。私の問題は、私のhandleClickの前にrequireAuth関数が起動することです。 handleClickを実行した後に、どのようにして起動させるのですか？handleClickは、ユーザー名とパスワードが成功したかどうかを確認してから、ユーザーをログインさせます。今は、私を次のページに押し込むことはありません。コードサンプルは高く評価されています。私はReact Router v3を使用しています。ファクトリ関数の発注のために、React - authが機能しません。
Login.js：
handleClick() {
fetch('/backend/login', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
username: this.state.username,
password: this.state.password
})
})
.then(response =>{
if (response.ok) {
response.json().then(data => {
sessionStorage.setItem('loggedIn', data.success);
console.log('login success: ' + sessionStorage.getItem('loggedIn'));
});
}
else {
console.log('failed');
}
})
}
render() {
<LinkContainer to='/Dashboard'>
<Button onClick={this.handleClick} type="submit"> Submit />
</Button>
</LinkContainer>
}
index.js：
function requireAuth(nextState, replace) {
if (!(sessionStorage.getItem('loggedIn') === true)) {
console.log(sessionStorage.getItem('loggedIn'));
replace({
pathname: '/',
state: { nextPathname: nextState.location.pathname }
});
}
}
ReactDOM.render(
<Router history={browserHistory}>
<Route path="/" component={Container}>
<IndexRoute component={Homepage}/>
<Route path="dashboard" component={Dashboard} onEnter=
{requireAuth}/>
</Route>
</Router>