Discussion :

[Pitord71]

Bonjour,

je suis débutant en JS et React. Je suis sur un projet pour le moment géré en local sur mon PC.

Je cherche à envoyer une image depuis un formulaire du frontend pour quelle soit enregistrée dans le backend dans le dossier backend/controllers/images et que le lien soit stocké dans ma base de donnée SQL.

Quelqu'un pour me mettre sur la bonne voie ? Merci d'avance

[Pheldwyn]

Bonjour !

Côté front avec React, il va falloir que tu créer un formulaire (un object FormData), que tu vas envoyer à un script de ton back.
Et c'est ton back qui, en recevant le fichier, va faire le travail de le copier dans le bon répertoire et de le stocker en base.

En quoi est codé ton back ?

[Pitord71]

Bonjour,

Merci pour ta réponse.

J'utilise JS pour le backend

J'ai créé un formData que j'envoi avec Fetch au back mais ca ne fonctionne toujours pas.

J'ai un doute si c'est bien ce que je dois récupérer du formulaire pour l'image : C:\fakepath\photo test.jpg.

Je joins mon code pour le formulaire et pour la requête fetch.

J'espère que quelqu'un pourra m'aider à trouver mon erreur.

[Pheldwyn]

Et côté back, tu utilises multer ?
Tu as regardé avec les outils de dev du navigateur ce que contenait la requête envoyée, si il y avait l'image ou non ?

[Pheldwyn]

Ah si, il manque un truc à ton front, à rajouter aux options de ton fetch :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
headers: {
    "Content-Type": "multipart/form-data"
}

[Pitord71]

Oui dans le back, j'utilise Multer

Dans outil Network pour la requête, j'ai les infos ci dessous.

[Pheldwyn]

Et en ajoutant le content-type dans les options du fetch ?
(S'il n'est pas là, clairement tu n'auras pas le fichier)