2015-09-28 12 views
13

मेरे पास node.js सर्वर 0.10.12 और express.js 4.8.5 है। Node.js वेब सर्वर है, इसमें ओपनलेयर 3.9.0 शामिल हैं।node.js और geoserver CORS

जियोसरवर 2.1.3 डब्लूएमएस परत की सेवा करता है। बाद में, मैं वेक्टर परतों को लागू करूंगा।

केवल एक ही मार्ग (अनुक्रमणिका पृष्ठ के लिए)

var routes = require('./routes/index'); 

index.js

var express = require('express'); 
var router = express.Router(); 

router.get('/', function(req, res, next) { 
    res.render('index', { title: 'openlayers3 testing', head: 'Welcome' }); 
    next(); 
}); 

module.exports = router; 

शामिल तो app.js

var routes = require('./routes/index');//explained above 

var app = express(); 

// view engine setup 
app.set('views', path.join(__dirname, 'views')); 
app.set('view engine', 'ejs'); 

app.use(favicon()); 
app.use(logger('dev')); 
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded()); 
app.use(cookieParser()); 
app.use(express.static(path.join(__dirname, 'public'))); 

है मैं CORS

निम्नलिखित जोड़ा जाता है
app.use(function (req, res, next) { 
    res.setHeader('Access-Control-Allow-Origin', '*'); 
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE'); 
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type'); 
    res.setHeader('Access-Control-Allow-Credentials', true); 
    next(); 
}); 


app.get('/', routes); 

और index.ejs में मैं इस

var ait = new ol.layer.Tile({ 
extent: textent, 
source: new ol.source.TileWMS({ 
    url: 'http://localhost:8080/geoserver/mymap/wms', 
    crossOrigin: 'anonymous', 
    attributions: [new ol.Attribution({ 
    html: '&copy; ' +'<a href="http://www.geo.admin.ch/internet/geoportal/' +'en/home.html">' +'National parks/geo.admin.ch</a>' 
    })], 
    params: {'LAYERS': 'mymap:planet_osm_polygon, mymap:planet_osm_line, mymap:planet_osm_roads, mymap:planet_osm_point'}, 
    serverType: 'geoserver' 
}) 

})

की तरह मेरे Geoserver WMS स्तर सेट और मैं त्रुटि

Image from origin 'http://localhost:8080' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:5550' is therefore not allowed access.

मैं विविधताओं का एक बहुत कोशिश की मिल मुझे ऑनलाइन मिला। मैंने app.use(express.static(path.join(__dirname, 'public'))); से पहले कोड डाला। मैंने इसे index.js के router.get के अंदर रखा। अब तक कुछ भी नहीं। मैं समझने में असफल रहा कि क्या गलत है।

धन्यवाद

नोटों

यह इंटरनेट एक्सप्लोरर 11. कोई त्रुटि नहीं में काम करता है और मैं वास्तव में फ़ायरफ़ॉक्स 30 में परत

कोई त्रुटि नहीं देख सकते हैं, लेकिन मैं परत

नहीं देख सकते हैं

क्रोम 45 में मैं परत नहीं देख सकता और मुझे वह त्रुटि मिलती है

+1

क्या आपने देखा - https://stackoverflow.com/a/25025579/4640499? –

+1

@ स्लेविन आप गलत पक्ष पर सीओआरएस जोड़ रहे हैं। आप नोड ऐप से अपने जियोसरवर से कनेक्ट कर रहे हैं। तो, आपके Geoserver में CORS को जोड़ा जाना चाहिए, नोड ऐप पर नहीं। – hassansin

+0

@ जोनाटावाकर हाँ, धन्यवाद, मैं इस – slevin

उत्तर

7

भूल जाएंयह एक बड़ा सुरक्षा जोखिम है। इसके बजाय अनुरोध डोमेन का नाम सेट करें और डोमेन की श्वेतसूची बनाए रखें।

मुझे लगता है कि यह स्पष्ट है कि आपका मिडलवेयर हेडर को http://localhost:8080 प्रतिक्रिया में सेट नहीं करता है। नेटवर्क पैनल, फायरबग, आदि पर शीर्षलेखों की जांच करें ... और इसे डीबग करें। How to debug the http response headers from a HTTP call

फ़ायरफ़ॉक्स सीओआरएस त्रुटियों को हमेशा ठीक से संभाल नहीं करता है, इसलिए आपको क्रोम भी जांचना चाहिए। इंटरनेट एक्सप्लोरर दूसरों से भिन्न रूप से काम करता है: https://stackoverflow.com/a/22450633/607033 इसलिए यह उसी उत्पत्ति के रूप में http://localhost:5550 स्वीकार करता है, यही कारण है कि आपका बग्गी कोड msie में काम करता है। मेजबान फ़ाइल को जोड़कर कस्टम नामित डोमेन का उपयोग करने का प्रयास करें, और मुझे यकीन है कि आपको एमसीआई से भी त्रुटि संदेश मिलेगा।

संपादित करें - टिप्पणी

उदाहरण कोड के साथ मुख्य समस्या के साथ पकड़ने के लिए, कि webapp (डोमेन: http://localhost:5550) अपने CORS हेडर देता है।चूंकि वेबपैप ब्राउज़र से geoserver (http://localhost:8080) तक पहुंचना चाहता है, इसलिए geoserver को वेबपैप तक पहुंच प्रदान करनी चाहिए। तो geoserver वेबपैड के बजाय सीओआरएस शीर्षलेख वापस करना चाहिए।

स्लेविन के अनुसार वर्तमान में वे भूगर्भ के संस्करण के साथ संभव नहीं है। एक रिवर्स प्रॉक्सी जोड़ने और वेबएप के उपफोल्डर के तहत भू-सर्वर की सेवा करने के लिए एक संभावित कामकाज या भूगर्भ के उपफोल्डर के तहत वेबपैप की सेवा करें। इस तरह वे दोनों एक ही मूल होगा। अलग-अलग डोमेन के साथ चिपकने का एक और विकल्प, लेकिन रिवर्स प्रॉक्सी का उपयोग कर कोरर्स हेडर को भू-सूचना प्रतिक्रिया में जोड़ें।

+0

क्रोम कंसोल 'localhost: 8080' से नक्शे के लिए '200' स्थिति देता है, लेकिन कोई आकार नहीं। और सीओआरएस त्रुटि। फायरबग भी '200' स्थिति देता है, एक आकार है, लेकिन कोई त्रुटि नहीं है। मुझे लगता है कि आपका मतलब क्या नहीं है "मुझे लगता है कि यह स्पष्ट है कि आपका मिडलवेयर हेडर को http: // localhost: 8080 प्रतिक्रिया में सेट नहीं करता है। हेडर को नेटवर्क पैनल, फायरबग आदि पर जांचें ... और इसे डीबग करें। "। यदि आप अपना उत्तर अपडेट करना चाहते हैं और मुझे समझाएं, तो यह बहुत अच्छा होगा, क्योंकि स्पष्ट रूप से मैं ढेर हूं। – slevin

+0

मैं भी लाल 'http: // jonathanmh.com/कैसे-सक्षम-cors-in-express-js-node-js/'और' http://www.tamas.io/node-jsexpress-cors- कार्यान्वयन/', और लागू करने की कोशिश की, लेकिन कोई भाग्य नहीं। Thakns – slevin

+0

@slevin आपके त्रुटि संदेश के अनुसार अभिगम नियंत्रण शीर्षलेख प्रतिक्रिया में दिखाई नहीं देते हैं और इससे समस्या का कारण बनता है। मैंने फायरफॉक्स के साथ फ़ायरफ़ॉक्स में प्रतिक्रिया शीर्षलेखों को जांचने के तरीके के बारे में एक लिंक जोड़ा, लेकिन आप देव उपकरण का उपयोग कर किसी भी मौजूदा ब्राउज़र के साथ ऐसा कर सकते हैं। – inf3rno

-2

स्थानीय फ़ाइलों

google-chrome --disable-web-security --allow-file-access-from-files 

इस के लिए अक्षम सुरक्षा के साथ google-chrome शुरू करने और अनुमति देने के लिए उपयोग कर सकते प्रयास करें एक ही मूल नीति को निष्क्रिय और स्थानीय फ़ाइलों को एक दूसरे का उपयोग करने की अनुमति देगा।

आपको स्थिरता और सुरक्षा चेतावनी मिल सकती है, आप विकास के लिए इससे बच सकते हैं।

संबंधित मुद्दे