ReactJs和Passport Auth

Question

尝试使用react和Passport js

创建auth系统

我的护照看起来像这样：

let passport = require('passport');
let User = require('../models/user');
let localStorage = require('passport-local').Strategy;

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

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

passport.use('local.signup', new localStorage({
    usernameField: 'email', passwordField: 'password', passReqToCallback: true
}, function(req, email, password, done){
    //Check valid
    req.checkBody(req.body.email, 'Invalid email').notEmpty().isEmail();
    req.checkBody(req.body.password, 'Invalid password').notEmpty().isLength({min: 4});
    req.checkBody(req.body.name, 'Name is require!').notEmpty();
    let errors = req.validationErrors(); //Get all errors for checkBody

    if(errors){
        let messages = [];
        errors.forEach(function(error){
            messages.push(error.msg)
        });
        return done(null, false, req.flash('error', messages));
    } 

    User.findOne({'email': req.body.email}, function(err, user){
        if(err) return done(err);
        if(user) return done(null, false, {message: 'Email is already in use'});

        var newUser = new User();
        newUser.email= req.body.email;
        newUser.password = newUser.encryptPassword(req.body.password);
        newUser.name = req.body.name;

        newUser.save((err, user) => {
            if(err) return done(err);
            return done(null, user);
        })
    })
}));

我的路线档案：

const express = require('express');
const passport = require('passport');
let router = express.Router();

let User = require('../models/user');

router.post('/signup', passport.authenticate('local.signup', {
    failureRedirect: '/', failureFlash: true
}), function(req, res,next){
   console.log('Yes signUp');
});

module.exports = router;

反应文件：

handleChange = ev => {
        this.setState({[ev.target.name]: ev.target.value});
    }

    onSubmit = ev => {
        ev.preventDefault();
        let user = {
            name: this.state.name,
            email: this.state.email,
            password: this.state.password
        }
        axios.post('http://localhost:3001/signup', user)
             .then(res=> { console.log(res) })
             .catch(err=> { console.error(err) })           
    }

    render() {
        return (
            <div className="container login-container">
                <div className="title-login text-center">Login</div>
                <hr/>
                <div className="login-form">
                    <div className="form-group">
                        <input type="email" className="form-control" name="email" value={this.state.email} placeholder="Enter your Email.." onChange={this.handleChange} />
                    </div>
                    <div className="form-group">
                        <input type="text" className="form-control" name="name" value={this.state.name} placeholder="Enter your Name.." onChange={this.handleChange} />
                    </div>
                    <div className="form-group">
                        <input type="password" className="form-control" name="password" value={this.state.password} placeholder="Enter your password.." onChange={this.handleChange} />
                    </div>
                    <button className="btn btn-outline-primary btn-block" onClick={this.onSubmit}>Send</button>
                </div>
            </div>
        )
    }

错误是：

  

选项http://localhost:3001/ 404（未找到）注册：1无法加载   http://localhost:3001/：预检的响应具有无效的HTTP状态   代码404. index.js：2178错误：网络错误       at createError（createError.js：16）       在XMLHttpRequest.handleError（xhr.js：87）

帮助！