Cosa accetta il metodo fetch?

Il metodo fetch accetta un argomento obbligatorio — il percorso della richiesta (RequestInfo o URL) — e un argomento opzionale — un oggetto di configurazione (RequestInit).

Argomento obbligatorio (input) :

• Stringa: URL della risorsa.
• Oggetto Request: Istanza della classe Request, che fornisce una configurazione più flessibile della richiesta (intestazioni, metodo, ecc.).

Argomento opzionale (init) : Un oggetto con campi che descrivono la configurazione della richiesta. Alcuni campi comunemente usati:

• method: Metodo HTTP della richiesta (GET, POST, PUT, DELETE, OPTIONS, ecc.).
• headers: Intestazioni della richiesta. Può essere un oggetto chiave-valore o un'istanza della classe Headers.
• body: Corpo della richiesta (per metodi diversi da GET o HEAD). Può essere una stringa, ArrayBuffer, TypedArray, DataView, Blob, FormData, URLSearchParams o ReadableStream.
• mode: Modalità della richiesta (cors, no-cors, same-origin, navigate).
• credentials: Configurazione per l'invio delle credenziali (omit, same-origin, include).
• cache: Configurazione della cache (default, no-store, reload, no-cache, force-cache, only-if-cached).
• redirect: Come gestire i reindirizzamenti (follow, error, manual).
• referrer: Valore per l'intestazione Referer.
• referrerPolicy: Politica di invio dell'intestazione Referer.
• integrity: Valore per l'intestazione Integrity. Usato per l'integrità delle risorse sub-ressource.
• keepalive: Valore booleano che indica che la richiesta deve rimanere attiva dopo la chiusura della pagina (per inviare analisi o rapporti).
• signal: Istanza di AbortSignal per annullare la richiesta.
• window: Oggetto Window associato alla richiesta (di default, la finestra corrente).

Esempio di utilizzo:

// Richiesta GET
fetch('/api/users')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Errore:', error));

// Richiesta POST con corpo e intestazioni
fetch('/api/products', {
  method: 'POST', // Metodo HTTP
  headers: {
    'Content-Type': 'application/json', // Tipo di dati inviati
    'Authorization': 'Bearer your_token' // Esempio di intestazione di autorizzazione
  },
  body: JSON.stringify({ name: 'Nuovo prodotto', price: 100 }) // Corpo della richiesta
})
  .then(response => {
    if (!response.ok) {
      throw new Error(`Errore HTTP! stato: ${response.status}`);
    }
    return response.json();
  })
  .then(data => console.log('Successo:', data))
  .catch(error => console.error('Errore:', error));