OpenLayers में कोर को सक्षम करना

Question

क्या OpenLayers में Cross-Origin Resource Sharing (CORS) को सक्षम करना संभव है ? यदि हां, तो कैसे?

मेरे पास OpenLayers में एक वेब मानचित्र है, और मैं इसे PNG छवि के रूप में प्रस्तुत करने के लिए HTML कैनवास का उपयोग कर रहा हूं। मेरी स्क्रिप्ट बहुत अच्छी है, लेकिन ब्राउज़र की समान-मूल नीति के कारण , मैं अपने कैनवास को केवल एक छवि में बदल सकता हूं, अगर मैंने जो भी मैप टाइलें खींची हैं, वे उसी होस्ट (जैसे sub.domain.com) से आते हैं ।

: मेरे मानचित्र के लोड होने की गति को बढ़ावा देने के लिए, मैं उप डोमेन की एक सरणी से टाइल खींच a.domain.com, b.domain.comकभी एक छवि के लिए अपने कैनवास परिवर्तित करने से, आदि यह बहुत मेजबान प्रति चार निरंतर कनेक्शन की ब्राउज़र की सीमा के आसपास काम कर, प्रदर्शन को बेहतर बनाता है, लेकिन रोकता है मुझे, के रूप में टाइल्स कई मेजबानों से आते हैं।

मैं इस समस्या के आसपास काम करने के लिए कॉर्स का उपयोग करने की कोशिश कर रहा हूं । मैंने Access-Control-Allow-OriginPHP के साथ सेवा करने वाले टाइल्ससेट के लिए उपयुक्त प्रतिक्रिया हेडर सेट किया है , लेकिन इसका कोई प्रभाव नहीं है। मुझे संदेह है कि यह Originअनुरोध में हेडर नहीं होने के कारण है (जैसा कि विकी पृष्ठ पर उदाहरण में दिखाया गया है)। ऐसा लगता है कि कुछ OpenLayers कॉन्फ़िगरेशन की आवश्यकता है। पर क्या? क्या किसी और ने इसे सफलतापूर्वक किया है?

Answer 1

OpenLayers स्रोत के माध्यम से बहुत कुछ करने के बाद , मैंने इसे पा लिया है! समस्या एक लापता अनुरोध हेडर नहीं थी, लेकिन imgविशेष रूप से परत बनाने वाले तत्वों पर एक लापता विशेषता थी crossorigin। उस विशेषता के विवरण के लिए MDN देखें , और OpenLayers के साथ इसका उपयोग करने के तरीके के लिए OpenStreetMap परतों के लिए प्रलेखन ( अपडेट: यहां एक अधिक उचित स्थान पर थोड़ा और अधिक आधिकारिक दस्तावेज है)।

यह सुनिश्चित करने के लिए कि आपके OpenLayers imgमें वह तत्व है, crossOriginKeywordविकल्प tileOptionsको अपने लेयर विकल्पों में मान में सेट करें:

tileOptions: {crossOriginKeyword: 'anonymous'}

आप इसे सेट कर सकते हैं:

• "anonymous"- एक " सरल " कोर अनुरोध करें।
• "use-credentials"- कुकीज़ और HTTP प्रमाणीकरण के साथ एक " क्रेडेंशियल " कोर अनुरोध करें, आवश्यकतानुसार।
• null- crossoriginविशेषता को शामिल न करें , और इस तरह कोर का उपयोग न करें। अधिकांश OpenLayers परत वर्गों के लिए डिफ़ॉल्ट, और मेरी परेशानियों का स्रोत।

अंत में, पूर्णता के लिए, यहां WMS परत के साथ इसका उपयोग करने का एक छीन-नीचे उदाहरण है। अन्य परत वर्गों के साथ काम करना समान है।

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

मैं उम्मीद करता हूं कि इससे किसी की मदद होगी!

नोट: ऐसा लगता है कि यदि आप इस विधि / विशेषता का उपयोग करते हैं, तो आपके टाइल सर्वर को एक उपयुक्त हेडर भेजने की आवश्यकता होती है Access-Control-Allow-Origin। एक सर्वर के साथ इसका उपयोग करने से उस टाइल में हेडर परिणाम प्रदर्शित नहीं होता है। अब जियो सेवर करने के लिए मिलेगा साथ ...

Comments

यह बहुत अच्छा है कि आपने इसे पा लिया है, और इसे हमारे साथ साझा किया है।

— देवदत्त तेंगशे

OpenLayers

— nemo

Answer 2

तुरंत बाद

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

जोड़ना

layer.tileOptions.crossOriginKeyword = null;