Mantenha tudo organizado com as coleções
Salve e categorize o conteúdo com base nas suas preferências.
Mariko Kosaka
Neste codelab, confira como a mesma origem funciona ao buscar recursos.
Configurar: buscar página da mesma origem
A demonstração está hospedada em https://same-origin-policy-fetch.glitch.me.
Esta página da Web simples usa o fetch para carregar recursos de https://same-origin-policy-fetch.glitch.me/fetch.html. Como index.html e fetch.html compartilham a mesma origem, você verá 200 na visualização em tempo real.
1. Buscar página de diferentes origens
Tente mudar o URL de busca para https://www.google.com.
O que é exibido na visualização ao vivo?
O navegador deve ter bloqueado a solicitação de busca porque você solicitou um recurso
de uma origem diferente. Ou seja, um invasor não consegue ler dados
recursos, mesmo que tenham assumido o controle do navegador do usuário.
2. Buscar um recurso de origem cruzada
Tente mudar o URL de busca para https://api.thecatapi.com/v1/images/search.
O que é exibido na visualização ao vivo?
A origem do URL de busca é diferente, mas o código de status é 200. Por quê?
Aplicativos da Web modernos geralmente solicitam recursos de origem cruzada para carregar
scripts de terceiros ou consultar um endpoint de API. Para acomodar esses casos de uso,
existe um mecanismo chamado CORS (Compartilhamento de recursos entre origens) para informar
navegador que o carregamento de um recurso de origem cruzada é permitido. Consulte Compartilhar recursos de origem cruzada com segurança para saber mais sobre o CORS.