Utilizzo di Frontdoor di Azure Standard/Premium con Cross-Origin Resource Sharing (CORS)

Si applica a: ✔️ Front Door Standard ✔️ Front Door Premium

CORS (Cross Origin Resource Sharing) è una funzione HTTP che consente a un'applicazione web in esecuzione sotto un dominio di accedere alle risorse di un altro dominio. Per ridurre la possibilità di attacchi di cross-site scripting, tutti i moderni browser web applicano una restrizione di sicurezza nota come criterio della stessa origine. Tale restrizione impedisce a una pagina Web di chiamare le API in un dominio diverso. CORS offre un modo sicuro per consentire a una origine, ovvero il dominio di origine, di chiamare le API in un'altra origine.

Come funziona

Esistono due tipi di richieste CORS: richieste semplici e richieste complesse.

Per le richieste semplici:

  1. Il browser invia la richiesta CORS con un'altra intestazione della richiesta HTTP Origin. Il valore di questa intestazione è l'origine da cui è stata caricata la pagina principale, definita come la combinazione di protocollo,dominio, e porta. Quando una pagina di https://www.contoso.com tenta di accedere ai dati di un utente nell'origine fabrikam.com, la seguente intestazione di richiesta viene inviata a fabrikam.com:

    Origin: https://www.contoso.com

  2. Il server potrebbe rispondere con una qualsiasi delle seguenti risposte:

    • Un'intestazione Access-Control-Allow-Origin presente nella risposta, per indicare il sito di origine consentito. Per esempio:

      Access-Control-Allow-Origin: https://www.contoso.com

    • Un codice di errore HTTP, ad esempio 403, se il server non consente la richiesta multiorigine dopo il controllo dell'intestazione Origin

    • Un'intestazione Access-Control-Allow-Origin con un carattere jolly che consente tutte le origini:

      Access-Control-Allow-Origin: *

Per richieste complesse

Una richiesta complessa è una richiesta CORS in cui il browser deve inviare una richiesta preflight (cioè una sonda preliminare) prima di inviare la richiesta CORS effettiva. La richiesta preflight chiede al server il permesso di proseguire con la richiesta CORS originale. È una OPTIONS richiesta sullo stesso URL.

Tip

Per maggiori dettagli sui flussi CORS e sulle insidie comuni, consulta la Guida al CORS per le API REST.

Scenari con caratteri jolly o singola origine

CORS su Frontdoor di Azure funziona automaticamente senza configurazioni aggiuntive quando l'intestazione Access-Control-Allow-Origin è impostata su wildcard (*) o su un singolo origin. Frontdoor di Azure memorizza nella cache la prima risposta e le richieste successive utilizzano lo stesso header.

Se invii richieste ad Frontdoor di Azure prima di impostare CORS sulla tua origine, devi eliminare i contenuti sul tuo endpoint per ricaricarli con l'intestazione Access-Control-Allow-Origin.

Scenari di origine multipla

Se devi permettere una lista specifica di origini per CORS, le cose si complicano un po'. Il problema si verifica quando la CDN memorizza in cache l'intestazione Access-Control-Allow-Origin per la prima origine CORS. Quando un'origine CORS diversa fa un'altra richiesta, la CDN serve l'intestazione Access-Control-Allow-Origin memorizzata nella cache, che non corrisponde. Diversi metodi possono correggere questo problema.

Set di regole Frontdoor di Azure

Su Frontdoor di Azure, puoi creare una regola nell'Frontdoor di Azure Rules Set per controllare l'intestazione Origin sulla richiesta. Se è un'origine valida, la tua regola imposta l'intestazione Access-Control-Allow-Origin con il valore corretto. In questo caso, l'intestazione Access-Control-Allow-Origin dal server di origine del file viene ignorata e il motore di regole di Frontdoor di Azure gestisce completamente le origini CORS consentite.

Schermata di un set di regole di esempio.

Tip

Puoi aggiungere altre azioni alla tua regola per modificare altri header di risposta, come Access-Control-Allow-Methods.

Passo successivo