最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

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

网站源码admin43浏览0评论

React nodejs AxiosError {消息:“请求失败,状态代码为 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');
});
回答如下:
发布评论

评论列表(0)

  1. 暂无评论