Localmente esto
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" }); } };Funciona perfectamente, logré iniciar sesión.
Pero cuando trato de hacerlo con el backend en Heroku y no localmente, obtengo el "Else" devuelto al front-end.
El problema es que sé dónde está el problema, muy probablemente, siento que estoy en una habitación vacía buscándolo.
Obtengo el objeto Json devuelto en el front-end, a pesar de que mi middleware de pasaporte registra "iniciado sesión" en el servidor. aquí está el middleware de pasaporte
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)); });Y solo para reiterar, cuando el servidor es local, funciona, me conecto y me redirigen, el sitio funciona perfectamente.
El problema es que Passport Local Strategy usa cookies para la autenticación, y Heroku solo permite que se establezcan cookies para su propio dominio.
Como su interfaz está alojada en Netlify, si revisa las herramientas de desarrollo, notará que no se ha configurado ninguna cookie. Por lo tanto, la siguiente solicitud que realice después de iniciar sesión fallará.
No puedes hacer mucho más que alojar el backend junto con el frontend en Heroku, de esa manera tu aplicación funcionará.
Respondí una pregunta similar hace unos días y dejé algunos consejos al final:
No se pueden configurar/recibir cookies entre dominios usando Netlify y Heroku
Bien, veamos si podemos hacer que esto funcione. No he trabajado con React, pero el proceso para construir la aplicación de producción es algo similar a Angular por lo que leí.
En primer lugar, querrá volver a una confirmación anterior en la que funcionaba su aplicación. Luego cree una nueva rama (es decir backup de seguridad) solo para asegurarse de que si algo sale mal, puede volver a ella. Ahora, vuelva a pagar a su main . Esto se debe a que Heroku ignorará las confirmaciones enviadas desde ramas que no sean la main .
Ejecute npm run build en la carpeta del proyecto de la aplicación React y obtendrá los archivos compilados en una carpeta de build . Allí encontrará el archivo index.html , y dentro de la carpeta build/static encontrará todos los archivos .js y .css con nombres cifrados que contienen el código de su aplicación.
Según la ubicación en la que se generó esta carpeta de build , es posible que deba copiarla manualmente para que termine como una carpeta dentro del árbol de carpetas de su proyecto Express.
Asegúrese de que la nueva carpeta no se ignore (consulte el archivo .gitignore ) para que se incluya en la próxima confirmación que realice.
En el archivo que configura su servidor Express ( app.js , server.js o como lo haya llamado), en la parte donde se configuran las rutas, debe agregar esta línea:
app.use(express.static(path.join(__dirname, 'build'))); Esta línea garantizará que cuando intente acceder a la ruta / , Express envíe el archivo index.html al cliente. Entonces, será como si estuviera alojado en Netlify, por ejemplo.
Ahora, puedes git add . -> git commit -m 'Deploy test message' -> git push heroku main .
Si todo salió bien, ahora puede visitar la URL que Heroku asignó a su aplicación y verá su interfaz allí.
Dependiendo de sus carpetas o variables de entorno, puede encontrarse con otros problemas, pero esto debería funcionar.
Hágamelo saber.