So senden Sie Formulardaten mit der Fetch-API: Multipart/form-data vs. Application/x-www-form-urlencoded?

Senden von Formulardaten mit der Fetch-API

Hintergrund

Bei der Verwendung der Fetch-API zum Senden von Formulardaten kommt es häufig zu Problemen Probleme im Zusammenhang mit dem Inhaltstyp und der Grenze, die beim Codieren der Daten verwendet werden. Dieser Artikel untersucht die Art dieser Probleme und bietet Lösungen für die Codierung von Multipart/Formulardaten im Vergleich zu Application/x-www-form-urlencoded.

FormData und Multipart/Form-Data

Wie in der FormData-Dokumentation von MDN erwähnt, codiert FormData Daten implizit im Multipart-/Formulardatenformat. Dieses Format eignet sich nicht zum Senden von Daten mit einem Inhaltstyp von application/x-www-form-urlencoded.

Lösung für application/x-www-form-urlencoded

Um Daten im application/x-www-form-urlencoded-Format zu kodieren, haben Sie zwei Möglichkeiten:

1. String-Kodierung: Kodieren Sie die Formulardaten manuell in eine URL-kodierte Datei string.
2. URLSearchParams: Initialisieren Sie ein URLSearchParams-Objekt und hängen Sie den Namen und Wert jedes Formularfelds daran an. Vermeiden Sie die explizite Angabe des Content-Type-Headers, da der Browser ihn aus dem URLSearchParams-Objekt ableitet.

Alternative für URLSearchParams

Wenn experimentelle Unterstützung verfügbar ist, Sie können das FormData-Objekt auch direkt an URLSearchParams übergeben, anstatt Werte manuell anzuhängen. Dieser Ansatz befindet sich noch in der Entwicklung und sollte vor der Implementierung gründlich getestet werden.

Fazit

Durch das Verständnis der Mechanismen von FormData und des Verhaltens der Fetch-API können Entwickler Formulare senden Daten korrekt im multipart/form-data- oder application/x-www-form-urlencoded-Format, um eine ordnungsgemäße Datenübertragung und -verarbeitung auf der Serverseite sicherzustellen.

Das obige ist der detaillierte Inhalt vonSo senden Sie Formulardaten mit der Fetch-API: Multipart/form-data vs. Application/x-www-form-urlencoded?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!