Das Folgende ist ein Gastbeitrag von Przemek Matylla, der ein Tool entwickelt hat, das meiner Meinung nach für einige von Ihnen sehr nützlich sein wird. Es gibt viele Mysterien in der Webentwicklung. Welchen Wert hat diese Variable in diesem Moment der Ausführung? Warum wird diese Eigenschaft überschrieben? Was verursacht diese Scrollleiste? Es gibt auch Mysterien bei HTTP-Anfragen. Welche Daten wurden mitgeführt? Welche Metadaten? Ist alles da (und nicht da), wie ich es erwarte? Hoffentlich hilft Przemeks Tool.
Update September 2018: Dieser Dienst scheint tot zu sein. Leser Ankit Jain schlug Alternativen wie Beeceptor, Mockbin oder (selbst gehostet) RequestBin vor.
Update November 2018: Przemek schrieb, dass der Dienst aufgrund extremer Missbräuche offline war, aber nun überarbeitet und neu gestartet wurde und widerstandsfähiger gegen Angriffe ist.
Wenn Sie mit Webhooks arbeiten, Formulardaten akzeptieren oder senden oder einfach nur Standard-HTTP-Anfragen stellen, können Sie sich fragen, was *genau* in der Payload enthalten war. Was waren die HTTP-Header? Was genau ist mit Ihren Multipart-Uploads passiert?
Glücklicherweise gibt es ein raffiniertes Tool namens Hookbin (Haftungsausschluss: Ich habe es erstellt), das den Aufwand beim Debuggen von HTTP-Anfragen erheblich reduziert. Werfen wir einen kurzen Blick auf das Tool und was wir damit erreichen können.

Was ist Hookbin?
Hookbin ist ein kostenloser Dienst, der es Ihnen ermöglicht, HTTP-Anfragen jeder Art abzufangen, zu parsen und zu debuggen. Durch die Bereitstellung einer flüchtigen, eindeutigen URL (genannt "Endpoint") können Sie Anfragen an diesen Endpoint senden und prüfen, was genau übertragen wurde. Es gibt zahlreiche mögliche Anwendungsfälle. Um nur einige zu nennen:
- Debugging von Webhooks von externen Anbietern, z. B. von Zahlungssystemen wie Stripe oder Recurly vor der Produktivsetzung
- Debugging von Formularen in Ihren Anwendungen zur besseren Einrichtung von Controllern
- Parsen von Multipart-Anfragen (Datei-Uploads)
Wie benutzt man Hookbin?
Das Erste, was Sie auf der Hookbin-Startseite sehen werden, ist ein großer Button mit der Aufschrift "Create New Endpoint". Direkt darunter gibt es eine Option namens "Make it Private", um einen Endpoint zu erstellen, dessen Ergebnisse nur in dem Browser sichtbar sind, mit dem Sie ihn erstellt haben (lesen Sie unten mehr über private Endpoints). Erstellen wir vorerst einen Standard-Endpoint. Klicken Sie auf den Button und Ihr Browser wird zu Ihrer eindeutigen Ergebnisliste für den Endpoint weitergeleitet.

Oben auf der Seite sehen Sie die tatsächliche Endpoint-URL, die Sie in Ihren Anwendungen verwenden können, z. B. https://hookb.in/voOD1NJ8. Beachten Sie, dass der Domainname für Endpoints anders ist – *hookb.in* anstelle von hookbin.com. Hookbin.com ist der Ort, an dem Sie Ihre Anfragen einsehen, während hookb.in nur für Endpoints verwendet wird.
Hookbin hält jeden eindeutigen Endpoint für 7 Tage nach seiner Erstellung am Leben und ermöglicht Ihnen die Speicherung von bis zu 100 Anfragen pro Endpoint. Sobald ein Endpoint dieses Limit erreicht, werden die ältesten Ergebnisse gelöscht, um Platz für neue zu schaffen.
Sobald wir unsere eindeutige Endpoint-URL erhalten haben, können wir mit ihr spielen. Am unteren Ende der Seite finden Sie mehrere Beispiele für POST-Anfragen mit einer JSON-Payload an diesen Endpoint in verschiedenen Programmiersprachen.
Beginnen wir mit etwas ganz Einfachem: GET-Anfragen. Kopieren Sie Ihre eindeutige Endpoint-URL und rufen Sie sie in einem neuen Browser-Tab auf. Bei einer erfolgreichen Anfrage gibt Hookbin immer den Statuscode 200 OK mit einem JSON {"success": true} zurück.
Cool. Schließen Sie jetzt den Tab und gehen Sie zurück zu Hookbin.com, wo Sie Ihre Ergebnisse einsehen können (aktualisieren Sie die Seite).

Sie sehen die Ergebnisse dieser HTTP-GET-Anfrage gespeichert. Sehen wir uns an, was in der Anfrage steckt. Jedes Ergebnis ist in folgende leicht einklappbare Abschnitte unterteilt:
- HTTP-Header (Anfrage und Antwort)
- Query String
- Body
- Datei-Uploads
- Cookies
HTTP-Header
Der erste Abschnitt zeigt Ihnen die im Request übertragenen HTTP-Header. Das Besondere an Hookbin ist, dass es sowohl die Request- *als auch* die Response-Header anzeigt. Es ist auch wichtig zu beachten, dass Hookbin alle Header herausfiltert, die von Proxy-Servern zwischen dem Ursprung einer Anfrage und den Hookbin-Servern hinzugefügt worden sein könnten. Das bedeutet, Sie sehen nur die Header, die Sie explizit in der Anfrage gesetzt haben, und die, die mit einer Antwort zurückgesendet wurden. Kein Rauschen mehr oder unbekannte Header, die Sie nicht explizit gesetzt haben.
Query String
Es ist sehr üblich, Daten als Teil einer URL zu übertragen. Alle Query Strings, die an die Endpoint-URL angehängt werden, werden hier als Schlüssel-Wert-Paare dargestellt. Um zu sehen, wie das aussieht, hängen Sie einfach einen Query String an Ihre eindeutige Endpoint-URL an, z. B. ?name=john, öffnen Sie diese URL in einem anderen Tab und gehen Sie zurück zu Hookbin.com.

Body
Dieser Abschnitt zeigt Ihnen den POST-Body einer Anfrage, schön hervorgehoben. Wir haben jetzt 2016 und die meisten Dienste senden ihre Daten im JSON-Format. Lassen Sie uns nun eine solche Anfrage mit cURL ausführen und sehen, wie sie aussieht.
curl -X POST -H "Content-Type: application/json" -d '{"name": "John", "age": 32, "buddies": ["Paul", "Bob", "Adam"]}' https://hookb.in/voOD1NJ8

Hookbin ist request-type-agnostic, was bedeutet, dass er alle Arten von Anfragen parst und speichert: JSON, XML, YAML, multipart oder URL-Encoded.
Datei-Uploads
Wer lädt heutzutage keine Dateien über HTTP hoch? Lassen Sie uns nun herausfinden, wie wir Multipart-Anfragen (Datei-Uploads) mit Hookbin abfangen können. Vorausgesetzt, Sie haben image.jpg in Ihrem aktuellen Arbeitsverzeichnis, können Sie eine Datei mit cURL wie folgt hochladen:
curl -X POST --form [email protected] https://hookb.in/voOD1NJ8

Hookbin speichert alle Uploads in flüchtigen AWS S3-Buckets mit einem TTL (Time To Live, oder Ablaufzeit) von 7 Tagen ab dem Zeitpunkt des Uploads. Danach werden sie automatisch und unwiderruflich gelöscht. Wenn Sie nicht die vollen 7 Tage warten möchten, können Sie einzelne Dateien per Mausklick nach Bedarf löschen.
Bitte beachten Sie, dass Hookbin HTTP-Anfragen bis zu einer Größe von 1 MB (sowohl Body als auch Header) parst und speichert. Wenn Sie eine Anfrage senden, die größer als 1 MB ist, antwortet Hookbin mit 413 Request Entity Too Large und lehnt sie ab.
Cookies
Alle im Request übertragenen HTTP-Cookies werden hier als Schlüssel-Wert-Paare dargestellt. Möchten Sie es ausprobieren? Hier ist ein cURL-One-Liner:
curl -X GET --cookie "motto=never_gonna_give_you_up" https://hookb.in/voOD1NJ8

Private Endpoints
Erinnern Sie sich an das Kontrollkästchen auf der Hookbin-Homepage beim Erstellen eines neuen Endpoints? Wenn es aktiviert ist, wird der von Ihnen erstellte Endpoint "privat" und ist nur in dem Browser sichtbar, mit dem Sie ihn erstellt haben. Niemand sonst hat Zugriff auf die gespeicherten Ergebnisse.
Notizen hinzufügen
Was nützen gespeicherte HTTP-Anfragen, wenn wir ihnen keine schnellen Notizen hinzufügen können, um Änderungen in unseren Anwendungen im Auge zu behalten? Hookbin ermöglicht Ihnen dies. In der oberen rechten Ecke jeder Anfrage finden Sie einen Button namens "Add Note". Dieser ermöglicht es Ihnen, bis zu 1.000 Zeichen Text zu speichern. Sie können Ihre Notizen löschen und bearbeiten.

Ergebnisse löschen
Wenn Sie nicht alle gespeicherten Ergebnisse benötigen, können Sie einzelne davon mit dem roten Button "Delete Result" in der oberen rechten Ecke jedes Ergebnisses entfernen.
Versteckte Funktionen
- Hookbin bietet eine offene CORS-Implementierung, sodass Sie HTTP-Anfragen aus Ihren JS-Anwendungen testen können.
- Hookbin unterstützt die Methodenüberschreibung.
- Nur sichere Verbindungen – Hookbin bietet ausschließlich SSL-gesicherte Endpoints und erhält von SSL Labs die Bestnote A+.
- Hookbin läuft in einer hochverfügbaren Konfiguration.
Technologie
Hookbin ist ein Paar von Node-Anwendungen. Der "Interceptor" hinter hookb.in und die Web-Oberfläche, die unter hookbin.com verfügbar ist. Vor den Node-Anwendungen laufen Nginx-Server, die für die SSL-Terminierung und die vorläufige Validierung von Anfragen verwendet werden, die dann an die Node-Backends weitergeleitet werden. Die Web-Oberflächen-App wurde mit Angular geschrieben und alle Assets werden von einem CDN geliefert.
Warum haben wir Hookbin gebaut?
Wir bei Kraken.io befassen uns täglich mit Webhooks und liefern Hunderttausende (manchmal Millionen) davon weltweit aus, um Anwendungen über abgeschlossene Bildgrößenänderungen und Optimierungsprozesse zu informieren. Wir haben den Dienst zunächst intern für unsere eigenen Zwecke entwickelt. Als wir erkannten, dass das Produkt ausgereift und plattformunabhängig war, beschlossen wir, die Liebe zu teilen und es öffentlich zugänglich zu machen. Wir hoffen, dass Sie es nützlich finden!
Es sieht interessant aus, aber ich bin mir nicht sicher, wann ich es jemals benutzen würde. Für normale Webentwicklung benutze ich die Netzwerk-Registerkarte von Chrome und für Curl das verbose-Argument. Was ist der normale Anwendungsfall dafür?
Das scheint ziemlich cool zu sein. Ich mag die Möglichkeit, Zahlungssysteme zu debuggen. Ich habe versucht, ein paar benutzerdefinierte Warenkorblösungen zu entwickeln, aber das Testen und Debuggen hat mich immer abgeschreckt. Ich werde mir das noch genauer ansehen. Toller Artikel, danke!