Bij het werken met API's zijn de meest gebruikte HTTP-methoden GET en POST:

• GET: Gebruikt om gegevens van een server op te halen;
• POST: Gebruikt om gegevens naar een server te verzenden, meestal bij het indienen van formulieren of het versturen van JSON-gegevens.

Voorbeeld van een GET-verzoek

Een GET-verzoek haalt gegevens op van een server zonder bronnen te wijzigen.

De functie fetchPost maakt gebruik van de methode fetch() om een verzoek te sturen naar een opgegeven endpoint (/posts/1). Zodra de respons is ontvangen, worden de gegevens geparseerd als JSON en wordt de titel van het bericht geëxtraheerd en weergegeven in de HTML-paragraaf.

Voorbeeld van een POST-verzoek

Een POST-verzoek stuurt gegevens naar de server en wordt vaak gebruikt voor het aanmaken van nieuwe resources of het indienen van formuliergegevens.

De functie sendPostRequest voert een verzoek uit naar het opgegeven eindpunt (/posts) met de method ingesteld op 'POST'. De headers bevatten 'Content-Type': 'application/json' om aan te geven dat er JSON-gegevens worden verzonden. De body bevat JSON-geformatteerde gegevens met details voor een nieuw bericht, zoals title, body en userId. Na het verzoek wordt de serverrespons geparseerd als JSON en wordt de titel van het aangemaakte bericht weergegeven in de HTML.

Headers verzenden en verschillende HTTP-methoden afhandelen (GET, POST, PUT, DELETE)

Verschillende HTTP-methoden hebben verschillende doeleinden. Naast GET en POST zijn veelgebruikte methoden:

• PUT: Gebruikt om een bestaande resource bij te werken;
• DELETE: Gebruikt om een resource van de server te verwijderen.

Je kunt ook headers meesturen met elke HTTP-methode om extra informatie te verstrekken, zoals authenticatietokens of het contenttype.

Voorbeeld van een PUT-verzoek: Gegevens bijwerken

De functie updatePost verstuurt een PUT-verzoek naar het opgegeven eindpunt (/posts/1) om een bestaand bericht bij te werken. Het verzoek bevat method: 'PUT' om de updateactie aan te geven, en de headers zijn ingesteld met 'Content-Type': 'application/json', wat het JSON-formaat aanduidt. De body bevat gegevens in JSON-indeling, waaronder een id, bijgewerkte title, body en userId. Zodra de respons is ontvangen, wordt deze als JSON geparseerd en wordt de bijgewerkte titel weergegeven in de HTML.

DELETE-verzoekvoorbeeld: Gegevens verwijderen

De functie deletePost verstuurt een DELETE-verzoek naar een opgegeven endpoint (/posts/1) om een specifiek bericht te verwijderen. De method: 'DELETE' specificeert de actie. Na het verzoek wordt de status van de respons gecontroleerd met response.ok: bij succes wordt een succesbericht ("Post succesvol verwijderd.") weergegeven in de HTML. Als het verwijderen mislukt, verschijnt er in plaats daarvan een foutmelding.

Queryparameters gebruiken in API-verzoeken

Queryparameters maken het mogelijk om extra informatie in de URL mee te sturen, zoals het filteren van gegevens, het sorteren van resultaten of het specificeren van paginanummers in paginagebaseerde antwoorden.

GET-verzoek met queryparameters

De functie fetchPostsByUser verstuurt een verzoek naar een API-endpoint met een queryparameter (userId=1), waarmee berichten worden gefilterd op alleen die van de opgegeven gebruiker. De userId wordt direct aan de URL toegevoegd als queryparameter. Na ontvangst van de gefilterde gegevens toont de functie het aantal gevonden berichten voor die gebruiker in de HTML.