OpenLayers'ta CORS'yi Etkinleştirme

OpenLayers'ta Kaynaklar Arası Kaynak Paylaşımı'nı (CORS) etkinleştirmek mümkün mü ? Öyleyse nasıl?

OpenLayers bir web harita var ve bir PNG görüntü olarak işlemek için bir HTML tuval kullanıyorum. Scriptim harika çalışıyor, ancak tarayıcının aynı menşe politikası nedeniyle tuvalimi bir resme dönüştürebilirim, ancak ona çizdiğim tüm harita döşemeleri aynı ana bilgisayardan geliyorsa (örn. sub.domain.com).

: My haritanın yüklenme hızını artırmak için, ben alt alanların bir diziden fayans çekin a.domain.com, b.domain.comolarak, şimdiye kadar bir görüntüye benim tuval dönüştürme beni bu ölçüde ev sahibinin başına dört eşzamanlı bağlantı tarayıcının sınırı etrafında çalışan, performansı artırır, vb ama önler fayanslar birden çok ana bilgisayardan gelir.

Bu soruna geçici bir çözüm bulmak için CORS kullanmaya çalışıyorum . Ben Access-Control-Allow-OriginPHP ile hizmet karo seti için uygun yanıt başlığını ayarladım , ama bu bir etkisi yok. Bunun Origin, istekte (Wiki sayfasındaki örnekte gösterildiği gibi) başlık bulunmadığından şüpheleniyorum . Bazı OpenLayers yapılandırmaları gerekiyor gibi görünüyor. Ama ne? Bunu başarılı bir şekilde yapan var mı?

OpenLayers kaynağını çok fazla açtıktan sonra buldum! Sorun eksik bir istek üstbilgisi değil img, özellikle katmanı oluşturan öğelerde eksik bir öznitelikti crossorigin. Bkz MDN o özelliğin ayrıntıları ve için dokümantasyon openlayers ile nasıl kullanılacağını için OpenStreetMap katmanları için ( Güncelleme: Burada biraz daha makul bir yerde daha resmi belgedir).

OpenLayers'larınızın imgbu öğeye sahip olduğundan emin olmak için katman seçeneklerinizdeki değerdeki crossOriginKeywordseçeneği ayarlayın tileOptions:

tileOptions: {crossOriginKeyword: 'anonymous'}

Bunu şu şekilde ayarlayabilirsiniz:

• "anonymous"- " Basit " bir CORS talebi yapın.
• "use-credentials"- Gerektiğinde çerezler ve HTTP kimlik doğrulaması ile " kimlik bilgileri " içeren bir CORS isteği yapın.
• null- crossoriginÖzelliği dahil etmeyin ve CORS kullanmayın. Çoğu OpenLayers Layer sınıfı ve varsayılan sorunlarımın varsayılanı.

Son olarak, tamlık için, burada bir WMS katmanıyla nasıl kullanılacağına dair soyulmuş bir örnek. Diğer katman sınıflarıyla çalışmak benzerdir.

var layer = new OpenLayers.Layer.WMS('My Layer', 'http://my.server.com', {
    format: 'image/png',
    layers: 'my:layer'
}, {
    tileOptions: {crossOriginKeyword: 'anonymous'},
    transitionEffect: null
});

Umarım bunun bir başkasına yardımı olur!

Not: Bu yöntemi / özniteliği kullanırsanız, döşeme sunucunuzun uygun bir başlık göndermesi gerekirAccess-Control-Allow-Origin . Bu başlığı göndermeyen bir sunucu ile kullanılması kutucukların görüntülenmemesine neden olur. Şimdi GeoServer'ı oynamak için ...

hemen sonra

var layer =new OpenLayers.Layer.WMS(...

Ekle

layer.tileOptions.crossOriginKeyword = null;