Übung

Ziel: Fehler in der Response vertieft verstehen

Schau dir zuerst den JS-Code an und versuche ihn zu verstehen. Als Hilfe hier ein paar wertvolle Links:

1. HTTP-Status der Antwort mit response.ok herausfinden: Erklärung bei MDN.
   Die Verbindung zum Server hat geklappt, wenn der Status im Range von 200 bis 299 ist.
2. Ist der Header der Antwort korrekt mit Content-Type (= anderes Wort für MIME-Type) application/json bestückt?
   web.dev: Introduction to fetch() - Response Metadata.
   Auch der Rest des Beitrags lohnt sich zu lesen.
3. Erklärungen zu includes() bei mdn web docs: Array.prototype.includes()
   Dies entspricht übrigens dem PHP-Schlüsselwort in_array()

Übungs-Anleitung: Ressourcen austauschen

Baue dir aus den verschiedenen Ressourcen eine kleine Testumgebung und schaue, was passiert.

1. Notiere einen falschen Pfad im ersten fetch()-Spaghetti - povoziere also eine 404-Status Meldung.
2. Tausche die Ressource aus mit dem Code von resource_500_status.php - povoziere also eine 500-Status Meldung.
3. Tausche die Ressource aus mit dem Code von resource_with_error - Die Ressource löst einen fatal error aus.
4. Versuche nun einen Fehler zu provozieren, damit das vierte, also das Error-Spaghetti, überhaupt zum Zug kommt. Wo musst du ansetzen?

Öffne die Entwickler-Tools und die Konsole, um den Effekt zu sehen!

Call fetch()

Das ist kein Submit-Button!
Das Formular wird nicht abschickt, fetch() übernimmt stattdessen asynchron die weitere Verarbeitung.