Heroku पर एक एक्सप्रेस / Node.js आवेदन के लिए CORS REST अनुरोध की अनुमति दें

Question

मैंने नोड.जेएस के लिए एक्सप्रेस फ्रेमवर्क पर एक REST API लिखा है जो क्रोम, और URL बार आदि में js कंसोल से अनुरोधों के लिए काम करता है, मैं अब इसे दूसरे ऐप के अनुरोधों के लिए काम करने की कोशिश कर रहा हूं, एक अलग डोमेन (कोर)।

जावास्क्रिप्ट सामने के छोर से स्वचालित रूप से किया गया पहला अनुरोध / एपीआई / खोज है? Uri =, और "प्रीफ़लाइट" विकल्प अनुरोध पर विफल हो रहा है।

अपने एक्सप्रेस ऐप में, मैं कोर हेडर जोड़ रहा हूँ, का उपयोग कर:

var allowCrossDomain = function(req, res, next) {
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
    res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With');

    // intercept OPTIONS method
    if ('OPTIONS' == req.method) {
      res.send(200);
    }
    else {
      next();
    }
};

तथा:

app.configure(function () {
  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(app.router);
  app.use(allowCrossDomain);
  app.use(express.static(path.join(application_root, "public")));
  app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
});

क्रोम कंसोल से मुझे ये हेडर मिलते हैं:

अनुरोध URL: http: //furious-night-5419.herokuapp.com/api/search; uri = http% 3A% 2F% 2Flocalhost% 3A5000% 2Fcollections% 2F1% %FFdocuments% 2F1

अनुरोध विधि: विकल्प

स्थिति कोड: 200 ठीक है

प्रमुखों का अनुरोध करें

Accept:*/*
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:origin, x-annotator-auth-token, accept
Access-Control-Request-Method:GET
Connection:keep-alive
Host:furious-night-5419.herokuapp.com
Origin:http://localhost:5000
Referer:http://localhost:5000/collections/1/documents/1
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_4) AppleWebKit/536.5 (KHTML, like Gecko) Chrome/19.0.1084.56 Safari/536.5

क्वेरी स्ट्रिंग पैरामीटर

uri:http://localhost:5000/collections/1/documents/1

रिस्पांस हेडर

Allow:GET
Connection:keep-alive
Content-Length:3
Content-Type:text/html; charset=utf-8
X-Powered-By:Express

क्या यह एपीआई अनुप्रयोग द्वारा भेजे जा रहे उचित हेडर की कमी की तरह दिखता है?

धन्यवाद।

Comments

मुझे यह त्रुटि उस कोड में मिल रही है जिसे मैंने नहीं लिखा था, लेकिन मैं OPTIONSविधि के लिए एक हैंडलर की आवश्यकता को नहीं समझता । क्या कोई मुझे यह समझने में मदद कर सकता है कि POSTदोनों POST और OPTIONS विधि को संभालने के बजाय सिर्फ विधि को क्यों नहीं हैंडल किया जाए ?

— यूलिसिस अल्व्स

PATCHयदि आप PUTसंसाधन को अद्यतन करने के बजाय इसका उपयोग करना चाहते हैं, तो इसमें शामिल करना चाहते हैं

— डैनी

Answer 1

मैंने आपका कोड एक साफ ExpressJS ऐप पर चबाया है और यह ठीक काम करता है।

app.use(allowCrossDomain)कॉन्फ़िगर फ़ंक्शन के शीर्ष पर जाने का प्रयास करें ।

Comments

इसका कारण यह था क्योंकि आपको इसे app.use(app.router);चीयर्स से पहले परिभाषित करने की आवश्यकता है !

— मीकल

मेरे मामले में, जब req.method == 'ऑप्टिमाइज़' होने के बाद res.send (200) भेजने के बाद अगले POST को नहीं बुलाया जा रहा है। क्या मुझे कुछ और याद आ रहा है?

— एल्डो

2 एल्डो: कोड की आवश्यकता। क्या आप कुछ हेडर भूल गए हैं? यदि आपका क्लाइंट आपके सर्वर को सही ढंग से प्रीफ़लाइट ऑप्‍शन अनुरोध देने के बाद POST नहीं भेज रहा है, तो डेवलपर टूल कंसोल की जाँच करने का प्रयास करें। WebKit वेब निरीक्षक के कंसोल में इस तरह की त्रुटियों को लॉग करता है।

— ओलेगास

@ConnorLeech बहुत अच्छा। मैं ऊपर के रूप में AllowCrossDomain दृष्टिकोण कर रहा था और उस हेडर mgmt से निपटने के लिए थक गया था। इसके अलावा - चूँकि हमें केवल देव के लिए CORS की आवश्यकता थी, इसलिए यह समझ में नहीं आ रहा था कि जो कुछ चल रहा था, उसके लिए इतने सारे चक्रों को समर्पित किया जाए। खुशी है कि इसे आसानी से अनुमति देने के लिए नोड.जेएस समर्थन है।

— स्टीवन

@ConnorLeech मुझे लगता है कि आपको अपनी टिप्पणी को एक उत्तर के रूप में जोड़ना चाहिए ... एक इलाज की तरह काम करता है, और यह अच्छा है और सरल है

— ड्राम्ब्रेवर

Answer 2

कुकीज़ का समर्थन करने के लिए आपको इस लाइन की आवश्यकता होती है xhr.withCredentials = true;

mdn डॉक्स xhr.withCredentials

एक्सप्रेस सर्वर में इस ब्लॉक को अन्य सभी से पहले जोड़ें

`app.all('*', function(req, res, next) {
     var origin = req.get('origin'); 
     res.header('Access-Control-Allow-Origin', origin);
     res.header("Access-Control-Allow-Headers", "X-Requested-With");
     res.header('Access-Control-Allow-Headers', 'Content-Type');
     next();
});`

Answer 3

मैं इसे केवल एक उत्तर के रूप में जोड़ रहा हूं क्योंकि मूल पोस्ट को एक टिप्पणी के रूप में रखा गया था और जैसे कि यह आपके द्वारा इस पृष्ठ पर पहली बार जाने पर वास्तव में आपके द्वारा अनदेखी की गई थी।

जैसा कि @ConnorLeech ऊपर दिए गए स्वीकृत उत्तर के लिए अपनी टिप्पणी में इंगित करता है, एक बहुत ही आसान npm पैकेज है जिसे आश्चर्यजनक रूप से नहीं कहा जाता है, cors । इसका उपयोग उतना ही सरल है var cors = require('cors'); app.use(cors());(फिर से, श्री लीच के उत्तर से क्राइबर्ड) और इसे अपने डॉक्स में उल्लिखित के रूप में एक अधिक स्पष्ट फैशन में लागू किया जा सकता है। ।

यह भी इंगित करने योग्य हो सकता है कि मैं जिस मूल टिप्पणी का उल्लेख ऊपर करता हूं वह 2014 में की गई थी। यह अब 2019 है और npm पैकेज के github पृष्ठ को देख रहे हैं कि हाल ही में नौ दिन पहले रेपो को अपडेट किया गया था।

Answer 4

अधिकांश लोगों के लिए यह सवाल ब्राउज़ करने का मामला नहीं हो सकता है, लेकिन मेरे पास यह सटीक समस्या थी और समाधान संबंधित नहीं था CORS ।

यह बताता है कि JSON वेब टोकन रहस्य stringपर्यावरण चर में परिभाषित नहीं किया गया था, इसलिए टोकन पर हस्ताक्षर नहीं किया जा सकता है। यह किसी भी POSTअनुरोध के कारण होता है जो एक टाइमआउट प्राप्त करने के लिए एक टोकन की जांच या हस्ताक्षर करने पर निर्भर करता है और एक 503त्रुटि वापस करता है, जो ब्राउज़र को बता रहा है कि इसमें कुछ गलत है CORS, जो यह नहीं है। हरोकू में पर्यावरण चर जोड़ने से समस्या हल हो गई।

मुझे उम्मीद है इससे किसी को सहायता मिलेगी।

Comments

हां मेरे साथ यही समस्या थी। क्या आप अधिक विशिष्ट हो सकते हैं कि आपने समस्या को कैसे हल किया। मैं अभी भी विकास में हूँ और Express.js w / नोड कॉर्स पैकेज पर चल रहा हूँ।

— एलन

@alan मैं अपने आवेदन में टोकन को सत्यापित करने के वादे का उपयोग कर रहा था, कुछ अगर JWT रहस्य को परिभाषित नहीं किया जाता है, तो वादा कभी भी हल नहीं होगा, यहां कोड मैं उपयोग कर रहा था यदि आपको और संदर्भ की आवश्यकता है।

— कैटब्रोनी २ ''१

प्रतिक्रिया देने के लिये धन्यवाद। मैं ओवर कोड देखूंगा। गुप्त रूप से मैं मानता हूं कि आप दूसरी निजी कुंजी के बारे में बात कर रहे हैं। मैं oauth2 का उपयोग कर रहा हूं।

— एलन

मैं जोड़ूंगा कि कोई भी असफल वादा इस भ्रामक त्रुटि का उत्पादन करेगा! मुझे एक नोड संस्करण का उपयोग किए जाने के बारे में स्पष्ट होना चाहिए था या फिर मेरे डेटाबेस कॉल (मोंगो) बस लटकाए गए थे और केवल एक चीज जो ब्राउज़र मुझे बता सकता था वह थी 503 और फिर कुछ Cors संबंधित खटास। यह त्रुटि वास्तव में मुझे सबसे लंबे समय तक उलझन में थी जैसा कि मैं app.use(cors());जा रहा था ।

— अल्फ़ान्यूमेरिक