React nodejs AxiosError {消息:“请求失败,状态代码为 404”,

编程入门 行业动态 更新时间:2024-10-04 11:18:37

React nodejs AxiosError {消息:“请求失败,<a href=https://www.elefans.com/category/jswz/34/1771386.html style=状态代码为 404”,"/>

React nodejs AxiosError {消息:“请求失败,状态代码为 404”,

我卡在这个错误中,我的表单没有发送到 MySQL 数据库 它说这个错误我想如果我解决这个问题它应该可以工作但我不知道如何解决这个首先我尝试使用chatgpt但它在同一点出错我尝试将按钮更改为输入但它没有也工作。你能帮我解决这个问题吗

我的表单.jsx

import React, { useState } from 'react';
import axios from 'axios';

function ContactForm() {
  const [fname, setName] = useState('');
  const [email, setEmail] = useState('');
  const [text, setMessage] = useState('');

  const handleSubmit = (event) => {
    event.preventDefault();

    axios.post('http://localhost:3001/submit-form', { fname, email, text })
      .then(() => {
        alert('Form submitted successfully');
        setName('');
        setEmail('');
        setMessage('');
      })
      .catch((error) => {
        console.error(error);
        alert('An error occurred while submitting the form');
      });
  };

  return (
    <form onSubmit={handleSubmit}>
      <label>
        Name:
        <input type="text" value={fname} onChange={(event) => setName(event.target.value)} />
      </label>
      <label>
        Email:
        <input type="email" value={email} onChange={(event) => setEmail(event.target.value)} />
      </label>
      <label>
        Message:
        <textarea value={text} onChange={(event) => setMessage(event.target.value)} />
      </label>
      <button type="submit">Submit</button>
    </form>
  );
}

export default ContactForm;

server.js

const express = require('express');
const mysql = require('mysql2');
const bodyParser = require('body-parser');
const app = express();
const  cors = require('cors');
app.use(cors());


app.use(bodyParser.json());

const connection = mysql.createConnection({
  host: 'localhost',
  user: 'root',
  password: '123',
  database: 'formgym'
});

app.post('/submit-form', (req, res) => {
  const { fname, email, text } = req.body;

  const query = 'INSERT INTO form_data (fname, email, text) VALUES (?, ?, ?)';
  const values = [fname, email, text];

  connection.query(query, values, (error, results) => {
    if (error) {
      console.error(error);
      res.sendStatus(500);
    } else {
      res.sendStatus(200);
    }
  });
});

app.listen(3001, () => {
  console.log('Server listening on port 3001');
});
回答如下:

更多推荐

React nodejs AxiosError {消息:“请求失败,状态代码为 404”,

本文发布于:2024-05-30 17:43:02,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1770756.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:状态   消息   代码   nodejs   React

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!