由bcrypt授权后,Expressjs无法在reactjs的前端中设置cookie

时间:2020-03-22 17:21:25

标签: reactjs express authentication mongoose bcrypt

我正在使用reactjs创建一个在线购物网站,并使用express js做后端,当我授权用户登录时,我无法将cookie设置为前端

控制器/用户/登录(来自expressjs)

// user.controller
 bcrypt.compare(req.body.password, user[0].password, (err, result) => { 
                if (err) {
                    console.log(err);
                    return res.status(401).json({ message: "password problem" });
                }


                if (result) {
                    const userId = JSON.stringify(user[0]._id);
                    res.cookie('userId', userId, { httpOnly: true, secure: true });
                    return res.status(200)
                        .json({
                            message: userId
                        })
                }
                return res.status(401).json({ message: "Auth failed" });
            })
来自Express的

app.js

const express = require('express');
const app = express();
const morgan = require('morgan');
const bodyPaser = require('body-parser');
const mongoose = require('mongoose');
const cookiePareser = require('cookie-parser');
const cors = require('cors');

const productRouter = require('./api/routes/products');
const orderRouter = require('./api/routes/orders');
const userRouter = require('./api/routes/user');

mongoose.connect("mongodb+srv://conor_9tails:Mongoatlas123@cluster0-xcpy1.mongodb.net/test?retryWrites=true&w=majority",
    {
        useUnifiedTopology: true
    }
);

mongoose.Promise = global.Promise;

mongoose.connection.on('connected', () => {
    console.log("connected to mongo atlas");
});

app.use(morgan('dev'));
app.use(cookiePareser());
// app.use('/uploads', express.static('uploads'));
app.use(bodyPaser.urlencoded({ extended: false }));
app.use(bodyPaser.json());

app.use(cors({ origin: "*" }));

app.use('/products', productRouter);
app.use('/orders', orderRouter);
app.use('/user', userRouter);
app.use((req, res, next) => {
    const error = new Error('Not found');
    error.status = 404;
    next(error);
});

app.use((error, req, res, next) => {
    res.status(error.status || 500);
    res.json({
        error: {
            message: error.message
        }
    });
});


module.exports = app;

然后我制作一个叫做auth的中间件,通常只是打印出cookie userId

来自中间件的

check-auth.js /来自expressjs的checkauth

module.exports.requireAuth = (req, res, next) => {
    console.log("THIS IS cookies", req.cookies);
    next();
};

从前端,我从reactjs创建一个登录组件

 handleSubmit(event) {
        let { email, password } = this.state;

        fetch("http://localhost:5000/user/login", {
            method: "POST",
            body: JSON.stringify({
                email, password
            }),
            headers: {
                "content-type": "application/json; charset=UTF-8"
            }
        })
            .then(response => {
                return response.json();
            })
            .then((json) => {
                console.log(json);
            })
            .catch((error) => {
                console.log(error);
            })
        event.preventDefault();
    }

如您所见,我在console.log response.json()中包含userId消息,并成功enter image description here

但Chrome应用程序中没有存储cookie

感谢您的时间来帮助我解决这个艰巨的问题

0 个答案:

没有答案