AJAX-förfrågan

Introduktion till AJAX

AJAX (Asynchronous JavaScript and XML) är en teknik som gör det möjligt för webbapplikationer att skicka förfrågningar till servern i bakgrunden utan att behöva ladda om hela sidan.

XMLHttpRequest

XMLHttpRequest är det objekt som används för att skapa AJAX-förfrågningar. Det ger ett enkelt sätt att skicka och ta emot data från servern utan att behöva uppdatera hela sidan.

Serverförfrågan

För att skicka en AJAX-förfrågan måste du:

1. Skapa ett XMLHttpRequest-objekt.
2. Öppna en anslutning till servern med metoden open().
3. Skicka förfrågan med metoden send().

Svarsbehandling

När servern svarar på förfrågan får du ett svarobjekt som innehåller svaret från servern. Du kan sedan använda svaret för att uppdatera gränssnittet eller utföra andra åtgärder.

Datahämtning

En av de vanligaste användningarna av AJAX är att hämta data från servern. Detta kan användas för att dynamiskt uppdatera sidor, ladda mer data när användaren bläddrar eller visa användarinmatning i realtid.

Ett enkelt exempel i JavaScript

// Skapa ett XMLHttpRequest-objekt
var xhr = new XMLHttpRequest();

// Öppna en anslutning till servern
xhr.open('GET', 'data.json', true);

// Skicka förfrågan
xhr.send();

// Hantera svaret
xhr.onreadystatechange = function() {
  if (xhr.readyState === 4 && xhr.status === 200) {
    // Ta emot och använd svaret
    var data = JSON.parse(xhr.responseText);
    console.log(data);
  }
};

I detta exempel hämtar vi JSON-data från en server med filnamnet "data.json". När data har hämtats parser vi dem till ett JavaScript-objekt och skriver ut dem till konsolen.