# Multipart-Formular

Ursprünglich haben wir diesen Ansatz entwickelt, damit JavaScript im Browser nicht aktiviert sein muss. Inzwischen kann davon ausgegangen werden, dass JavaScript im Browser aktiviert ist. Daher empfehlen wir [Uppy](/de/docs/sdks/uppy.md) als bevorzugte Browser-Integration.

Um grundlegende Konzepte zu veranschaulichen, schnell einen Prototyp zu erstellen oder tatsächlich eine Ausweichlösung für Browser anzubieten, in denen JavaScript deaktiviert oder abgestürzt ist, können Sie Transloadit dennoch allein mit einem Multipart-`<form>` integrieren.

### Installation

Sie müssen nichts installieren 👌

### Verwendung

Setzen Sie das `action`-Attribut des Formulars auf `"https://api2.transloadit.com/assemblies"`. Die Dateien werden dann zusammen mit den Instructionsin einem ausgeblendeten `params`-Feld direkt zu unserer API hochgeladen.

Um Parsing-Probleme im Browser zu vermeiden, sollten die Instructions computergestützt als JSON codiert und anschließend HTML-Entitäten wie `<` und `"` als `&lt;` und `&quot;` maskiert werden. Das Ergebnis ist für Menschen etwas schwer lesbar – versuchen Sie es also vielleicht gar nicht erst 😄

Sie können in den Instructions eine`redirect_url` festlegen. Damit weisen Sie unsere API an, den Browser nach Abschluss aller Vorgänge auf eine Erfolgsseite Ihrer Wahl umzuleiten. Wir hängen Folgendes an diese URL an:`?assembly_id=xyz&assembly_ssl_url=https://api2.transloadit.com/assemblies/xyz`.

Wenn Ihr Backend die Erfolgsseite ausliefert, kann es diese Abfrageparameter auswerten. So können Sie weitere Schritte ausführen, etwa das Assembly Status JSONund die darin referenzierten Encoding-Ergebnisse herunterladen.

Die Erfolgsseite wird dem Browser angezeigt, sobald der Upload abgeschlossen ist. DieAssembly kann zu diesem Zeitpunkt jedoch noch ausgeführt werden, beispielsweise wenn ein großes Video codiert wird. Sie können entweder mit Ihrem Backend regelmäßig die `assembly_ssl_url` abfragen oder [Assembly Notifications](/de/docs/topics/webhooks.md)einrichten und in den Instructions eine`notify_url` angeben. In diesem Fall senden wir dasAssembly Status JSON per POST dorthin, damit Ihr Backend die Ergebnisse auf diese Weise verarbeiten kann.

### Beispiel

![](/_next/static/media/copy.04p1cju9qekk_.svg?dpl=dpl_3z41v8VuCJJKgtsQfSKB6o2uiSXL)

```html
<!--
We'll be inlining the following Assembly Instructions into a hidden params field,
escaping HTML entities such as &lt;, a task best left to machines :)

{
  "redirect_url": "https://example.com/success",
  "auth": {
    "key": "YOUR_TRANSLOADIT_KEY"
  },
  "template_id": "YOUR_TEMPLATE_ID",
  "steps": {}
}
-->

<form
  method="POST"
  enctype="multipart/form-data"
  action="https://api2.transloadit.com/assemblies"
>
  <input
    type="hidden"
    name="params"
    value="%7B%0A%20%20%22redirect_url%22%3A%20%22https%3A%2F%2Fexample.com%2Fsuccess%22%2C%0A%20%20%22auth%22%3A%20%7B%0A%20%20%20%20%22key%22%3A%20%22YOUR_TRANSLOADIT_KEY%22%0A%20%20%7D%2C%0A%20%20%22template_id%22%3A%20%22YOUR_TEMPLATE_ID%22%2C%0A%20%20%22steps%22%3A%20%7B%7D%0A%7D"
  />
  <input type="file" name="myfile_1" multiple="multiple" />
  <input type="submit" value="Upload" />
</form>

```