如何使axios发布到数据库?

2022-01-30 14:08:33 标签 javascriptmysqlnode.jsreactjsaxios

我试图使一个登录系统,这是我的项目与react express MySQL和Axios的一部分,但我一直得到这个错误-未捕获(在承诺中)错误:请求中止

服务器端:

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处理函数。

###我怀疑你的本地主机有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))

您还可以捕获错误。(所以它不会“未被捕获”)

# # #

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))

当你使用post请求时,尝试设置一个名为Content-Type/application/json的报头。Application /json用于通过请求传输json数据。

阅读全文

▼ 版权说明

相关文章也很精彩
推荐内容
更多标签
相关热门
全站排行
随便看看

错说 cuoshuo.com —— 程序员的报错记录

部分内容根据CC版权协议转载;网站内容仅供参考,生产环境使用务必查阅官方文档

辽ICP备19011660号-5

×

扫码关注公众号:职场神器
发送: 1
获取永久解锁本站全部文章的验证码