时间戳

首页 > 解决方案 > 错误：引发了跨域错误。错误：应该设置一个秘密

reactjs - 错误：引发了跨域错误。错误：应该设置一个秘密

问题描述

我正在学习制作电子商务网站的课程，当我尝试注册用户时，我收到此错误： 在此处输入图像描述 讲师克隆了我的 repo 并没有收到任何错误，但是每当我尝试注册或登入。

我该如何解决这个问题？任何帮助将非常感激。我用来处理错误的 errorHandler 文件可能存在问题。

控制器/auth.js

const User = require('../models/user')
const jwt = require('jsonwebtoken') // to generate signed token
const expressJwt = require('express-jwt') // for authorization check
const { errorHandler } = require('../helpers/dbErrorHandler')

exports.signup = (req, res) => {
    console.log("req.body", req.body)
    // signs up new user
 const user = new User(req.body)
 user.save((err, user) => {
if(err) {
    return res.status(400).json({
        err: errorHandler(err)
    })
}
user.salt = undefined 
user.hashed_password = undefined

res.json({
    user 
 })
 })
}

exports.signin = (req, res) => {
// find user based on email
const { email, password } = req.body 
User.findOne({email}, (err, user) => {
if (err || !user) {
    return res.status(400).json({
        error: 'User with that email does not exist.'
    })
}
// if user is found, ensure email & password match
// create authenticate method in user model
if (!user.authenticate(password)) {
    return res.status(401).json({
error: 'Email and password dont match'
    })
}
// generate signed token with user id and secret
const token = jwt.sign({_id: user._id}, process.env.JWT_SECRET)

// persist token as 't' in cookie with expiry date
res.cookie('t', token, {expire: new Date() + 9999 })

// return response with user & token to frontend client
const {_id, name, email, role} = user
return res.json({token, user: {_id, email, name, role}})
})
}

exports.signout = (req, res) => {
    res.clearCookie('t')
    res.json({ message: "Signout success" })
}

exports.requireSignin = expressJwt({
secret: process.env.JWT_SECRET,
userProperty: 'auth'
})

exports.isAuth = (req, res, next) => {
    let user = req.profile && req.auth && req.profile._id == req.auth._id
if(!user) {
    return res.status(403).json({
        error: "Access denied"
    })
}
    next()
}

exports.isAdmin = (req, res, next) => {
    if (req.profile.role === 0) {
        return res.status(403).json({
        error: 'Admin resource! Access denied'
        })
    }
    next()
}

控制台中的错误消息：

  throw new MongooseError('The `uri` parameter to `openUri()` must be a ' +
    ^
Error [MongooseError]: The `uri` parameter to `openUri()` must be a string, got "undefined". Make sure the first parameter to `mongoose.connect()` or `mongoose.createConnection()` is a string.

标签： reactjs

解决方案

您在 ComponentsSignup 和Signin.

// Signin.js
const clickSubmit = (event) => {
    event.preventDefault()
    setValues({ ...values, error: false, loading: true })
    signin({ email, password }).then(data => {
        if (data.error) {
            setValues({ ...values, error: data.error, loading: false })
        } else {
            authenticate(data, () => {
                setValues({
                    ...values,
                    redirectToReferrer: true
                })
            })
        }
    }).catch(exc => {
        console.error("+++ exc signin: ", exc)
        // we log error 
        setValues({ ...values, error: exc.message, loading: false })
    });
}



// Signup.js
const clickSubmit = event => {
    event.preventDefault();
    setValues({ ...values, error: false });
    signup({ name, email, password }).then(data => {
        console.log("++ data: ", data);

        // if you need to check error from backend
        // else all exceptions are captured in catch block 
        if (data.error) {
            setValues({ ...values, error: data.error, success: false });
        } else {
            setValues({
                ...values,
                name: '',
                email: '',
                password: '',
                error: '',
                success: true
            });
        }
    }).catch(exc => {
        console.error('++ exc: ', exc);

        setValues({ ...values, error: exc.message, success: false });
    })
};

然后在 中auth/index.js，只返回 fetch promise 并让调用函数处理异常。

 // cors mode to allow cross-origin 
 export const signup = (user) => {
    return fetch(`${API}/signup`, {
        method: "POST",
        mode: 'cors',
        headers: {
            Accept: 'application/json',
            "Content-Type": "application/json"
        },
        body: JSON.stringify(user)
    })
        .then(response => {
            return response.json()
        })

};



// mode cors to allow cross-origin access
export const signin = (user) => {
    return fetch(`${API}/signin`, {
        method: "POST",
        mode: 'cors',
        headers: {
            Accept: 'application/json',
            "Content-Type": "application/json"
        },
        body: JSON.stringify(user)
    })
        .then(response => {
            return response.json()
        })

}

在后端，确保这些键已设置 process.env.JWT_SECRET 或者您可以使用默认值以防未设置键，或者如果未设置重要键，则在启动时退出应用程序。

进程.env.JWT_SECRET || 'default_ket'

您需要在 ecommerce-back 的根目录和其中创建 .env 文件

DATABASE=mongodb://localhost:27017/Ecommerce
JWT_SECRET=secret

在这里，Mongo 在默认端口上运行，您的数据库名称是 Ecommerce，否则根据您的设置设置值。

推荐阅读