2017-10-13 84 views
1

我正在尝试设置用户注册的功能。注册表单使用Redux表单,身份验证由passport.js处理,我为我的用户数据库使用mongoDB(mLab)。尝试发出POST请求注册新用户时出现404错误

当我尝试注册新用户,我得到以下错误:

POST http://localhost:3000/signup 404 (Not Found) 
Uncaught (in promise) Error: Request failed with status code 404 

动作/ index.js:

export const createUser = values => async dispatch => { 
    const res = await axios.post('/signup', values); 

    dispatch({ 
    type: CREATE_USER, 
    payload: res 
    }); 
}; 

authRoutes.js:

const passport = require('passport'); 

module.exports = app => { 
    app.post(
    '/signup', 
    passport.authenticate('local-signup', { 
     successRedirect: '/', 
     failureRedirect: '/signup', 
     failureFlash: true 
    })); 
}; 

passport.js:

const passport = require('passport'); 
const LocalStrategy = require('passport-local').Strategy; 
const mongoose = require('mongoose'); 
const User = mongoose.model('users'); 


// Local signup strategy 
passport.use('local-signup', new LocalStrategy(
    { 
    usernameField: 'email', 
    paswordField: 'password', 
    passReqToCallback: true 
    }, 
    (req, email, password, done) => { 
    console.log(req); 
    User.findOne({ 'local.email': email }, (err, user) => { 
     if (err) { return done(err); } 

     if (user) { 
     return done(null, false, { message: 'That email already exists.' }); 
     } else { 
     const newUser = new User({ 
      'local.email': email, 
      'local.password': password 
     }).save(err => { 
      if (err) { throw err }; 
     }); 
     return done(null, newUser); 
     console.log(newUser); 
     } 
    }); 
    } 
)); 

SignUp.js:

import _ from 'lodash'; 
import React, { Component } from 'react'; 
import { connect } from 'react-redux'; 
import { reduxForm, Field } from 'redux-form'; 
import validateEmail from '../../utils/validateEmail'; 
import FormField from './FormField'; 
import signUpFields from './signUpFields'; 
import * as actions from '../../actions'; 

class SignUp extends Component { 
    onSubmit(values) { 
    values.email = values.email.trim(); 
    this.props.createUser(values); 
    } 

    renderFields() { 
    return _.map(signUpFields, ({ label, name, type }) => { 
     return <Field key={name} type={type} component={FormField} name={name} label={label} /> 
    }); 
    } 

    render() { 
    return (
     <div> 
     <h2>Sign Up</h2> 
     <form onSubmit={this.props.handleSubmit(this.onSubmit.bind(this))}> 
      {this.renderFields()} 
      <button type='submit' className='teal btn-flat right white-text'> 
      Sign Up 
      </button> 
     </form> 
     </div> 
    ) 
    } 
} 

function validate(values) { 
    const errors = {}; 

    errors.username = validateEmail(values.username); 

    if (values.password !== values.confirmPassword) { 
    errors.confirmPassword = 'Must match password'; 
    } 

    return errors; 
} 

SignUp = reduxForm({ 
    validate, 
    form: 'signupForm' 
})(SignUp); 

export default connect(null, actions)(SignUp); 

的代码休息以供参考:https://github.com/drhectapus/Voting-App

好像POST请求无法得到处理,但不能为我的生命找出原因。任何帮助非常感谢:)

回答

0

意识到,我忘记了创建的阵营侧的package.json代理规则(我的目录有创建反应的应用程序内嵌套在一个节点应用程序内)

+0

哎@ cryptofish123我有类似的问题,但在我的package.json中添加一个“代理”在客户端部分没有帮助。你是否还在服务器端添加了一个代理服务器:true? – jessi

+0

@jessi是否将新用户保存到数据库? – doctopus

+0

哦,我解决了这个问题,并忘记了这一点。事实证明,我有代理,但我忘记了设置body_parser – jessi

相关问题