在React SPA应用程序中存储和检索会话Laravel Passport令牌

时间:2019-05-12 20:51:20

标签: reactjs laravel react-redux laravel-passport

我想用Passport Auth API实施一个简单的SPA应用程序,

我尝试使用localStorage(在js中)将令牌存储在此处,但似乎并不安全。所以我在寻找替代方案。

顺便说一句。 Laravel 5.8反应了16.8

export const LogIn = formValues => async dispatch => {
    connect.post('auth/login', formValues).then(response => {
        return response;
      })
      .then(json => {
        if (json.status === 200) {
         // alert("Login Successful!");

          let userData = {
            email: formValues.email,
            auth_token: json.data.access_token,
            timestamp: new Date().toString()
          };

          let appState = {
            isLoggedIn: true,
            user: userData
          };

          // save app state with user date in local storage
          localStorage["appState"] = JSON.stringify(appState);

          return userData;

        } else alert("Login Failed!");

      })
      .catch(error => {
        let appState = {
          isLoggedIn: false,
          user: {}
        };

        localStorage["appState"] = JSON.stringify(appState);

        alert(`An Error Occured! ${error}`);
      });
};

我可以从我的APP登录和注销。只有刷新后,我才会丢失令牌。我已经在这里迷失了两个星期:(

1 个答案:

答案 0 :(得分:1)

您需要做的是保持身份验证状态。

您可以通过创建上下文提供程序并访问组件内部的值(签出React Redux Connect API或签出React Context API)来做到这一点