Per effettuare una richiesta HTTP in JavaScript, si può utilizzare l'oggetto XMLHttpRequest o la funzione fetch().
XMLHttpRequest (XHR): questo è il modo tradizionale per effettuare richieste HTTP in JavaScript. È supportato da tutti i browser moderni.
Per effettuare una richiesta utilizzando XHR, è possibile creare un oggetto XMLHttpRequest, impostare le proprietà responseType e onload, aprire una connessione utilizzando il metodo open() e quindi inviare la richiesta utilizzando il metodo send().
Fetch API: la funzione fetch() è un'alternativa moderna a XHR supportata da tutti i browser moderni. È più facile da usare rispetto a XHR.
Esempio di utilizzo di XMLHttpRequest per effettuare una richiesta GET a un'API JSON:
function getData() {
const xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
const data = JSON.parse(xhr.responseText);
// do something with the data
}
};
xhr.open("GET", "https://api.example.com/endpoint");
xhr.send();
}
Esempio di utilizzo di fetch() per effettuare una richiesta GET a un'API JSON:
fetch("https://api.example.com/endpoint")
.then(response => response.json())
.then(data => {
//script data
});
fetch() restituisce una Promise che si risolve in un oggetto Response, che ha un metodo json() che restituisce una Promise che si risolve nei dati analizzati da JSON.
Sia XMLHttpRequest che fetch() possono essere utilizzati per effettuare richieste POST e altri tipi di richieste HTTP. Puoi trovare maggiori informazioni: XMLHttpRequest e fetch().