Verschiedene Implementierungsmethoden des Datei-Uploads in der Webentwicklung (mit Code)

Das Hochladen von Dateien ist eine häufige Anforderung in der Webentwicklung. Um Dateien hochzuladen, müssen Sie das Dateieingabefeld verwenden, wenn Sie der Datei ein Mehrfach-Attribut hinzufügen Eingabefeld, Sie können mehrere Dateien gleichzeitig auswählen (nicht unterstützte Browser ignorieren dieses Attribut automatisch)

<input multiple type="file">

Klicken Sie auf dieses Eingabefeld, um das Dialogfeld „Datei durchsuchen“ zu öffnen und Dateien auszuwählen Es reicht aus, eine Datei hochzuladen. Sie können auch mehrere Eingabefelder gleichzeitig hochladen, um die Kompatibilität mit Browsern zu gewährleisten. Benutzer wählen im Allgemeinen nicht mehrere Dateien aus

(empfohlenes Lernen:

HTML-Video-Tutorial )

Grundlegende Upload-Methode

Beim Absenden des Formulars können Sie die ausgewählten Dateien zusammen senden und auf den Server hochladen Das übermittelte Formular enthält Dateien. Sie müssen den

enctype

des Formularelements ändern. Das Attribut ist multipart/form-data

<form action="#" enctype="multipart/form-data" method="post">
  <input name="file" type="file">
  <button type="submit">Upload</button>
</form>

Herkömmlicher synchroner Upload. Wenn die hochgeladene Datei groß ist, müssen Sie oft lange warten und die Seite wird nach Abschluss des Uploads neu geladen. Und Sie müssen warten, bis der Upload abgeschlossen ist, bevor Sie den Vorgang fortsetzen können >

Frühe Browser unterstützen das asynchrone Hochladen nicht, aber Sie können es mit

iframe

simulieren, ein