Che cos’è Access-Control-Allow-Origin?
Access-Control-Allow-Origin è un header HTTP utilizzato dai browser per gestire le richieste Cross-Origin Resource Sharing (CORS). Questo meccanismo permette a una pagina web ospitata su un dominio di accedere in modo controllato a risorse presenti su un altro dominio.
Quando un browser tenta di recuperare dati da una sorgente diversa rispetto a quella da cui è stata caricata la pagina, viene applicata la politica di sicurezza chiamata Same-Origin Policy. Per autorizzare tale comunicazione è necessario che il server remoto restituisca l’header Access-Control-Allow-Origin.
Perché esistono gli errori CORS?
Gli errori CORS sono una delle problematiche più comuni durante lo sviluppo di siti web, applicazioni JavaScript, API REST e integrazioni con servizi esterni.
Un classico errore è:
Access to fetch at 'https://api.esempio.com' from origin 'https://miosito.it' has been blocked by CORS policy.
Questo messaggio indica che il server remoto non ha autorizzato il dominio che sta effettuando la richiesta.
Come funziona Access-Control-Allow-Origin
Il server può restituire diversi valori:
Access-Control-Allow-Origin: *
Permette l’accesso da qualsiasi dominio.
Access-Control-Allow-Origin: https://miosito.it
Permette l’accesso esclusivamente dal dominio specificato.
Access-Control-Allow-Origin: https://app.miosito.it
Autorizza soltanto il sottodominio indicato.
Quando utilizzare il carattere *
L’asterisco può essere utilizzato per risorse pubbliche come immagini, font, file CSS o JavaScript distribuiti tramite CDN. Tuttavia non dovrebbe essere utilizzato quando sono coinvolti dati sensibili, autenticazione o cookie.
Esempio Apache (.htaccess)
\nHeader set Access-Control-Allow-Origin "*"\n
Questa configurazione abilita l’accesso da qualsiasi dominio.
Esempio Nginx
add_header Access-Control-Allow-Origin *;
La direttiva può essere inserita all’interno del blocco server o location.
Esempio PHP
È una delle soluzioni più utilizzate per API e servizi personalizzati.
WordPress e Access-Control-Allow-Origin
Su WordPress il problema può manifestarsi quando si utilizzano API REST, font esterni, CDN, plugin di cache o servizi di terze parti. In molti casi è possibile intervenire tramite .htaccess, funzioni PHP personalizzate o configurazioni del server.
Cloudflare e gli errori Access-Control-Allow-Origin
Anche Cloudflare può generare messaggi legati ai CORS quando uno script esterno viene bloccato, modificato o servito con header non corretti. È importante verificare le impostazioni di sicurezza, Rocket Loader, Web Analytics e le regole personalizzate.
Come verificare un errore CORS
- Aprire gli strumenti sviluppatore del browser.
- Accedere alla scheda Console.
- Individuare il dominio che genera l’errore.
- Verificare gli header restituiti dal server.
- Controllare la presenza dell’header Access-Control-Allow-Origin.
Buone pratiche di sicurezza
È consigliabile autorizzare esclusivamente i domini necessari invece di utilizzare sempre il carattere ‘*’. Questo riduce i rischi di accessi indesiderati e migliora la sicurezza complessiva dell’applicazione.
Access-Control-Allow-Origin è uno degli header più importanti nello sviluppo web moderno. Comprendere il funzionamento dei CORS consente di risolvere rapidamente errori di integrazione tra siti, API, CDN e servizi esterni. Una configurazione corretta garantisce sicurezza, compatibilità e prestazioni ottimali per qualsiasi progetto web.
