CDN:Configure o Cross-Origin Resource Sharing

O que é o Cross-Origin Resource Sharing?

O Cross-Origin Resource Sharing (CORS) é um mecanismo padrão que permite a uma página da web acessar recursos de uma origem diferente (domínio, protocolo ou porta) da sua própria. Ele oferece uma maneira segura de ativar transferências de dados entre origens. Para mais informações, consulte Cross-Origin Resource Sharing (CORS).

Benefícios do CORS

Devido a restrições de segurança, os navegadores geralmente seguem a política de mesma origem, que restringe as solicitações de carregar e acessar recursos de domínios, subdomínios, protocolos ou portas diferentes. Por exemplo, example.com não pode acessar recursos em example.org. Ao configurar o Cross-Origin Resource Sharing (CORS), você pode definir os cabeçalhos de resposta relevantes no servidor CDNDCDN. Se uma solicitação incluir cabeçalhos que atendam às regras permitidas, o servidor retornará os cabeçalhos de resposta HTTP correspondentes, permitindo que os recursos de origens diferentes sejam carregados e acessados.

Como funciona

CORS configurado no servidor de origem

1. O cliente envia uma solicitação para example.com, por exemplo, https://example.com/index.html.

2. O example.com responde com o arquivo index.html. A página contém um link para um recurso em uma origem diferente: https://example.org/image_01.png.

3. O cliente envia uma solicitação para example.org.

4. Após receber a solicitação, o example.org responde com um cabeçalho CORS, por exemplo, Access-Control-Allow-Origin: *.

5. Após receber a resposta, o navegador verifica o valor do cabeçalho de resposta CORS. Como o valor é *, o que permite o acesso de qualquer origem, o navegador renderiza a resposta.

Com o CORS configurado no CDN

1. O cliente envia uma solicitação ao CDN, por exemplo, https://example.com/index.html.

2. O CDN responde com o arquivo index.html, que contém um recurso de outra origem: https://example.org/image_01.png.

3. O cliente envia uma solicitação ao CDN: https://example.org/image_01.png. A solicitação inclui o cabeçalho Origin: http://example.com.

4. Após receber a solicitação, o CDN verifica se o valor do cabeçalho Origin corresponde ao valor de Access-Control-Allow-Origin configurado no CDN. Há suporte para correspondência exata (um único valor ou vários valores) e correspondência de domínio com curinga. Se os valores não coincidirem, o CDN não retornará um cabeçalho CORS; o cabeçalho será retornado apenas quando houver correspondência.

5. O CDN retorna o cabeçalho CORS com base no resultado da validação, por exemplo, Access-Control-Allow-Origin: http://example.com.

6. Após receber a resposta, o navegador verifica o valor do cabeçalho de resposta CORS. Como o valor é http://example.com, o que permite o acesso entre origens, o navegador renderiza a resposta.

Observações de uso

• Se você usar um bucket do OSS como servidor de origem, a configuração de CORS no console CDNDCDN substituirá a configuração de CORS no console do OSS. Para mais informações sobre como configurar o CORS no console do OSS, consulte Defina regras de CORS.

• Se você usar um servidor local ou uma instância do ECS como servidor de origem, recomendamos separar o conteúdo estático e dinâmico e usar o CDNDCDN para acelerar a entrega de arquivos estáticos. O recurso de CORS configurado no console CDNDCDN se aplica apenas a arquivos estáticos.

Ativar o Cross-Origin Resource Sharing

1. Faça login no CDN console.

2. No painel de navegação à esquerda, clique em Domain Names.

3. Na página Domains, localize o domínio que deseja gerenciar e clique em Actions na coluna Manage.

4. Clique em Cache, selecione a guia Modify Outgoing Response Header e defina as origens e os métodos permitidos para solicitações entre origens.

   • Definir a origem para solicitações entre origens

     Clique em Customize, configure os parâmetros conforme descrito na tabela a seguir e clique em OK.

     Parâmetro	Descrição	Exemplo
     Operation	Defina este parâmetro como Add para ativar o recurso de validação de CORS.	Add
     Response Header	Você deve definir Access-Control-Allow-Origin para usar o recurso de validação de origem cruzada.	Access-Control-Allow-Origin
     Header Value	Se a validação de CORS estiver desativada: Especifique apenas um curinga ou uma única origem. Curinga *: Permite que qualquer origem acesse o recurso. Origem única: Permite que os recursos sejam acessados apenas de uma origem específica (nome de domínio). Se a validação de CORS estiver ativada: Especifique um curinga, uma única origem, várias origens ou um domínio com curinga. Curinga *: Permite que qualquer origem acesse o recurso. Origem única: Permite que os recursos sejam acessados apenas de uma origem específica (nome de domínio). Várias origens especificadas: Configure várias origens específicas (nomes de domínio), separadas por vírgula ,, para permitir que essas origens acessem o recurso. Importante Ao especificar várias origens, separe-as com vírgulas (,). Se você usar ponto e vírgula (;), a configuração de CORS não terá efeito. O console ainda mostrará a configuração como bem-sucedida, mas o CDN tratará toda a string separada por ponto e vírgula como uma única origem. Essa origem não corresponde a nenhum domínio individual na solicitação, portanto, o CORS não funcionará. Domínio com curinga: Especifique um domínio com curinga para permitir o acesso de todas as origens que correspondam ao padrão.	* http://www.aliyun.com https://aliyun.com,http://www.aliyun.com http://*.aliyun.com
     Allow Duplicates	Yes: Os cabeçalhos do servidor de origem são preservados e o novo cabeçalho com nome idêntico também é adicionado à resposta. No: O novo cabeçalho substitui qualquer cabeçalho com nome idêntico do servidor de origem. Importante As configurações Allow Duplicates e CORS Validation são mutuamente exclusivas. Se você definir Allow Duplicates como Yes, a validação de CORS será desativada.	No
     CORS	O CORS só pode ser configurado quando a Operation estiver definida como Add e o Response Header estiver definido como "Access-Control-Allow-Origin". O CORS pode ser definido como Disable ou Enable. O valor padrão é Disable. Disable: Os POPs do CDN não validam o cabeçalho Origin nas solicitações recebidas e sempre retornam o valor configurado de Access-Control-Allow-Origin. Enable: Os POPs do CDN validam solicitações entre origens com base nas seguintes regras e respondem com o valor de Access-Control-Allow-Origin de acordo. Response Header: Se o Response Header estiver definido como , o POP sempre retornará Access-Control-Allow-Origin:, independentemente de a solicitação do usuário conter um cabeçalho Origin ou qual seja o seu valor. Response Header: O Response Header está definido como uma ou mais origens específicas, separadas por vírgulas (,). Se o valor do cabeçalho Origin na solicitação do usuário corresponder exatamente a uma das origens configuradas, o POP responderá com essa origem como o valor do cabeçalho Access-Control-Allow-Origin. Se nenhuma correspondência for encontrada, o POP não adicionará o cabeçalho CORS à resposta. Response Header: Se o Response Header estiver definido como um domínio com curinga, o POP verificará se o cabeçalho Origin na solicitação corresponde ao padrão de curinga. Se você definir Enable como Header Value e o nome de domínio no campo Header Value contiver um hífen (-), será necessário escapá-lo substituindo - por %-. Exemplo: Valor original do cabeçalho: http://doc.aliyun-example.com. Valor escapado do cabeçalho: http://doc.aliyun%-example.com.	Enable

   • Definir os métodos para solicitações entre origens

     Clique em Customize, configure os parâmetros conforme descrito na tabela a seguir e clique em OK.

     Parâmetro	Descrição	Exemplo
     Operation	Defina este parâmetro como Add.	Add
     Response Header	Deve ser definido como Access-Control-Allow-Methods	Access-Control-Allow-Methods
     Header Value	Há suporte para os métodos de solicitação GET, POST e PUT. Se você precisar adicionar GET, POST e PUT ao mesmo tempo, separe-os com uma vírgula ,.	GET
     Allow Duplicates	Yes: Os cabeçalhos do servidor de origem são preservados e o novo cabeçalho com nome idêntico também é adicionado à resposta. No: O novo cabeçalho substitui qualquer cabeçalho com nome idêntico do servidor de origem.	No

Exemplos de configuração

Verifique se a configuração entre origens está em vigor

1. O novo cabeçalho de resposta entre origens não se aplica automaticamente aos recursos armazenados em cache anteriormente, porque o CDN armazena em cache a resposta HTTP completa. Para aplicar a nova configuração de Access-Control-Allow-Origin, remova os recursos correspondentes do cache do CDN. Caso contrário, os usuários continuarão recebendo respostas do cache antigo que não incluem o cabeçalho.

2. Use o curl para enviar uma solicitação GET com um cabeçalho Origin especificado e verifique o cabeçalho de resposta na saída detalhada: curl -svo /dev/null https://accelerated.domain.name/resource/path -H 'origin:https://your-site.example.com'

3. Verifique o cabeçalho Access-Control-Allow-Origin na resposta. Se o valor do cabeçalho for * ou corresponder à Origin da solicitação, a configuração estará em vigor.

Observações de uso e limites

Para saber como solucionar problemas em casos nos quais os erros de CORS persistem após configurar o Access-Control-Allow-Origin, consulte Cache troubleshooting.