Итак, я работаю над сайтом электронной коммерции для моего github portfilio, у меня возникают трудности с подключением сервера к клиенту, я создал сервер с nodejs, express и mongodb, но не могу подключить его к реагирующий компонент SignUp. Может кто-нибудь взглянуть на код, скажите мне, что мне не хватает? Вы можете найти полный проект по этой ссылке https://github.com/RMP1992/NERM-My-Ecommerce-App
Используя почтальон, я получаю ошибку 404 Не найдено, на консоли я получаю это «Не удалось загрузить ресурс: сервер ответил с статус 404 (не найден) '
пс. Я новичок в кодировании, я занимаюсь в течение 3 месяцев.
Реагировать компонент регистрации
import React from 'react';
import axios from 'axios';
import FormInput from '../signin-signup-forms/form-input.component';
import Button from '../buttons/buttons.component';
class SignUp extends React.Component {
constructor() {
super()
this.state={
first_name: '',
last_name: '',
email: '',
password: '',
errors: {}
}
}
handleChange = event =>{
this.setState({ [event.target.id]: event.target.value });
}
handleSubmit = () =>{
axios.get('/resgister').then(response =>{
this.setState({
first_name: response.userData.first_name,
last_name: response.userData.last_name,
email: response.userData.email,
password: response.userData.password
})
})
}
render(){
return(
<div>
<FormInput
name='first_name'
type='text'
value={this.state.first_name}
onChange={this.handleChange}
label='First Name'
required
/>
<FormInput
name='last_name'
type='text'
value={this.state.last_name}
onChange={this.handleChange}
label='Last Name'
required
/>
<FormInput
name='email'
type='email'
value={this.state.email}
onChange={this.handleChange}
label='Email'
required
/>
<FormInput
name='password'
type='password'
value={this.state.password}
onChange={this.handleChange}
label='Password'
required
/>
<Button
button='Sign Up'
type='submit'
handleSubmit={this.handleSubmit}
/>
</div>
)
}
}
export default SignUp;
сервер / модели / пользователь. js
const userSchema = require('../models/users');
exports.addUser = (name, email, password) => {
let user = new userSchema({
name,
email,
password
});
user.save();
console.log('user added to DB, hopefully');
}
exports.getUsers = async() => {
let data = await userSchema.find({})
return data;
}
server.models/user.js
const mongoose = require('mongoose');
const Schema = mongoose.Schema;
const UserSchema = new Schema({
first_name: {type: String, required: true},
last_name: {type: String, required: true},
email: {type: String, required: true},
password: {type: String, required: true},
date: {type: Date, default: Date.now}
})
module.exports = User = mongoose.model('users', UserSchema);
сервер / маршруты / пользователь. js
const express = require('express');
const users = express.Router();
const cors = require('cors');
const jwt = require('jsonwebtoken');
const bcrypt = require('bcrypt');
const User = require('../models/users')
users.use(cors())
process.env.SECRET_KEY = 'secret'
users.post('/register',(req, res) =>{
const today = new Date()
const userData = {
first_name: req.body.first_name,
last_name: req.body.last_name,
email: req.body.email,
password: req.body.password,
created: today
}
User.findOne({
email: req.body.email
})
.then(user =>{
if (!user) {
bcrypt.hash(req.body.password, 10, (err, hash) =>{
userData.password = hash
User.create(userData)
.then(user =>{
res.json({ status:user.email + 'Resgistered'})
})
.catch(err =>{
res.send('error: ' + err)
})
})
}else{
res.json({ error: 'User already exists'})
}
})
.catch(err =>{
res.send('error: ' + err)
})
})
users.post('/login', (req, res) =>{
User.findOne({
email: req.body.email
})
.then(user =>{
if(user){
if (bcrypt.compareSync(req.body.password, user.password)) {
//password match
const payload = {
_id: user._id,
first_name: user.first_name,
last_name: user.last_name,
email: user.email
}
let token = jwt.sign(payload, process.env.SECRET_KEY, {
expiresIn: 1440
})
res.send(token)
} else{
//password doesn't match
res.json({ error: 'User does not exist' })
}
}else {
res.json({ error: 'User does not exist' })
}
})
.catch(err =>{
res.send('error: ' + err)
})
})
users.get('/profile', (req, res) => {
let decoded = jwt.verify(req.headers['authorisation'], process.env.SECRET_KEY)
User.findOne({
_id: decoded._id
})
.then(user =>{
if (user) {
res.json(user)
}else {
res.send('User doesn not exist')
}
})
.catch(err => {
res.send('error: ' + err)
})
})
module.exports = users
сервер / индекс. js
const bodyParser = require('body-parser');
const cors = require('cors'); //allows the server to handle requests from the client
const express = require('express');
const mongoose = require('mongoose')
require('dotenv').config();
const port = process.env.PORT || 5000
const app = express();
app.use(bodyParser.json())
app.use(cors())
app.use(
bodyParser.urlencoded({
extended: false
})
)
const mongoURI = `mongodb+srv://RMP1992:${process.env.PASSWORD}@cluster-frhfb.mongodb.net/test?retryWrites=true&w=majority`
mongoose
.connect(
mongoURI,
{
useNewUrlParser: true,
useUnifiedTopology: true
}
)
.then(() => console.log('MondoDB Connected'))
.catch(err => console.log(err))
let Users = require('./routes/users')
app.use('/users', Users)
app.listen(port, function(){
console.log('Server is running on port: ' + port)
})