Web oynatıcısında FLV veya M3U8 videolarını oynatırken bir Access-Control-Allow-Origin hatası alırsanız, oynatma etki alanı için CORS'u etkinleştirin.
Hata mesajı
Aşağıdaki hatayı görebilirsiniz:
No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
Origin ‘http://localhost:9030‘ is therefore not allowed access.
Çözümler
Senaryo 1: ApsaraVideo VOD'da hızlandırılan etki alanı
Videolarınız CDN ile hızlandırılan bir etki alanına sahip ApsaraVideo VOD'da barındırılıyorsa, çapraz kaynak isteklerine izin vermek için bir HTTP yanıt üst bilgisi ekleyin.
ApsaraVideo VOD konsolu üzerinde oturum açın.
Sol gezinme bölmesinde, Configuration Management altında CDN Configuration > Domain Names öğesini seçin.
Yapılandırmak istediğiniz etki alanını bulun ve İşlemler sütununda Configure seçeneğine tıklayın.
Sol gezinme bölmesinde Cache seçeneğine tıklayın. Custom HTTP Response Header sekmesinde Add seçeneğine tıklayın.
-
Yanıt üst bilgisi olarak Access-Control-Allow-Origin değerini seçin.
Response Header Action değerini Add, Response Header Value değerini ise
*olarak ayarlayın. Allow Duplicates için Not Allowed seçeneğini belirleyin. Cross-Origin Verification özelliğinin devre dışı bırakıldığından emin olun ve ardından OK seçeneğine tıklayın. -
Yanıt üst bilgisi değerini girin ve OK seçeneğine tıklayın.
NotHerhangi bir kaynaktan gelen isteklere izin vermek için değeri
*olarak ayarlayın.Değer
*değilse, virgülle (,) ayrılmış bir veya daha fazla IP adresi ya da etki alanı adı belirtin.Değer
*değilse,http://veyahttps://önekini içermelidir.Değerde bağlantı noktası numaraları desteklenir.
Joker karakterli etki alanı adları desteklenir.
Add seçeneğine tıklayın, Access-Control-Allow-Methods seçeneğini belirleyin ve değerini POST veya GET olarak ayarlayın. Birden fazla yöntemi virgülle (,) ayırın.
Bir TS segmentinin URL'si M3U8 URL'sinden farklı bir etki alanı kullanıyorsa, TS segmentinin etki alanı için de CORS'u yapılandırmanız gerekir.
Senaryo 2: OSS'de özel etki alanı
OSS kaynaklarına bir oynatıcıdan doğrudan erişmek için paket üzerinde CORS'u etkinleştirin. Ayrıntılı adımlar için bkz. Çapraz kaynak paylaşımını ayarlama.
Aşağıdaki ayarlara sahip bir CORS kuralı oluşturun:
Source: *.
Allowed Methods: GET, POST, PUT, DELETE ve HEAD seçeneklerini belirleyin.
Allowed Headers: *.
Exposed Headers: ETag.
Bunun CORS kurallarınız listesindeki ilk kural olduğundan emin olun.
Max Age (Seconds) değerini 0 olarak ayarlayın ve Return Vary: Origin kutusunun işaretini kaldırın.
Yapılandırmayı doğrulayın
CORS yapılandırmanızı doğrulayın:
Tarayıcınızın geliştirici araçlarını (F12) açın.
Network sekmesine gidin.
Çapraz kaynak isteği yapan sayfayı ziyaret edin.
Ağ isteği listesinde video isteğinizi bulup üzerine tıklayın.
Response Headers bölümünü kontrol edin ve
Access-Control-Allow-Originüst bilgisinin beklenen değerle mevcut olduğunu doğrulayın.
Access-Control-Allow-Origin üst bilgisi doğru değerle görünüyorsa, CORS doğru şekilde yapılandırılmıştır.