9.2 AJAX intro
Vi ska här se på några olika sätt för asynkron programmering i JavaScript, där vi kommer läsa in en extern datafil. Denna teknik kallas ibland för AJAX, Asynchronous JavaScript and XML, även om datafilen kan vara på annan form än XML.
26 min.
Sammanfattning
Synkron programmering
Man skickar iväg begäran om resursen, sedan stannar man upp och väntar på svaret. Då svaret kommer kan man gå vidare och behandla detta. I denna situation har vi synkron programmering. I kommunikation kallar man det synkron kommunikation, där sändare och mottagare synkroniseras mot varandra.
Jämför man med mänsklig kommunikation har man denna situation i en chat eller ett vanligt samtal, där personerna står tillsammans och samtalar (även om de då ibland pratar i munnen på varandra 😊).
Asynkron programmering
Man skickar iväg begäran om resursen och sedan går programmet vidare och kan göra något annat. Då svaret sedan kommer, aktiveras en del av koden, som tar hand om svaret. I detta falla har vi asynkron programmering och en asynkron kommunikation.
Jämför man med mänsklig kommunikation har man t.ex. detta då man skickar mail eller vanligt brev mellan två personer.
AJAX
Asynchronous JavaScript and XML eller förkortat AJAX var en benämning som myntades av Jesse James Garrett år 2005, då han beskrev hur objektet XMLHttpRequest kunde användas i en asynkron programmering, för att läsa in en extern datafil. Objektet är anpassat för XML, men den externa filen kan även innehålla annan data, såsom t.ex. JSON eller ren text.
JavaScript har sedan utvecklats och 2015 kom kommandot fetch, som numera används, då man ska läsa in en extern fil. Då används två objekt, Promise och Response.
Dataformat
Med XMLHttpRequest kan man direkt hantera XML eller ren text som format i den fil som läses in. Med fetch kan man hantera JSON, Blob eller text. Men eftersom både XML och JSON sparas som text i filerna, kan man efter inläsning lätt konvertera från text till önskat format. Därmed kan både XML- och JSON-kodad data läsas in med båda metoderna.
Egna övningar
Övning på detta kommer i nästa exempel.