Javascript 坚持'；loggedIn'；React中刷新后的状态

一般来说，对初学者和水疗有反应。我试图使我的登录状态在我的应用程序中持久化，但我很难在用户刷新页面时保持这种状态。目前，我的登录表单中有一个方法调用服务器进行登录，我猜会收到一个cookie（我使用的是带有Flask登录扩展名的Flask）。因此，我认为我在几个示例中看到的一件简单的事情是将

loggedIn

状态存储在我的父

组件中，如下所示：

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

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

然后将

loggedIn

状态和

logIn（）

回调传递给登录表单。这可以正常工作，但在刷新

loggedIn

之后，状态显然再次变为

false

。是用这种方式做的吗？如果是，怎么做

谢谢你的帮助

---

编辑：经过一系列研究，我意识到Flask登录（显然）是一种服务器端会话身份验证方案或其他什么。所以它发送的cookie是

httpOnly

，所以我无法按照第一个答案中的建议使用JS访问它。是否有任何文档使用SPA中的

httpOnly

会话cookie？

您可以在cookie中存储loggedIn状态，。使用

react cookie

---

但是，如果cookie是httpOnly，那么它还能工作吗？或者我需要一个新的cookie吗？这些cookie将存储在您的浏览器和hance中，这将起作用，但我认为您无法从浏览器中读取httpOnly cookies？使用react cookie，您可以选择设置httpOnly cookie，但默认情况下它是false，因此客户端可以读取和修改它们。我希望有帮助。这是我也使用过的一种方法，所以我知道这个工作我知道你可以创建带有httpOnly标志的cookie。但是我不想创建一个新的cookie。问题是服务器正在向浏览器发送一个httpOnly cookie并保存它，因为我猜会话管理是在服务器上完成的。我的知识相当贫乏。但是我再也不能碰这块饼干了。我甚至不认为你能挺过去。我相信有一个共同的方式做这件事，我只是找不到任何在线。

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);
};