जब कोई REST API से डेटा प्राप्त करने का प्रयास कर रहा हो, तब कोई 'एक्सेस-कंट्रोल-अलाउंस-ओरिजिन' हेडर अनुरोधित संसाधन पर मौजूद नहीं होता है


465

मैं HP Alm के REST API से कुछ डेटा लाने की कोशिश कर रहा हूं। यह एक छोटे कर्ल स्क्रिप्ट के साथ बहुत अच्छी तरह से काम करता है - मुझे मेरा डेटा मिलता है।

अब जावास्क्रिप्ट के साथ, लाने और ES6 (अधिक या कम) एक बड़ा मुद्दा लगता है। मुझे यह त्रुटि संदेश प्राप्त होता रहता है:

Fetch API लोड नहीं कर सकता। प्रीफ़्लाइट अनुरोध का उत्तर एक्सेस कंट्रोल चेक पास नहीं करता: अनुरोधित संसाधन पर कोई 'एक्सेस-कंट्रोल-अनुमति-उत्पत्ति' हेडर मौजूद नहीं है। उत्पत्ति ' http://127.0.0.1:3000 ' इसलिए पहुंच की अनुमति नहीं है। प्रतिक्रिया में HTTP स्थिति कोड 501 था। यदि कोई अपारदर्शी प्रतिक्रिया आपकी आवश्यकताओं को पूरा करती है, तो संसाधन को अक्षम करने के लिए अनुरोध के मोड को 'नो-कोर्स' में सेट करें।

मैं समझता हूं कि ऐसा इसलिए है क्योंकि मैं उस डेटा को अपने लोकलहोस्ट के भीतर लाने की कोशिश कर रहा हूं और समाधान को कोर का उपयोग करना चाहिए। अब मुझे लगा कि मैंने वास्तव में ऐसा किया है, लेकिन किसी तरह यह या तो मेरी उपेक्षा करता है कि मैं हेडर में क्या लिखता हूं या समस्या कुछ और है?

तो, क्या कोई कार्यान्वयन मुद्दा है? क्या मैं गलत कर रहा हूँ? मैं दुर्भाग्य से सर्वर लॉग की जांच नहीं कर सकता। मैं वास्तव में यहाँ थोड़ा फंस गया हूँ।

function performSignIn() {

  let headers = new Headers();

  headers.append('Content-Type', 'application/json');
  headers.append('Accept', 'application/json');

  headers.append('Access-Control-Allow-Origin', 'http://localhost:3000');
  headers.append('Access-Control-Allow-Credentials', 'true');

  headers.append('GET', 'POST', 'OPTIONS');

  headers.append('Authorization', 'Basic ' + base64.encode(username + ":" + password));

  fetch(sign_in, {
      //mode: 'no-cors',
      credentials: 'include',
      method: 'POST',
      headers: headers
    })
    .then(response => response.json())
    .then(json => console.log(json))
    .catch(error => console.log('Authorization failed : ' + error.message));
}

मैं क्रोम का उपयोग कर रहा हूं। मैंने उस क्रोम कॉर्स प्लगिन का उपयोग करने का भी प्रयास किया, लेकिन फिर मुझे एक और त्रुटि संदेश मिल रहा है:

प्रतिक्रिया में 'एक्सेस-कंट्रोल-अलाउंस-ओरिजिन' हेडर का मूल्य वाइल्डकार्ड '*' नहीं होना चाहिए जब अनुरोध का क्रेडेंशियल मोड 'शामिल' हो। उत्पत्ति ' http://127.0.0.1:3000 ' इसलिए उपयोग की अनुमति नहीं है। XMLHttpRequest द्वारा शुरू किए गए अनुरोधों का क्रेडेंशियल मोड withCredentials विशेषता द्वारा नियंत्रित किया जाता है।

जवाबों:


820

यह उत्तर बहुत अधिक जमीन को कवर करता है, इसलिए इसे तीन भागों में विभाजित किया गया है:

  • "नो एक्सेस-कंट्रोल-अलाउंस-ओरिजिन हेडर" समस्याओं को हल करने के लिए कॉर्स प्रॉक्सी का उपयोग कैसे करें
  • कॉर्स प्रीफ़्लाइट से कैसे बचें
  • "एक्सेस-कंट्रोल-अलाउंस-ओरिजनल हैडर को वाइल्डकार्ड नहीं होना चाहिए" समस्याओं को कैसे ठीक करें

"नो एक्सेस-कंट्रोल-अलाउंस-ओरिजिन हेडर" समस्याओं को हल करने के लिए कॉर्स प्रॉक्सी का उपयोग कैसे करें

यदि आप सर्वर को नियंत्रित नहीं करते हैं तो आपका फ़्रंट जावास्क्रिप्ट कोड एक अनुरोध भेज रहा है, और उस सर्वर से प्रतिक्रिया के साथ समस्या सिर्फ आवश्यक Access-Control-Allow-Originहेडर की कमी है , आप अभी भी काम कर सकते हैं - एक के माध्यम से अनुरोध करके कॉर्स प्रॉक्सी। यह दिखाने के लिए कि यह कैसे काम करता है, पहले यहाँ कुछ कोड है जो एक CORS प्रॉक्सी का उपयोग नहीं करता है:

const url = "https://example.com"; // site that doesn’t send Access-Control-*
fetch(url)
.then(response => response.text())
.then(contents => console.log(contents))
.catch(() => console.log("Can’t access " + url + " response. Blocked by browser?"))

जिस कारण से catchब्लॉक हिट हो जाता है, ब्राउज़र उस कोड को उस प्रतिक्रिया तक पहुंचने से रोकता है जो वापस आती है https://example.com। और ब्राउज़र जो करता है उसका कारण है, प्रतिक्रिया की कमी हैAccess-Control-Allow-Origin प्रतिक्रिया शीर्ष लेख ।

अब, यहाँ एक ही उदाहरण है, लेकिन सिर्फ एक कोर प्रॉक्सी के साथ जोड़ा गया है:

const proxyurl = "https://cors-anywhere.herokuapp.com/";
const url = "https://example.com"; // site that doesn’t send Access-Control-*
fetch(proxyurl + url) // https://cors-anywhere.herokuapp.com/https://example.com
.then(response => response.text())
.then(contents => console.log(contents))
.catch(() => console.log("Can’t access " + url + " response. Blocked by browser?"))

नोट: यदि https://cors-anywhere.herokuapp.com नीचे या अनुपलब्ध है, जब आप इसे आज़माते हैं, तो नीचे देखें कि कैसे केवल 2-3 मिनट में हरोकू में अपना स्वयं का कोरस एनीवेयर सर्वर तैनात करें।

ऊपर दिया गया दूसरा कोड स्निपेट प्रतिक्रिया URL तक सफलतापूर्वक पहुंच सकता है क्योंकि इसे अनुरोध URL में ले जाकर https://cors-anywhere.herokuapp.com/https://example.com पर बदल दिया जाता है - फिर इसे प्रॉक्सी URL के साथ प्रीफ़िक्स करना- कारण बनता है उस प्रॉक्सी के माध्यम से प्राप्त करने का अनुरोध, जो तब:

  1. आगे के लिए अनुरोध https://example.com
  2. से प्रतिक्रिया प्राप्त करता है https://example.com
  3. जोड़ता है Access-Control-Allow-Originशीर्ष लेख को प्रतिक्रिया में ।
  4. उस प्रतिक्रिया को पास करता है, उस एडेड हेडर के साथ, रिक्वेस्टिंग फ्रंटेंड कोड पर।

ब्राउज़र तब फ्रंटएंड कोड को प्रतिक्रिया तक पहुंचने देता है, क्योंकि उस प्रतिक्रिया के साथ Access-Control-Allow-Origin प्रतिक्रिया हेडर के प्रतिक्रिया जो ब्राउज़र देखता है।

आप https://github.com/Rob--W/cors-anywhere/ से कोड का उपयोग करके आसानी से अपना प्रॉक्सी चला सकते हैं ।
तुम भी आसानी से हर दिन सिर्फ 2-3 मिनट में 5 आदेशों के साथ हरकू को अपना प्रॉक्सी तैनात कर सकते हैं:

git clone https://github.com/Rob--W/cors-anywhere.git
cd cors-anywhere/
npm install
heroku create
git push heroku master

उन आदेशों को चलाने के बाद, आप अपने स्वयं के CORS कहीं भी सर्वर पर चलेंगे, जैसे, https://cryptic-headland-94862.herokuapp.com/ । तो फिर अपने अनुरोध URL को https://cors-anywhere.herokuapp.comउपसर्ग करने के बजाय, अपने स्वयं के उदाहरण के लिए URL के बजाय उपसर्ग करें; जैसे, https://cryptic-headland-94862.herokuapp.com/https://example.com

इसलिए यदि आप https://cors-anywhere.herokuapp.com का उपयोग करने की कोशिश करने जाते हैं, तो आप पाते हैं कि यह नीचे है (जो कभी-कभी होगा), फिर एक हेरोकू खाता प्राप्त करने पर विचार करें (यदि आप पहले से ही नहीं हैं) और 2 लें या 3 मिनट के लिए कदम ऊपर Heroku पर अपने खुद के कोर सर्वर कहीं भी तैनात करने के लिए।

भले ही, आप अपना स्वयं का रन बनाते हैं या https://cors-anywhere.herokuapp.com या अन्य खुले प्रॉक्सी का उपयोग करते हैं , यह समाधान तब भी काम करता है, जब अनुरोध एक ऐसा हो जो ब्राउज़र को CORS प्रीफ़लाइट OPTIONSअनुरोध करने के लिए ट्रिगर करता है - क्योंकि उस स्थिति में, प्रॉक्सी प्री-लाइट को सफल बनाने के लिए आवश्यक हेडर Access-Control-Allow-Headersऔर Access-Control-Allow-Methodsहेडर भी वापस भेजती है ।


कॉर्स प्रीफ़्लाइट से कैसे बचें

प्रश्न में कोड एक CORS प्रीफ़्लाइट को ट्रिगर करता है - क्योंकि यह Authorizationहेडर भेजता है ।

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#Preflighted_requests

यहां तक ​​कि इसके बिना, Content-Type: application/jsonहेडर भी प्रीफ़्लाइट को ट्रिगर करेगा।

"प्रीफ़्लाइट" का क्या अर्थ है: इससे पहले कि ब्राउज़र POSTप्रश्न में कोड में कोशिश करता है , यह पहले OPTIONSसर्वर को एक अनुरोध भेजेगा - यह निर्धारित करने के लिए कि क्या सर्वर ऑप्ट-इन कर रहा है जिसमें क्रॉस-ओरिजिन प्राप्त करना POSTशामिल है जिसमें Authorizationऔर Content-Type: application/jsonहेडर शामिल हैं।

यह एक छोटे कर्ल स्क्रिप्ट के साथ बहुत अच्छा काम करता है - मुझे मेरा डेटा मिलता है।

इसके साथ ठीक से परीक्षण करने के लिए curl, आपको OPTIONSब्राउज़र द्वारा भेजे गए प्रीफ़्लाइट अनुरोध का अनुकरण करना चाहिए :

curl -i -X OPTIONS -H "Origin: http://127.0.0.1:3000" \
    -H 'Access-Control-Request-Method: POST' \
    -H 'Access-Control-Request-Headers: Content-Type, Authorization' \
    "https://the.sign_in.url"

https://the.sign_in.urlजो भी आपका वास्तविक sign_inURL है उसकी जगह।

ब्राउज़र को उस OPTIONSअनुरोध से जो प्रतिक्रिया देखने की आवश्यकता है, उसमें हेडर शामिल होना चाहिए:

Access-Control-Allow-Origin:  http://127.0.0.1:3000
Access-Control-Allow-Methods: POST
Access-Control-Allow-Headers: Content-Type, Authorization

यदि OPTIONSप्रतिक्रिया में उन हेडर शामिल नहीं हैं, तो ब्राउज़र वहीं रुक जाएगा और कभी POSTअनुरोध भेजने का प्रयास भी नहीं करेगा । इसके अलावा, प्रतिक्रिया के लिए HTTP स्थिति कोड एक 2xx होना चाहिए- आमतौर पर 200 या 204। यदि यह कोई अन्य स्थिति कोड है, तो ब्राउज़र वहीं बंद हो जाएगा।

प्रश्न में सर्वर OPTIONS501 स्थिति कोड के साथ अनुरोध का जवाब दे रहा है , जिसका अर्थ है कि यह इंगित करने की कोशिश कर रहा है कि यह OPTIONSअनुरोधों के लिए समर्थन को लागू नहीं करता है। अन्य सर्वर आमतौर पर इस मामले में 405 "विधि की अनुमति नहीं है" स्थिति कोड के साथ प्रतिक्रिया करते हैं।

तो आप कभी भी POSTउस सर्वर से अपने फ्रंटएंड जावास्क्रिप्ट कोड से सीधे अनुरोध करने में सक्षम नहीं होंगे, यदि सर्वर उस OPTIONSअनुरोध का जवाब 405 या 501 या 200 या 204 के अलावा किसी अन्य चीज के साथ देता है या यदि आवश्यक नहीं है। प्रतिक्रिया हेडर।

प्रश्न में मामले के लिए प्रीफ़्लाइट को ट्रिगर करने से बचने का तरीका होगा:

  • यदि सर्वर को Authorizationअनुरोध शीर्षलेख की आवश्यकता नहीं है, लेकिन इसके बजाय (उदाहरण के लिए) POSTअनुरोध के शरीर में या क्वेरी पैरामीटर के रूप में एम्बेडेड प्रमाणीकरण डेटा पर निर्भर है
  • अगर सर्वर को POSTशरीर के लिए Content-Type: application/jsonमीडिया प्रकार की आवश्यकता नहीं है, लेकिन इसके बजाय POSTशरीर को application/x-www-form-urlencodedएक पैरामीटर json(या जो भी) नाम के पैरामीटर के साथ स्वीकार किया जाता है, जिसका मान JSON डेटा है

"एक्सेस-कंट्रोल-अलाउंस-ओरिजनल हैडर को वाइल्डकार्ड नहीं होना चाहिए" समस्याओं को कैसे ठीक करें

मुझे एक और त्रुटि संदेश मिल रहा है:

प्रतिक्रिया में 'एक्सेस-कंट्रोल-अलाउंस-ओरिजिन' हेडर का मूल्य वाइल्डकार्ड '*' नहीं होना चाहिए जब अनुरोध का क्रेडेंशियल मोड 'शामिल' हो। उत्पत्ति ' http://127.0.0.1:3000 ' इसलिए उपयोग की अनुमति नहीं है। XMLHttpRequest द्वारा शुरू किए गए अनुरोधों का क्रेडेंशियल मोड withCredentials विशेषता द्वारा नियंत्रित किया जाता है।

क्रेडेंशियल शामिल करने वाले अनुरोध के लिए, ब्राउज़र आपके फ्रंटएंड जावास्क्रिप्ट कोड को प्रतिक्रिया तक पहुंचने नहीं देंगे यदि Access-Control-Allow-Originप्रतिक्रिया हेडर का मूल्य है *। उस मामले में मूल्य के बजाय आपके फ्रंटएंड कोड की उत्पत्ति से बिल्कुल मेल खाना चाहिए http://127.0.0.1:3000

देखें Credentialed अनुरोध और वाइल्डकार्ड MDN HTTP अभिगम नियंत्रण में (CORS) का लेख।

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

add_header Access-Control-Allow-Origin $http_origin

लेकिन यह सिर्फ एक उदाहरण है; अन्य (वेब) सर्वर सिस्टम मूल मूल्यों को प्रतिध्वनित करने के समान तरीके प्रदान करते हैं।


मैं क्रोम का उपयोग कर रहा हूं। मैंने उस क्रोम कॉर्स प्लगिन का उपयोग करने का भी प्रयास किया

Chrome क्रोम प्लग इन स्पष्ट रूप से केवल सरलता Access-Control-Allow-Origin: *से ब्राउज़र द्वारा देखे जाने वाले प्रतिक्रिया में हेडर इंजेक्ट करता है। यदि प्लगइन होशियार था, तो वह क्या कर रहा होगा, यह नकली Access-Control-Allow-Originप्रतिक्रिया हेडर के मूल्य को आपके फ्रंटेंड जावास्क्रिप्ट कोड के वास्तविक मूल में सेट कर रहा है http://127.0.0.1:3000

इसलिए उस प्लगइन का उपयोग करने से बचें, यहां तक ​​कि परीक्षण के लिए भी। यह सिर्फ एक व्याकुलता है। यदि आप परीक्षण करना चाहते हैं कि आपको सर्वर से क्या प्रतिक्रियाएं मिल रही हैं, जिसमें कोई ब्राउज़र उन्हें फ़िल्टर नहीं कर रहा है, तो आप curl -Hऊपर दिए अनुसार उपयोग करना बेहतर समझते हैं।


जहाँ तक fetch(…)सवाल में अनुरोध के लिए सीमांत जावास्क्रिप्ट कोड है :

headers.append('Access-Control-Allow-Origin', 'http://localhost:3000');
headers.append('Access-Control-Allow-Credentials', 'true');

उन लाइनों को हटा दें। Access-Control-Allow-*हेडर हैं प्रतिक्रिया हेडर। आप उन्हें अनुरोध में कभी नहीं भेजना चाहते। एकमात्र प्रभाव जो एक ब्राउज़र को ट्रिगर करने के लिए होगा वह है प्रीफ़्लाइट।


1
तो url कैसा लगेगा: 127.0.0.1:9999/127.0.0.1 c000 cors के साथ, है ना?
daniel.lozynski

आप का अपना स्वयं का उदाहरण चला रहे हैं github.com/Rob--W/cors-anywhere पर कोड 127.0.0.1:9999 और आप के लिए एक अनुरोध बनाना चाहते 127.0.0.1:5000 , हाँ
sideshowbarker

4
शानदार उत्तर, मेरा मुद्दा रिमोट सर्वर था, जो विकल्प के अनुरोधों का जवाब नहीं दे रहा था, इसलिए अनुरोधों और हेडर के बारे में जानने के बाद मुझे लगता है कि उम्र की तरह मैंने हेडर को हटाकर इसे हल किया Content-Typeऔर Access-Control-Allow-Origin- धन्यवाद!
मोरवेल

1
मुझे एक प्रॉक्सी का उपयोग करने का विचार पसंद नहीं है जब तक कि यह एक ऐसा नहीं है जिसे आप नियंत्रित करते हैं, अन्यथा आप एक अविश्वसनीय तीसरे पक्ष के माध्यम से डेटा प्राप्त कर रहे हैं और यह छेड़छाड़ के लिए खुला है, आदि
डेवमॉन्गोज

1
यह गहराई से और शानदार जवाब है, धन्यवाद, मैंने व्यक्तिगत रूप से जब परीक्षण किया था, तो ओपन-क्रोम अक्षम वेब सुरक्षा ध्वज के साथ किया गया था और यह काम किया था। open /Applications/Google\ Chrome.app --args --disable-web-security --user-data-dir
करुण

101

क्लाइंट URL और सर्वर URL पोर्ट नंबर सहित मेल नहीं खाते, तो यह त्रुटि होती है। इस मामले में आपको कॉर्स के लिए अपनी सेवा को सक्षम करने की आवश्यकता है जो कि क्रॉस ओरिजिनल रिसोर्स शेयरिंग है।

यदि आप एक स्प्रिंग रेस्ट सेवा की मेजबानी कर रहे हैं, तो आप इसे स्प्रिंग फ्रेमवर्क में ब्लॉग पोस्ट कोर सपोर्ट में पा सकते हैं ।

यदि आप एक Node.js सर्वर का उपयोग करके सेवा की मेजबानी कर रहे हैं तो

  1. Node.js सर्वर बंद करें।
  2. npm install cors --save
  3. अपने server.js के लिए निम्न पंक्तियाँ जोड़ें

    var cors = require('cors')
    
    app.use(cors()) // Use this after the variable declaration

4
बिना किसी मुद्दे के काम किया ... वसंत संसाधन लिंक के साथ बहुत मददगार .. बहुत बहुत धन्यवाद
राजेश एमबीएम

4
including the port number:(
स्कूटीसेज़

1
वास्तव में उपयोगी यू ने मेरा दिन बना दिया है
कुणाल पाल

पोर्ट संख्या मेरी जान बचाई
ashad

सरल जवाब कभी धन्यवाद :)
स्टैक्स

46

समस्या इसलिए उत्पन्न हुई क्योंकि आपने अपने फ्रंट-एंड में अनुरोध हेडर के रूप में निम्न कोड जोड़ा है :

headers.append('Access-Control-Allow-Origin', 'http://localhost:3000');
headers.append('Access-Control-Allow-Credentials', 'true');

वे शीर्ष लेख प्रतिक्रिया के हैं , अनुरोध के नहीं। तो उन्हें हटा दें, जिसमें लाइन भी शामिल है:

headers.append('GET', 'POST', 'OPTIONS');

आपके अनुरोध में 'सामग्री-प्रकार: अनुप्रयोग / json' था, इसलिए इसने ट्रिगर किया जिसे CORS प्रीफ़्लाइट कहा जाता है। इसके कारण ब्राउज़र ने विकल्प विधि के साथ अनुरोध भेजा। विस्तृत जानकारी के लिए कॉर्स प्रीफ्लाइट देखें ।
इसलिए आपके बैक-एंड में , आपको इस पूर्वनिर्धारित अनुरोध को संभालना होगा जिसमें प्रतिक्रिया शीर्षकों को शामिल करना होगा:

Access-Control-Allow-Origin : http://localhost:3000
Access-Control-Allow-Credentials : true
Access-Control-Allow-Methods : GET, POST, OPTIONS
Access-Control-Allow-Headers : Origin, Content-Type, Accept

बेशक, वास्तविक सिंटैक्स आपके बैक-एंड के लिए उपयोग की जाने वाली प्रोग्रामिंग भाषा पर निर्भर करता है।

आपके सामने के अंत में, यह इस तरह होना चाहिए:

function performSignIn() {
    let headers = new Headers();

    headers.append('Content-Type', 'application/json');
    headers.append('Accept', 'application/json');
    headers.append('Authorization', 'Basic ' + base64.encode(username + ":" +  password));
    headers.append('Origin','http://localhost:3000');

    fetch(sign_in, {
        mode: 'cors',
        credentials: 'include',
        method: 'POST',
        headers: headers
    })
    .then(response => response.json())
    .then(json => console.log(json))
    .catch(error => console.log('Authorization failed : ' + error.message));
}

4
यह शीर्ष उत्तर होना चाहिए - मैं वास्तव में कॉर्स को दरकिनार करने के विचार को नापसंद करता हूं, विशेष रूप से इसे तीसरे पक्ष के माध्यम से रूट करके।
डेवमोन्गोज

हे, क्या हैडर () कृपया?
मित्सु

@mitsu यदि आप लाइन को संदर्भित करते हैं: हेडर = नए हेडर (); ऊपर, तब यह http एपीआई या रिस्पॉन्स हेडर के साथ कार्रवाई करने के लिए एपीआई का एक इंटरफ़ेस है। विवरण प्राप्त करने के लिए डेवलपर.mozilla.org/en-US/docs/Web/API/Headers पर जाएं और साथ ही इसका उपयोग करने के उदाहरण भी देखें।
लेक्स सॉफ्ट

1
स्पष्ट और सटीक उत्तर .. इसका तार्किक और बिल्कुल समस्या का समाधान। - Thx
धम्मिका

7

मेरे मामले में, मैं नीचे दिए गए समाधान का उपयोग करता हूं

सामने का छोर या कोणीय

post(
    this.serverUrl, dataObjToPost,
    {
      headers: new HttpHeaders({
           'Content-Type':  'application/json',
         })
    }
)

बैक-एंड (मैं php का उपयोग करता हूं)

header("Access-Control-Allow-Origin: http://localhost:4200");
header('Access-Control-Allow-Methods: GET, POST, OPTIONS');
header("Access-Control-Allow-Headers: Content-Type, Authorization");

$postdata = file_get_contents("php://input");
$request = json_decode($postdata);
print_r($request);

2

बस मेरे दो सेंट ... "कोई हेडर" समस्याओं के आसपास पाने के लिए एक कॉर्स प्रॉक्सी का उपयोग कैसे करें के बारे मेंAccess-Control-Allow-Origin

आप में से जो बैकप में php के साथ काम कर रहे हैं, उनके लिए "CORS प्रॉक्सी" तैनात करना उतना ही सरल है:

  1. निम्नलिखित सामग्री के साथ 'no-cors.php' नामक एक फ़ाइल बनाएँ:

    $URL = $_GET['url']; echo json_encode(file_get_contents($URL)); die();

  2. अपने सामने के छोर पर, ऐसा कुछ करें:

    fetch('https://example.com/no-cors.php' + '?url=' + url) .then(response=>{*/Handle Response/*})



1

का उपयोग कर dataType: 'jsonp'मेरे लिए काम किया।

   async function get_ajax_data(){
       var _reprojected_lat_lng = await $.ajax({
                                type: 'GET',
                                dataType: 'jsonp',
                                data: {},
                                url: _reprojection_url,
                                error: function (jqXHR, textStatus, errorThrown) {
                                    console.log(jqXHR)
                                },
                                success: function (data) {
                                    console.log(data);

                                    // note: data is already json type, you
                                    //       just specify dataType: jsonp
                                    return data;
                                }
                            });


 } // function               

1

मेरे मामले में, वेब सर्वर ने "विकल्प" विधि को रोका

विकल्प विधि के लिए अपने वेब सर्वर की जाँच करें

मैं "webtier" का उपयोग कर रहा हूँ

/www/webtier/domains/[domainname]/config/fmwconfig/components/OHS/VCWeb1/httpd.conf

<IfModule mod_rewrite.c>
  RewriteEngine on
  RewriteCond %{REQUEST_METHOD} ^OPTIONS
  RewriteRule .* . [F]
</IfModule>

में बदलो

<IfModule mod_rewrite.c>
  RewriteEngine off
  RewriteCond %{REQUEST_METHOD} ^OPTIONS
  RewriteRule .* . [F]
</IfModule>

0

मैं स्प्रिंग रेस्ट के साथ काम कर रहा था, और मैंने इसे WebMvcConfigurer में AllowedMethods को जोड़कर हल किया।

@Value( "${app.allow.origins}" )
    private String allowOrigins;    
@Bean
public WebMvcConfigurer corsConfigurer() {
            System.out.println("allow origin: "+allowOrigins);
            return new WebMvcConfigurerAdapter() {
                @Override
                public void addCorsMappings(CorsRegistry registry) {
                    registry.addMapping("/**")
                    //.allowedOrigins("http://localhost")
                    .allowedOrigins(allowOrigins)
                    .allowedMethods("PUT", "DELETE","GET", "POST");
                }
            };
        }

-1

मुझे यह त्रुटि मेरे स्थानीय पर मिल रही थी। मैंने विजुअल स्टूडियो को एक व्यवस्थापक के रूप में चलाया और इसे हल किया।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.