Кук ie не сохраняется в базе данных mysql при использовании реакции и паспорта. js

Question

Цель: сервер для моего приложения реагирования, которое будет обрабатывать аутентификацию.

Я использую: express и паспорт. js

Однако я просто не могу заставить его работать. Я использую локальную стратегию для паспорта с MySQL (для хранения данных сеанса)

При использовании этого примера: https://github.com/passport/express-4.x-local-example/tree/master/view

• Работает аутентификационная часть.
• Данные сеанса, хранящиеся в базе данных, также отлично работают.

Когда я представляю реакцию, все перестает работать. React может взаимодействовать с бэкэндом и может идеально извлекать данные из базы данных. Но при входе в систему данные сеанса не сохраняются в базе данных.

Итог - Я не могу получить доступ к информации, которая должна быть сохранена по паспорту.

index. js

var express = require("express");
var mysql = require("mysql");
var passport = require("passport");
var Strategy = require("passport-local").Strategy;
var session = require("express-session");
var logger = require("morgan");
var MySQLStore = require("express-mysql-session");
var cors = require("cors");



var authRouter = require("./auth");

const pool = mysql.createPool({
  connectionLimit: 10,
  host: "127.0.0.1",
  user: "root",
  password: "root",
  database: "cercom",
  port: 8889
});

function getConnection() {
  return pool;
}

passport.use(
  new Strategy(function(username, password, cb) {
    const connection = getConnection();

    connection.query(
      "SELECT id, username, password FROM users WHERE username = ?",
      [username],
      function(err, results, fields) {
        if (err) {
          cb(err);
        }

        if (results.length === 0) {
          cb(null, false);
        }
        if (results[0].password === password) {
          cb(null, results[0].id);
        } else {
          cb(null, false);
        }
      }
    );
  })
);

var app = express();

app.use(cors());

const options = {
  host: "127.0.0.1",
  user: "root",
  password: "root",
  database: "cercom",
  port: 8889
};

var sessionStore = new MySQLStore(options);

app.use(logger("dev"));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));

app.use(cookieParser());

app.use(
  session({
    secret: "keyboard cat",
    resave: false,
    saveUninitialized: false,
    store: sessionStore,
    cookie: { secure: false }
  })
);

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

app.use("/auth", authRouter);

app.get("/username", function(req, res, next) {
  const connection = getConnection();

  const id = req.session.passport.user;
  const queryString = "SELECT username FROM users WHERE id = ?";

  connection.query(queryString, [id], function(error, results, fields) {
    if (error) throw error;
    console.log(results[0]);
    res.send(results[0]);
  }); */
});

app.listen(5000, function() {
  console.log("Listening on port 5000");
});

auth. js

var express = require("express");
var router = express.Router();
var passport = require("passport");

router.get("/logout", function(req, res, next) {
  req.logout();
  req.session.destroy();
});

router.post(
  "/login",
  passport.authenticate("local", { session: true }),
  function(req, res) {
     console.log(req.session);
  }
);

passport.serializeUser(function(user_id, cb) {
  cb(null, user_id);
});

passport.deserializeUser(function(user_id, cb) {
  cb(null, user_id);
});

module.exports = router;

Form. js

import React, { useState } from "react";

const Form = () => {
  const [username, setUsername] = useState("");
  const [password, setPassword] = useState("");

  const handleSubmit = e => {
    e.preventDefault();

    const data = {
      username: username,
      password: password
    };

    fetch("/auth/login", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      credentials: "include",
      body: JSON.stringify(data)
    })
      .then(function(response) {
        if (response.status >= 400) {
          throw new Error("Bad response from server");
        }
        return response.json();
      })
      .then(function(response) {
        console.log(response);
      })
      .catch(function(err) {
        console.log(err);
      });
  };

  const handleLogout = e => {
    e.preventDefault();

    fetch("/auth/logout", {
      method: "GET",
      headers: { "Content-Type": "application/json" }
    })
      .then(function(response) {
        if (response.status >= 400) {
          throw new Error("Bad response from server");
        }
        return response.json();
      })
      .then(function(response) {
        console.log(response);
      })
      .catch(function(err) {
        console.log(err);
      });
  };

  return (
    <form onSubmit={handleSubmit} method="POST">
      <label>Username</label>
      <input
        type="text"
        name="username"
        onChange={e => setUsername(e.target.value)}
        value={username}
      />
      <label>Password</label>
      <input
        type="password"
        name="password"
        onChange={e => setPassword(e.target.value)}
        value={password}
      />
      <div>
        <button>Submit</button>
        <button onClick={handleLogout}>Logout</button>
      </div>
    </form>
  );
};

export default Form;

Я надеялся, что паспорт. js будет самым простым способом получить аутентификация работает. Если у вас есть какие-либо предложения по поводу другого типа бэкэнда, который делает аутентификацию менее трудной, я весь слух.