Merhabalar , Bu yazımızda cross domain hatası ve nedenleri ile alakalı durumlardan kısaca bahsedeceğim.

Öncelikle Cross domain hatası nedir ?

  • Başka bir dominden wep api ye ajax request yapılırken tarayıcı güvenlik gereği sayfayı engeller.
  • Bu kısıtlamaya same-origin policy denir.

Cross Domain olması için ,

  • Aynı domain farklı port
  • farklı dominlerin olması
  • Farklı protokollerde olması http,https gibi.

screenshot_3

CORS Nedir?

Cross-Origin Resource Sharing (Kökenler arası kaynak paylaşımı) anlamına gelen CORS, web tarayıcısı tarafından yönetilen ve ek HTTP başlıkları kullanılarak, bir kökende çalışan web uygulamasının, farklı bir kökende yer alan web uygulamasına erişim izni kontrolünü sağlayan mekanizmadır. Web uygulaması, internet tarayıcısı üzerinden farklı bir kökene (protokol, domain ve port) herhangi bir istek gönderirse cross-origin HTTP isteği oluşturmuş olur.

CORS çalışma mantığı      cors-calisma-mantigi-850x450

Örneğin, http://domain-a.com üzerinde yer alan bir web uygulamasının JavaScript tarafından ajax isteği göndererek, http://domain-b.com‘a erişmesi bir cross origin isteğidir.

Not: Eğer frontend (browser) tarafından değil de backend tarafından (Örneğin C# koduyla) domain-b.com’a erişseydi bu bir cross origin istek olmayacaktı.

Wep Api Projemizide bu hatayı çözmek ve gerekli izinleri vermek için yapmamız gereken işlemler

Öncelik olarak projemize Nuget üzerinden System.Web.Http.Cors; dll ini indrelim.

screenshot_4

1.Yöntem : WebApiConfig.cs ten ayarlamalarımızı yapmak.

EnableCorsAttribute sınıfına giriş parametresi olarak domain-origin , headers,methods verebiliriz , tüm herşeye izin vermek için * şareti ile tanımlama yapmamız yeterli olacaktır.

Bu ayarlama ile artık farklı domaindeki sitelerden AJAX Requestler başarılı şekilde çalışabileceklerdir.

2.Yöntem

Eğer bu iznin tüm proje genelinde olmasını istemiyor isek bunu bir Attribute olarak Controller veya Action da tanımlayıp kullanabiliriz.

Yapmamız gereken tek şey örnek koddakı gibi controller veya action üzerine EnableCors attribute ünü tanımlamak.

Örnek Kod:

3. Yönetem:  Kendi MediaTypeFormatter ımızı yaparak bu özelliği eklemek.

Örneğimizde MediaTypeFormatter classını WebApiConfig.cs dosyası içerisinde yaptım.

JsonFormatterdan miras alarak yaptığımız için öncelik olarak JsonFormater ı remove edip kendi formatter ımızı ekleyeceğiz.

MediaTypeFormatter kodlarımız :

screenshot_5

 

Print Friendly, PDF & Email
Bu alana reklam verebilirsiniz!