Comment envoyer des données de formulaire avec l'API Fetch : Multipart/form-data vs Application/x-www-form-urlencoded ?

Envoi de données de formulaire avec l'API Fetch

Contexte

Lorsque vous utilisez l'API Fetch pour envoyer des données de formulaire, il est courant de rencontrer problèmes liés au type de contenu et à la limite utilisés lors du codage des données. Cet article explore la nature de ces problèmes et propose des solutions pour le codage de multipart/form-data par rapport à application/x-www-form-urlencoded.

FormData et multipart/form-data

Comme mentionné dans la documentation FormData de MDN, FormData encode implicitement les données au format multipart/form-data. Ce format n'est pas adapté à l'envoi de données avec un Content-Type d'application/x-www-form-urlencoded.

Solution pour application/x-www-form-urlencoded

Pour encoder des données au format application/x-www-form-urlencoded, vous avez deux options :

1. Encodage de chaîne : encodez manuellement les données du formulaire dans un format codé en URL. string.
2. URLSearchParams : initialisez un objet URLSearchParams et ajoutez-y le nom et la valeur de chaque champ de formulaire. Évitez de spécifier explicitement l'en-tête Content-Type, car le navigateur le déduira de l'objet URLSearchParams.

Alternative pour URLSearchParams

Si une prise en charge expérimentale est disponible, vous pouvez également transmettre l'objet FormData directement à URLSearchParams au lieu d'ajouter les valeurs manuellement. Cette approche est encore en cours de développement et doit être testée minutieusement avant sa mise en œuvre.

Conclusion

En comprenant les mécanismes de FormData et le comportement de l'API Fetch, les développeurs peuvent envoyer des formulaires les données correctement au format multipart/form-data ou application/x-www-form-urlencoded, garantissant un transfert et une gestion appropriés des données côté serveur.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!