Bu codelab'de, kaynakları getirirken aynı kaynağın nasıl çalıştığını öğrenin.
Ayar: Aynı kaynaktan sayfa getir
Demo https://same-origin-policy-fetch.glitch.me
adresinde barındırılmaktadır.
Bu basit web sayfası, https://same-origin-policy-fetch.glitch.me/fetch.html
kaynağından kaynak yüklemek için fetch
yöntemini kullanır. index.html
ve fetch.html
aynı kaynağı paylaştığından canlı önizlemede 200
gösterilir.
1. Farklı kaynaktan sayfa getir
Getirme URL'sini https://www.google.com
olarak değiştirmeyi deneyin.
Canlı önizlemede ne görüyorsunuz?
Bir kaynak istediğiniz için tarayıcının getirme isteğini engellemiş olması gerekir bir sorun olduğu görülüyor. Bu, saldırganların kaynaklar arası verileri okuyamayacağı anlamına gelir. bir kullanıcının tarayıcısının kontrolünü ele geçirmiş olsalar bile kaynakları.
2. Kaynaklar arası kaynak getirme
Getirme URL'sini https://api.thecatapi.com/v1/images/search
olarak değiştirmeyi deneyin.
Canlı önizlemede ne görüyorsunuz?
Getirme URL'si farklı bir kaynak ancak durum kodu olarak 200'ü görmeniz gerekir. Neden? Modern web uygulamaları, yüklenmesi için genellikle çapraz kaynak üçüncü taraf komut dosyalarını kullanabilir veya API uç noktasını sorgulayabilirsiniz. Bu kullanım alanlarına uygun olması için Kaynaklar Arası Kaynak Paylaşımı adlı CORS (Kaynaklar Arası Kaynak Paylaşımı) adı verilen başlangıç noktasının yüklenmesine izin verildiğini tarayıcı olarak ayarlayın. CORS hakkında daha fazla bilgi için Kaynaklar arası kaynakları güvenli bir şekilde paylaşma başlıklı makaleyi inceleyin.