La base de données MySQL ne reçoit pas le téléchargement de fichiers dans les données du formulaire
P粉032977207
P粉032977207 2023-09-12 22:16:34
0
1
639

J'essaie de télécharger des informations depuis le frontend React à l'aide de formData, j'ai vérifié le backend à l'aide de postman et tout va bien, mais formData ne transmet pas le fichier au backend. C'est mon code

Composants front-end React

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

function NotificationSecond() {
    let server = "http://localhost:3456";
    let address = `${server}/user/notification`

  const [Data, setData] = useState({
    assigned_to:"",
    message:""
  })
  const [response, setresponce] = useState();
  
    let submitter = (e)=>{
        e.preventDefault();
        let forForm = new FormData();
        forForm.append('assigned_to',Data.assigned_to)
        forForm.append('message',Data.message)


        axios({
            method:"post",
            url:address,
            data:forForm,
            headers: {"Content-Type": "multipart/form-data" },
        }).then((data)=>{
            setresponce(data.data)
        }).catch((err)=>{
            console.log(err)
        })
    }

    let inputHandler = (e)=>{
        switch (e.target.value) {
            case "assigned_to":setData((pre)=>{return {...pre,assigned_to:e.target.value}})
                
                break;
            case "message":setData((pre)=>{return {...pre,message:e.target.value}})
                
                break;
        
            default:
                break;
        }
    }

    if(response){
        return 

this is response

}else{ return (
) } } export default NotificationSecond

Contrôleur backend

import Econnection  from "../server.js";
let notification =(req,res)=>{
    const {assigned_to,message}=req.body
    let value = [assigned_to,message];
    let notificationAdder = `INSERT INTO notification(assigned_to,message) VALUES (?)`;

    Econnection.query(notificationAdder,[value],(err)=>{
         if(err){
            console.log(err)
            res.send('上传通知不成功')
         }else{
            res.send({
                forThanking : `上传成功,谢谢!`,
                forHomePageReturn: `点击这里返回首页`
            })
         }
    })
}

export default notification;

后端路由 
import express from 'express';


import notification from '../Controaller/noticationControler.js';

let notificationRoute = express.Router();

notificationRoute.post('/notification',notification)

在此处输入代码Exporter l'itinéraire de notification par défaut

J'ai téléchargé le backend juste au cas où, mais d'après mes tests, tout dans le backend fonctionne bien, tous les commutateurs et états fonctionnent bien, mais je ne pense pas qu'axios publie les données dans la base de données mysql via la route créée, le la base de données ne contient que deux colonnes, "assigned_to" et "message".

P粉032977207
P粉032977207

répondre à tous(1)
P粉860897943

Le problème est que la méthode des données du formulaire n'est pas attachée à la valeur d'entrée ; j'ai créé un objet avec un nom différent et j'ai transmis le nom de l'objet à la méthode axios et cela fonctionne bien. Également supprimé la section d'en-tête d'axios.

let file = {
  assigned_to: Data.assigned_to,
  message : Data.message
}

axios({
  method:"post",
  url:address,
  data:file,
})
  .then((data) => {
    setresponce(data.data)
  })
  .catch((err) => {
    console.log(err)
  })
}
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal