リフレクション後の「loggedIn」状態をそのまま返します

Question

初心者はここに、一般的にはSPAに反応してください。私は私のアプリケーションの間で私のログイン状態を永続化しようとしていますが、ユーザーがページを更新するときに苦労します。現在私はログインフォームにサーバーをログインするメソッドを持っていて、Cookieを受け取っていると思います（私はFlask-Login拡張機能でFlaskを使用しています）。

constructor() { 
     super(); 
     this.state = { 
      loggedIn: false 
     } 
    } 

    logIn =() => { 
     this.setState({ 
      loggedIn: true 
     }); 
    }; 

そしてダウンログインへloggedIn状態とlogIn()コールバックを渡します。だから私は、私はカップルの例で見てきた単純なことは、このように私の親<App>コンポーネントでloggedIn状態を保存することであると思いました形。これは正常に動作しますが、リフレッシュ後にはloggedInの状態は再度明らかにfalseです。それを行う方法を使用していますか？もしそうなら、どうですか？

ありがとうございました。

編集：私はFlask-Loginが（明らかに）サーバー側のセッション認証スキームであることに気付きました。したがって、送信するクッキーはhttpOnlyなので、最初の回答で推奨されているようにJSを使用してアクセスすることはできません。 SPAにhttpOnlyセッションクッキーを使用しているドキュメントはありますか？

Answer 1

loggedIn状態をCookieに格納することができます。 react-cookienpm package.

constructor() { 
    super(); 
    this.state = { 
     loggedIn: false 
    } 
} 

componentWillMount() { 
    var loggedIn = cookie.load('loggedIn'); 
    if(loggedIn !== undefined) { 
     this.setState({loggedIn}) 
    } 
} 
logIn =() => { 
    this.setState({ 
     loggedIn: true 
    }); 
    cookie.save('loggedIn', true); 
};