2

我使用https://www.npmjs.com/package/react-google-login在我的应用程序中设置了身份验证。当我重新加载页面时，我无法弄清楚为什么会话/cookie 信息会在我的应用程序中消失。即已登录的用户重新加载页面将被注销:(

这是我的应用程序登录组件中的代码：

const Login = () => {
  const [user, setUser] = useContext(UserContext);

  const onSuccess = (response) => {
    axios.post(API_ONE, {
      name: response.profileObj.name,
    });

    axios.post(API_TWO, {
      email: response.profileObj.email,
    });

    navigate("/");
    setUser({
      id: response.profileObj.email,
      userLoggedIn: true,
    });
  };

  const { signIn } = useGoogleLogin({
    onSuccess,
    clientId: CLIENT_ID,
    isSignedIn: true
  });

  return (
    <div>
      <button onClick={signIn}></button>
    </div>
  );
};

export default Login;

当我尝试在一个简单的演示应用程序中单独测试功能时，我可以确认 react-google-login 保留了会话信息。

我花了很多时间试图弄清楚为什么会发生这种情况，但还没有运气。如果有人可以帮助我解决任何故障排除/调试提示或建议我可以采取的替代想法来实现身份验证功能并在刷新时保留会话，我将不胜感激。

编辑：

  1. 在简单的演示应用程序（https://github.com/Sivanesh-S/react-google-authentication）中，我同时打开了应用程序选项卡和网络选项卡，然后当我在登录后尝试刷新时，我可以看到网络请求到accounts.google.com。在这个网络请求之后，我可以在应用程序选项卡中看到本地存储、cookie 和会话信息。

  2. 在我的应用程序中，当我在登录后尝试刷新时，我看不到对 accounts.google.com 的网络请求。本地存储、cookie 和会话信息在应用程序选项卡中被清除

{
  "name": "my-app",
  "version": "1.0.0",
  "main": "src/App.js",
  "dependencies": {
    "@reach/router": "^1.3.3",
    "axios": "^0.19.0",
    "react": "^16.13.1",
    "react-dom": "^16.12.0",
    "react-google-login": "^5.1.21",
    "react-router-dom": "^5.2.0",
    "react-scripts": "0.9.5"
  },
  "devDependencies": {
    "babel-eslint": "^10.1.0",
    "eslint": "^7.12.0",
    "eslint-config-prettier": "^6.14.0",
    "eslint-plugin-import": "^2.22.1",
    "eslint-plugin-jsx-a11y": "^6.3.1",
    "eslint-plugin-react": "^7.21.5",
    "parcel-bundler": "^1.12.4"
  },
  "scripts": {
    "dev": "parcel src/index.html",
    "clear-build-cache": "rm -rf .cache/ dist/",
    "format": "prettier \"src/**/*.{js, html}\" --write",
    "lint": "eslint \"src/**/*.{js,jsx}\" --quiet"
  }
}
4

1 回答 1

0

我想这与包裹有关。我猜包裹在这里做点什么。因此，我建议您将 package.json 更改为以下内容。

"dev": "react-scripts 开始",

并且请考虑这条线。

"clear-build-cache": "rm -rf .cache/dist/",

所有本地存储都保存在文件系统中的某个位置，但看起来您的构建系统每次都会清除它们。

于 2021-05-24T16:28:20.687 回答