提问者:小点点

Axios-未捕获(promise中)错误:请求失败,状态代码为500


我已经编写了添加新文章的代码,但是Axios post请求没有通过,我得到的错误是:加载资源失败:服务器响应状态为500(内部服务器错误)createError。js:17未捕获(promise中)错误:请求失败,状态代码为500,位于createError(createError.js:17),位于settle(settle.js:19)

我把它和一个类似的项目进行了比较,比较哪个看起来不错。

    const mongoose = require('mongoose');

const Schema = mongoose.Schema;

const Articles = new Schema({
    title: {
        type:String
    },
    content: {
        type: String
    },
    author: {
        type:String
    },
})

module.exports = mongoose.model('Articles', Articles);

数据库模型

const express = require('express');
const app = express();
const cors = require('cors');
const bodyParser = require('body-parser');
const mongoose = require('mongoose');
const PORT = 4000;
const routes = express.Router();
const Articles = require('./db');

mongoose.connect("mongodb://127.0.0.1:27017/dummies", { useNewUrlParser: true });
const connection = mongoose.connection

app.use(cors());
app.use(bodyParser.json());

connection.on("open", () => {
    console.log("Connected to the database");
});

routes.route('/').get((req, res) => {
    Articles.find((err, articles) => {
        if (!err) { res.json(articles);}       
    }
    )
})

routes.route('/add').post((req, res) => {
    let article = new Articles(req.body);
    article.save().then(() => {
        res.status(200).json({ "article": "article saved" })
    });
})

app.use('/dummies', routes);

app.listen(PORT, () => {
    console.log('Listening...')
})

指数js

import React, { Component } from 'react';
import Navbar from './Navbar';
import 'bootstrap/dist/css/bootstrap.css';
import axios from 'axios';

class AddArticle extends Component {
    constructor(props) {
        super(props);

        this.state = {
            title:"",
            content:"",
            author:""
        };

        this.onChangeTitle = this.onChangeTitle.bind(this);
        this.onChangeContent = this.onChangeContent.bind(this);
        this.onChangeAuthor = this.onChangeAuthor.bind(this);
        this.onSubmit = this.onSubmit.bind(this);
    }

    onChangeTitle = (event) => {
        this.setState({
            title:event.target.value
        })
    }

    onChangeContent = (event) => {
        this.setState({
            content:event.target.value
        })
    }

    onChangeAuthor = (event) => {
        this.setState({
            author:event.target.value
        })
    }

    onSubmit = (event) => {
        event.preventDefault();

        let article = {
            title: this.state.title,
            content: this.state.content,
            author: this.state.author
        }

        axios.post("http://localhost:4000/dummies/add", article).then(res => {
            console.log(res.data);
        });
    }

    render() {
        return (
            <React.Fragment>
                <Navbar />
                <div>
                    <form onSubmit={this.onSubmit}>
                        <input type="text" onChange={this.onChangeTitle} value={this.state.title}/>
                        <input type="textarea" onChange={this.onChangeContent} value={this.state.content} />
                        <input type="text" onChange={this.onChangeAuthor} value={this.state.author}/>
                        <input type="submit" value="Add Article"/>
                    </form>
                </div>
            </React.Fragment>
        );
    }
}

export default AddArticle;

rticle.js


共1个答案

匿名用户

请确保您在客户端和服务器端使用相同的请求方法(例如post-post或get-get),当方法在双方不相同时,我面临相同的错误,否则下面的错误会引起

Error: Request failed with status code 500 at createError