Home > front end >  Locally, Auth works. on Deployment, logs in, but the Auth gets returned False
Locally, Auth works. on Deployment, logs in, but the Auth gets returned False

Time:02-10

Locally this

module.exports.isAuth = (req, res, next) => {
  if (req.isAuthenticated()) {
    next();
    // res.status(200).json({ user: req.user, auth: true });
  } else {
    return res.status(401).json({ auth: false, msg: "Here" });
  }
};

Works perfectly, I get logged in.

But when I try to do it with the backend on Heroku and not locally, I get the "Else" returned to the front end.

The problem is I know where the issue is, most likely, I just feel like I'm in an empty room looking for it.

I get the Json object returned on the front end, even though my passport middleware logs "logged in" on the server. heres the passport middleware

const passport = require("passport");
const LocalStrategy = require("passport-local").Strategy;
const connection = require("./database");
const mongoose = require("mongoose");
const User = mongoose.models.User;
const validPassword = require("../lib/passwordUtils").validPassword;
const cors = require("cors");
passport.use(
  cors({
    origin: [
      "http://2607:fb90:b6e0:a363:f89f:be4b:a976:9ed0:3001",
      "https://frontendfullstack.netlify.app",
      "http://localhost:3001",
      "localhost:3001",
    ],
    credentials: true,
    methods: "GET,HEAD,PUT,PATCH,POST,DELETE",
  })
);

const customFields = {
  usernameField: "username",
  passwordField: "password",
};

passport.use(
  new LocalStrategy(customFields, (username, password, done) => {
    User.findOne({ username: username })
      .then((user) => {
        if (!user) {
          console.log("No user");
          return done(null, false);
        } else {
          const isValid = validPassword(password, user.hash, user.salt);
          if (isValid) {
            console.log("Logged in");

            return done(null, user);
          } else {
            console.log("Wrong Password");
            return done(null, true);
          }
        }
      })
      .catch((err) => {
        done(err);
      });
  })
);

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

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

And just to reiterate, when the server is local, it works, I get logged in and redirected, the site works perfectly.

CodePudding user response:

The problem is that the Passport Local Strategy uses cookies for authentication, and Heroku only allows cookies to be set for its own domain.

As your frontend is hosted in Netlify, if you check the developer tools you will notice no cookie being set. So, the next request you make after logging in, fails.

Not much you can do except hosting the backend together with the frontend in Heroku, that way your app will work.

I answered a similar question a few days ago and left some tips at the end:

Not able to set/receive cookies cross-domain using Netlify and Heroku

  •  Tags:  
  • Related