Bu yazıda CORS'nin ne olduğu hakkında çok fazla ayrıntıya girmeyeceğim. Söyleyeceğim tek şey, CORS'nin güvenlik nedenleriyle var olduğu ve localhostta geliştirme yaparken karşımıza çıktığında gerçekten de çekilmez olabiliyor. 

Bildiğiniz ve güvendiğiniz API'leri kullanarak localhost üzerinde geliştiriyorsanız, güvenlik riski yoktur. Web'de CORS devre dışı bırakılmışsa, kendinizi saldırılara açık bırakırsınız.

CORS hakkında daha fazla bilgi için  MDN dokümanlar üzerinde CORS hakkında daha fazla bilgi .

Aşağıda ayrıntılı olarak, localhost üzerindeki çapraz kaynak kısıtlamalarını devre dışı bırakmak için (ve bu nedenle uygulamanızı yerel olarak geliştirirken CORS hatalarını düzeltmek için) iki ana çözümü açıklamaya çalışacağım.

1. Tarayıcıda CORS'yi devre dışı bırakın

CORS'yi doğrudan tarayıcıdan devre dışı bırakabilirsiniz. Bunu yaparsanız, bir nedenle var olan güvenlik kısıtlamalarını devre dışı bıraktığınızı lütfen unutmayın. Bunu kalıcı bir çözüm olarak tavsiye etmem; Sadece web sitenizi / uygulamanızı geliştirirken yapın.

Chrome'de devre dışı bırakmak :

Mac'teki Chrome'un (v84'te test edilmiş) en son sürümünde CORS'yi devre dışı bırakmanın en güvenilir yolu, web güvenliği devre dışı bırakılmış olarak çalıştırmaktır.

  • Mac menüsüne gidip "zorla çıkmaya" (veya Q komutuna basarak) Chrome'dan çıkmaya zorlayın .
  • Ardından , web güvenliği devre dışı bırakılmış olarak Chrome'u açmak için bu komutu çalıştırın.
    • open -n -a /Applications/Google Chrome.app/Contents/MacOS/Google Chrome — args — user-data-dir=”/tmp/chrome_dev_test” — disable-web-security

    Geliştirmeyi tamamladıktan sonra Chrome'u yeniden başlatın ve normale dönecektir.

    Firefox'de devre dışı bırakmak :

    Firefox'ta CORS'yi devre dışı bırakmanın en kolay ve güvenilir yolu CORS Everywhere eklentisini yüklemektir .

    Safari'de devre dışı bırakmak :

    Safari'de CORS'a ulaşmanın en kolay ve güvenilir yolu, geliştirme menüsünde CORS'yi devre dışı bırakmaktır.

  • Tercihler> Gelişmiş'e giderek geliştirme menüsünü etkinleştirin .
  • Ardından , geliştirme menüsünden “ Çapraz Kaynak Sınırlamalarını Devre Dışı Bırak ” ı seçin .

    • Geliştirmeyi tamamladıktan sonra Safari'yi yeniden başlatın ve normale dönecektir.

    2. CORS hatalarını önlemek için bir proxy kullanın

    Alternatif olarak, her yerde cors gibi bir proxy kullanabilirsiniz. Demo olarak sunucuda çalışmak isterseniz  Rob - W burada kayıt veya yapılandırma gerektirmeyen herkese açık bir demo hazırladı https://cors-anywhere.herokuapp.com . Sadece bir demo istekleri sınırlı olduğu için.

    Her yerde cors'un herkese açık demosunu kullanmak için, yalnızca https://cors-anywhere.herokuapp.com/https://cat-fact.herokuapp.com/facts sonra istekte bulunmak istediğiniz URL'yi ekleyin. (* bunu tarayıcıda görüntülerseniz eksik bir istek başlığı hakkında bir hata alabilirsiniz. Axios veya Getir gibi bir uygulama kullanarak uygulamanızda bir API isteği yaptığınızda bu bir sorun olmayacaktır).