如何将 axios 发布到数据库？答案

【问题标题】：How to make an axios post to database?如何将 axios 发布到数据库？
【发布时间】：2021-11-13 11:38:39
【问题描述】：

我正在尝试使用 react、express、MySQL 和 Axios 创建一个登录系统，它是我项目的一部分，但我不断收到此错误 - Uncaught (in promise) Error: Request aborted

服务器端：

const express = require("express");
const cors = require("cors");
const mysql = require("mysql");

const app = express();
app.use(express.json())
app.use(cors());

const db = mysql.createConnection({
    host: "localhost",
    user: "root",
    password: "cool12345",
    database: "users"
})

db.connect(err => {
    if(err){
        return err;
    }
})

console.log(db)


app.post("/register", (req, res) => {
    const username = req.body.username;
    const password = req.body.password;
    const email = req.body.email;

    db.query("INSERT INTO teachers (name, email, password) VALUES (?,?)", [username, email, password], (error, result) => {
        console.log(error)
    })
 
    db.query("INSERT INTO teachers (name, email, password) VALUES ('test', 'test2', 'test3')")
})
 

app.listen(4000, () => {
    console.log("Listening on port 4000")
})

客户端：

import React, { useState } from 'react'
import "../styling/SignUp.css";
import { useHistory } from "react-router-dom"
import Axios from "axios";



function SignUp() {
    const [usernameReg, setUsernameReg] = useState("")
    const [emailReg, setEmailReg] = useState("")
    const [passwordReg, setPasswordReg] = useState("")

    const register = () => {
        Axios.post("https://localhost:4000/register", {username: usernameReg, email:emailReg, password: passwordReg}).then((response) => {
            console.log(response)
        })
    }

客户端的函数返回一个表单，但代码太多，所以我把它排除在这个问题之外。注册按钮有一个运行注册的 onClick 处理函数。

【问题讨论】：

对我的建议不满意？？
抱歉回复晚了，但很遗憾也没有用
更新答案:)
也发布完整的错误
你确定你在使用https和localhost吗？

标签： javascript mysql node.js reactjs axios

【解决方案1】：

我怀疑你的本地主机有 ssl 证书

尝试：

Axios.post("http://localhost:4000/register", {username: usernameReg, email:emailReg, password: passwordReg}).then((response) => {
            console.log(response)
})

http 代替 https

编辑：我太仓促了，不敢下结论。你传递给 axios 的那个对象是什么？我认为应该是：

Axios.post("http://localhost:4000/register", {
    data: {
        username: usernameReg, 
        email:emailReg, 
        password: passwordReg
    }
}).then((response) => {
        console.log(response)
}).catch(err => console.log(err))

您也可以捕获错误。（所以它不会是'未捕获'）

【讨论】：

【解决方案2】：

Axios.post("http://localhost:4000/register", headers: {
    'Content-Type': 'application/json',
   }, {
 data: {
    username: usernameReg, 
    email:emailReg, 
    password: passwordReg
 }
}).then((response) => {
    console.log(response)
}).catch(err => console.log(err))

当您使用发布请求时，尝试设置一个名为 Content-Type/application/json 的标头。 application/json 用于通过请求传递json数据。

【讨论】：