In che modo è possibile risolvere l'errore "Nessuna intestazione Access-Control-Allow-Origin presente nella risorsa richiesta" di CloudFront?

6 minuti di lettura
0

Ricevo l'errore CORS "Nessuna intestazione Access-Control-Allow-Origin" nella risorsa richiesta in Amazon CloudFront. Perché ricevo questo messaggio e come posso risolvere il problema?

Risoluzione

Verifica che la policy di condivisione delle risorse tra le origini (CORS) consenta all'origine di restituire l’intestazione Access-Control-Allow-Origin

Nota: se ricevi messaggi di errore durante l'esecuzione dei comandi dell'interfaccia della linea di comando AWS (AWS CLI), assicurati di utilizzare la versione più recente di AWS CLI.

Esegui il seguente comando per verificare che il server di origine restituisca l'intestazione Access-Control-Allow-Origin. Sostituisci example.com con l'intestazione di origine richiesta. Sostituisci https://www.example.net/video/call/System.generateId.dwr con l'URL della risorsa che restituisce l'errore di intestazione.

curl -H "Origin: example.com" -v "https://www.example.net/video/call/System.generateId.dwr"

Se la policy CORS consente al server di origine di restituire l'intestazione Access-Control-Allow-Origin, verrà visualizzata una risposta simile alla seguente:

HTTP/1.1 200 OK
Server: nginx/1.10.2
Date: Mon, 01 May 2018 03:06:41 GMT
Content-Type: text/html
Content-Length: 3770
Last-Modified: Thu, 16 Mar 2017 01:50:52 GMT
Connection: keep-alive
ETag: "58c9ef7c-eba"
Access-Control-Allow-Origin:
    example.com
Accept-Ranges: bytes

Se le intestazioni CORS non vengono restituite nella risposta, significa che il server di origine non è configurato correttamente per CORS. Imposta una policy CORS sulla tua origine personalizzata o sull'origine Amazon Simple Storage Service (Amazon S3).

Configura la distribuzione CloudFront per inoltrare le intestazioni appropriate al server di origine

Dopo aver impostato una policy CORS sul server di origine, configura la distribuzione CloudFront per inoltrare le intestazioni di origine al server di origine. Se il tuo server di origine è un bucket Amazon S3, configura la distribuzione per inoltrare le seguenti intestazioni ad Amazon S3:

  • Access-Control-Request-Headers
  • Metodo di richiesta di controllo dell'accesso
  • Origine

Per inoltrare le intestazioni al server di origine, CloudFront ha due policy predefinite a seconda del tipo di origine: CORS-S3Origin e CORS-CustomOrigin.

Per aggiungere una policy predefinita alla tua distribuzione:

  1. Apri la distribuzione dalla console CloudFront.
  2. Scegli la schedaComportamenti.
  3. Scegli Create Behavior (Crea comportamento). In alternativa, seleziona un comportamento esistente e poi scegli Edit (Modifica).
  4. In Cache key and origin requests (Chiave di cache e richieste di origine), scegli Cache policy and origin request policy (Policy di cache e policy di richiesta origine). Successivamente, per la policy di richiesta di origine, scegli CORS-S3Origin o CORS-CustomOrigin dall'elenco a discesa. Per ulteriori informazioni, consulta Utilizzo delle policy di richiesta origine gestite.
    Nota: per creare invece una policy di cache personalizzata, consulta Creazione di policy della cache.
  5. Scegli Create Behavior (Crea comportamento). Oppure, scegli Save changes (Salva modifiche) se stai modificando un comportamento esistente.

Per inoltrare le intestazioni utilizzando una policy di cache:

  1. Crea una policy di cache.
  2. In Cache key settings (Impostazioni della chiave di cache), per Headers (Intestazioni), seleziona Include the following headers (Includi le seguenti intestazioni). Dall'elenco a discesa Add header (Aggiungi intestazione), scegli una delle intestazioni richieste dalla tua origine.
  3. Compila le impostazioni della policy della cache come richiesto dal comportamento a cui stai allegando la policy.
  4. Allega la policy della cache al comportamento della tua distribuzione CloudFront.

Per inoltrare le intestazioni utilizzando le impostazioni della cache legacy:

  1. Apri la distribuzione dalla console CloudFront.
  2. Scegli la schedaComportamenti.
  3. Scegli Create Behavior (Crea comportamento). In alternativa, seleziona un comportamento esistente e poi scegli Edit (Modifica).
  4. In Richieste di origine e chiave cache, selezionare Impostazioni cache legacy.
  5. Nell'elenco a discesa Headers (Intestazioni), scegli le intestazioni richieste dalla tua origine. Scegli Add custom (Aggiungi personalizzato) per aggiungere le intestazioni richieste dall'origine che non appaiono nell'elenco a discesa.
  6. Scegli Create Behavior (Crea comportamento). Oppure, scegli Save changes (Salva modifiche) se stai modificando un comportamento esistente.

Nota: assicurati di inoltrare anche l'intestazione come parte della richiesta del client a CloudFront, che quest'ultimo inoltrerà all'origine.

Configura il comportamento della cache della distribuzione CloudFront per consentire il metodo OPTIONS per le richieste HTTP

Se continui a visualizzare errori dopo aver aggiornato la policy CORS e inoltrato le intestazioni appropriate, consenti il metodo HTTP OPTIONS nel comportamento della cache della distribuzione. Per impostazione predefinita, CloudFront consente solo i metodi GET e HEAD. Tuttavia, alcuni browser Web possono inviare richieste per il metodo OPTIONS. Per attivare il metodo OPTIONS sulla distribuzione CloudFront:

  1. Apri la distribuzione dalla console CloudFront.
  2. Scegli la schedaComportamenti.
  3. Scegli Create Behavior (Crea comportamento). In alternativa, seleziona un comportamento esistente e poi scegli Edit (Modifica).
  4. Per Allowed HTTP Methods (Metodi HTTP consentiti), seleziona GET, HEAD, OPTIONS.
  5. Scegli Create Behavior (Crea comportamento). Oppure, scegli Save changes (Salva modifiche) se stai modificando un comportamento esistente.

Configura la policy di risposta di CloudFront per restituire le intestazioni Access-Control-Allow-Origin richieste

Se il server di origine non è accessibile o non può essere configurato per restituire le intestazioni CORS appropriate, configura una policy di risposta CloudFront per restituire le intestazioni CORS richieste. Per configurarla, crea policy per le intestazioni di risposta:

  1. Apri la distribuzione dalla console CloudFront.
  2. Scegli la schedaComportamenti.
  3. Scegli Create Behavior (Crea comportamento). In alternativa, seleziona un comportamento esistente e poi scegli Edit (Modifica).
  4. Per la policy delle intestazioni di risposta:
    Seleziona una policy di risposta esistente dall'elenco a discesa.
    -oppure-
    Scegli Create policy (Crea policy) per creare una nuova policy per le intestazioni di risposta. Nella nuova policy, in Cross-origin resource sharing (Condivisione delle risorse tra origini), attiva CORS.
  5. Compila altre impostazioni secondo necessità e scegli Create policy (Crea policy).
  6. Dalla pagina Crea comportamento, scegli la policy che hai creato dall'elenco a discesa.
  7. Scegli Create Behavior (Crea comportamento). Oppure, scegli Save changes (Salva modifiche) se stai modificando un comportamento esistente.

Nota: CloudFront in genere distribuisce le modifiche alla distribuzione entro cinque minuti. Dopo aver modificato la distribuzione, invalida la cache per cancellare le risposte precedentemente memorizzate in essa.


Informazioni correlate

Configurazione di CloudFront per rispettare le impostazioni CORS

Configurazione della funzionalità Cross-Origin Resource Sharing (CORS)

Utilizzo delle policy per le intestazioni di risposta gestite

Aggiunta di una intestazione CORS (cross-origin resource sharing) alla risposta