Question

我一直在使用带有React的先前应用程序中使用的软件设计模式在带有React的Node应用程序中进行开发，但是这次我发现我不再能够成功触发Google OAuth流程。

我认为问题可能出在Google OAuth凭据上，但是当我尝试使用新的凭据时，我得到的行为却与OAuth流程无关。

我查看了我的authRoutes.js文件：

const passport = require("passport");

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("/blogs");
    }
  );

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

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

我已将app.get("/auth/logout", (req, res) => {更改为您在上方看到的用auth/取代api/的内容，但这并没有改善功能。

我从此重构了Header.js：

class Header extends Component {
  renderContent() {
    switch (this.props.auth) {
      case null:
        return;
      case false:
        return (
          <li>
            <a href={"/auth/google"}>Login With Google</a>
          </li>
        );
      default:
        return [
          <li key="3" style={{ margin: "0 10px" }}>
            <Link to="/blogs">My Blogs</Link>
          </li>,
          <li key="2">
            <a href={"/api/logout"}>Logout</a>
          </li>
        ];
    }
  }

对此：

class Header extends Component {
  renderContent() {
    switch (this.props.auth) {
      case null:
        return;
      case false:
        return (
          <li>
            <a href="/auth/google">Login With Google</a>
          </li>
        );
      default:
        return [
          <li key="3" style={{ margin: "0 10px" }}>
            <Link to="/blogs">My Blogs</Link>
          </li>,
          <li key="2">
            <a href="/api/logout">Logout</a>
          </li>
        ];
    }
  }

是的，我什至将带有href元素的锚标记更改为Link标记，但仍然没有改善。

我错过了什么？我了解Google OAuth流程应该如何逐步运行，但是不确定我在这里缺少什么吗？该应用程序通过Mlab连接到后端的MongoDB数据库。

我没有对Mlab进行任何更改，因此它应该像以前一样工作。

具有React的节点：无法触发Google OAuth流

0 个答案: