时间戳

首页 > 解决方案 > Google OAuth 2.0 无法在生产环境中登录/注销

reactjs - Google OAuth 2.0 无法在生产环境中登录/注销

问题描述

登录/注销功能在开发中完美运行。但是，在将其部署到 heroku 之后，浏览器会缓存数据并保持登录状态，而注销按钮只会刷新页面。我可以清除浏览器缓存数据，它可以让我正确登录，但同样的情况继续发生。有时反之亦然，登录按钮会刷新页面。我不确定我做错了什么。请提前帮助和感谢！

我对使用护照还是很陌生，这里是相关代码：

我的 index.js

app.use(
  cookieSession({
    maxAge: 24 * 60 * 60 * 1000, // cookies expire in 1 day
    keys: [keys.cookieKey]
  })
);

app.use(passport.initialize());
app.use(passport.session());

我的护照.js

passport.serializeUser((user, done) => {
  done(null, user.id);
});

passport.deserializeUser((id, done) => {
  User.findById(id).then(user => done(null, user));
});

passport.use(
  new GoogleStrategy(
    {
      clientID: keys.googleClientID,
      clientSecret: keys.googleClientSecret,
      callbackURL: '/auth/google/callback',
      proxy: true
    },
    (accessToken, refreshToken, profile, done) => {
      User.findOne({ googleId: profile.id }).then(user => {
        if (user) {
          return done(null, user);
          new User({ googleId: profile.id })
            .save()
            .then(user => done(null, user));
        }
      });
    }
  )
);

我的 authRoutes.js

module.exports = app => {
  app.get(
    '/auth/google',
    passport.authenticate('google', {
      scope: ['profile', 'email']
    })
  );

  app.get(
    '/auth/google/callback',
    passport.authenticate('google'),
    (req, res) => {
      res.redirect('/');
    }
  );

  app.get('/api/logout', (req, res) => {
    req.logout();
    req.session = null;
    res.redirect('/');
  });

  app.get('/api/current_user', (req, res) => {
    res.send(req.user);
  });
};

标签： reactjsexpresspassport.jsgoogle-oauthcookie-session

解决方案

这个问题是因为与 Create-React-App 一起打包的 service worker。它拦截 /api 路由并将其发送到 React-Router，换句话说，它不会被 Express 处理。

现在这一切都假设您实际上正在使用 Create-React-App。

在您的客户端主 index.js

import { unregister } from './registerServiceWorker';

然后在 render() 之前调用该函数。

unregister();

ReactDOM.render(

    <Provider store={store}> 

        <App/>

    </Provider> , 

     document.getElementById('root'));

确保清除缓存并在浏览器上硬重新加载。缓存可能会在 24 小时后失效。

希望这可以帮助！

推荐阅读