Узел с React: невозможно запустить Google OAuth Flow - PullRequest
0 голосов
/ 05 апреля 2019

Я разрабатывал приложение Node with React с использованием шаблонов разработки программного обеспечения, которые я использовал в предыдущем приложении Node with React, но в этот раз я обнаружил, что больше не могу успешно запускать поток OAuth Google.

Я подумал, что, возможно, проблема может заключаться в учетных данных 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 должен работать шаг за шагом, но не уверен, что мне здесь не хватает?Это приложение подключается к базе данных MongoDB на сервере через Mlab.

Я ничего не изменил с Mlab, поэтому он должен работать как прежде.

...