javascript - प्रीफ़्लाइट अनुरोध का जवाब एक्सेस कंट्रोल चेक पास नहीं करता है




ajax http (14)

मुझे अमेज़न वेब सेवा पर REST API कॉल करने के लिए ngResource का उपयोग करके यह त्रुटि मिल रही है:

XMLHttpRequest http://server.apiurl.com:8000/s/login?login=facebook लोड नहीं कर सकता। प्रीफ़्लाइट अनुरोध का उत्तर एक्सेस कंट्रोल चेक पास नहीं करता है: अनुरोधित संसाधन पर कोई 'एक्सेस-कंट्रोल-अनुमति-उत्पत्ति' हेडर मौजूद नहीं है। उत्पत्ति ' http: // localhost ' इसलिए पहुँच की अनुमति नहीं है। त्रुटि 405

सेवा:

socialMarkt.factory('loginService', ['$resource', function($resource){    
    var apiAddress = "http://server.apiurl.com:8000/s/login/";
    return $resource(apiAddress, { login:"facebook", access_token: "@access_token" ,facebook_id: "@facebook_id" }, {
                getUser: {method:'POST'}
            });
}]);

नियंत्रक:

[...]
loginService.getUser(JSON.stringify(fbObj)),
                function(data){
                    console.log(data);
                },
                function(result) {
                    console.error('Error', result.status);
                }
[...]

मैं Chrome का उपयोग कर रहा हूं, और मुझे नहीं पता कि इस समस्या को ठीक करने के लिए और क्या करना है। मैंने मूल localhost से हेडर स्वीकार करने के लिए सर्वर भी कॉन्फ़िगर किया है।


जावास्क्रिप्ट XMLHttpRequest और Fetch समान-मूल नीति का पालन करते हैं। तो, XMLHttpRequest या Fetch का उपयोग करने वाला एक वेब एप्लिकेशन केवल HTTP अनुरोधों को अपने स्वयं के डोमेन पर बना सकता है।

स्रोत: https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

आपको अपने सर्वर की ओर से Access-Control-Allow-Origin: * HTTP हेडर भेजना होगा।

यदि आप अपाचे को अपने HTTP सर्वर के रूप में उपयोग कर रहे हैं तो आप इसे अपनी अपाचे विन्यास फाइल में इस तरह जोड़ सकते हैं:

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

मोड_हेडर्स अपाचे में डिफ़ॉल्ट रूप से सक्षम है, हालांकि, आप यह सुनिश्चित करना चाहते हैं कि यह चलकर सक्षम हो जाए:

 a2enmod headers

यदि आप क्रोम-एक्सटेंशन लिख रहे हैं

आपको अपने डोमेन (एस) की अनुमतियों को manifest.json में जोड़ना होगा।

"permissions": [
   "http://example.com/*",
   "https://example.com/*"
]

PHP में आप शीर्ष लेख जोड़ सकते हैं:

<?php
header ("Access-Control-Allow-Origin: *");
header ("Access-Control-Expose-Headers: Content-Length, X-JSON");
header ("Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS");
header ("Access-Control-Allow-Headers: *");
...

अजगर फ्लास्क सर्वर के लिए, आप क्रॉस डोमेन अनुरोधों को सक्षम करने के लिए फ्लास्क-कोर्सेस प्लगइन का उपयोग कर सकते हैं।

देखें: https://flask-cors.readthedocs.io/en/latest/


इस त्रुटि का एक बहुत ही सामान्य कारण यह हो सकता है कि होस्ट API ने http विधि (जैसे PUT) के लिए अनुरोध मैप किया था और API क्लाइंट API को एक अलग http विधि (जैसे POST या GET) का उपयोग करके कॉल कर रहा है


उन लोगों के लिए एपीआई गेटवे के साथ लैंबडा इंटीग्रेटेड प्रॉक्सी का उपयोग कर रहे हैं। आपको अपने लंबो फ़ंक्शन को कॉन्फ़िगर करने की आवश्यकता है जैसे कि आप सीधे अपने अनुरोध सबमिट कर रहे हैं, जिसका अर्थ है कि फ़ंक्शन को प्रतिक्रिया हेडर ठीक से सेट करना चाहिए। (यदि आप कस्टम लंबो कार्यों का उपयोग कर रहे हैं, तो इसे एपीआई गेटवे द्वारा नियंत्रित किया जाएगा।)

//In your lambda's index.handler():
exports.handler = (event, context, callback) => {
     //on success:
     callback(null, {
           statusCode: 200,
           headers: {
                "Access-Control-Allow-Origin" : "*"
           }
     }
}

क्रोम सुरक्षा अक्षम करें। क्रोम शॉर्टकट पर राइट-क्लिक करें - गुण -> लक्ष्य, इस "C: \ Program Files (x86) \ Google \ Chrome \ Application \ chrome.exe" को पेस्ट करें --disable-web-security-user डाटा-dir = "c: / chromedev"


जब कोर्स की बात आती है तो कुछ चेतावनी दी जाती हैं। सबसे पहले, यह वाइल्डकार्ड * अनुमति नहीं देता है, लेकिन मुझे इस पर पकड़ नहीं है कि मैंने इसे कहीं पढ़ा है और मुझे अब लेख नहीं मिल सकता है।

यदि आप किसी भिन्न डोमेन से अनुरोध कर रहे हैं तो आपको मूल हेडर जोड़ने की आवश्यकता है। Access-Control-Allow-Origin: www.other.com

यदि आप ऐसे अनुरोध कर रहे हैं जो POST / PUT / PATCH जैसे सर्वर संसाधनों को प्रभावित करते हैं, और यदि माइम प्रकार निम्न application/x-www-form-urlencoded , multipart/form-data , या text/plain ब्राउज़र से स्वचालित रूप से अलग है। यदि यह अनुमति देता है तो सर्वर के साथ जांच करने के लिए पूर्व-उड़ान विकल्प का अनुरोध करें।

तो आपके एपीआई / सर्वर को इन विकल्प अनुरोधों को तदनुसार संभालने की आवश्यकता है, आपको उचित access control headers साथ प्रतिक्रिया करने की आवश्यकता है और http प्रतिक्रिया स्थिति कोड 200 होना चाहिए।

हेडर कुछ इस तरह के होने चाहिए, उन्हें अपनी आवश्यकताओं के लिए समायोजित करें: Access-Control-Allow-Methods: GET, POST, PUT, PATCH, POST, DELETE, OPTIONS Access-Control-Allow-Headers: Content-Type Access-Control-Max-Age: 86400 अधिकतम आयु शीर्ष लेख महत्वपूर्ण है, मेरे मामले में, यह इसके बिना काम नहीं करेगा, मुझे लगता है कि ब्राउज़र को "एक्सेस अधिकार" कितने समय के लिए मान्य है, इसकी जानकारी चाहिए।

इसके अलावा, यदि आप एक अलग डोमेन से application/json माइम के साथ उदाहरण के लिए POST अनुरोध कर रहे हैं, तो आपको पहले उल्लेखित मूल हेडर जोड़ने की भी आवश्यकता है, इसलिए यह इस तरह दिखाई देगा:

Access-Control-Allow-Origin: www.other.com Access-Control-Allow-Methods: GET, POST, PUT, PATCH, POST, DELETE, OPTIONS Access-Control-Allow-Headers: Content-Type Access-Control-Max-Age: 86400

जब पूर्व उड़ान सफल हो जाती है और सभी आवश्यक जानकारी प्राप्त हो जाती है तो आपका वास्तविक अनुरोध किया जाएगा।

आम तौर पर, प्रारंभिक या पूर्व-उड़ान अनुरोध में जो भी Access-Control हेडर अनुरोध किए जाते हैं, उसे काम करने के लिए प्रतिक्रिया में दिया जाना चाहिए।

इस लिंक पर एमडीएन डॉक्स में एक अच्छा उदाहरण है, और आपको इस एसओ पोस्ट को भी देखना चाहिए


मुझे इस समस्या का सामना करना पड़ा है जब DNS सर्वर 8.8.8.8 (Google के) पर सेट किया गया था। वास्तव में, समस्या राउटर में थी, मेरे आवेदन ने स्थानीय रूप से (मेरे विशेष मामले के लिए) Google के माध्यम से सर्वर से जुड़ने की कोशिश की। मैंने 8.8..8. have..8 निकाला है और इस मुद्दे को हल किया है। मुझे पता है कि इस मुद्दे को कोर सेटिंग्स द्वारा हल किया गया है, लेकिन शायद किसी को मेरे समान ही परेशानी होगी


मुझे लगता है कि क्रोम से कोर को अक्षम करना अच्छा तरीका नहीं है , क्योंकि यदि आप इसे आयनिक में उपयोग कर रहे हैं, तो निश्चित रूप से मोबाइल बिल्ड में समस्या फिर से उठेगी।

अपने बैकएंड में फिक्स करना बेहतर है।

सबसे पहले हेडर में, आपको सेट करना होगा-

  • हेडर ('एक्सेस-कंट्रोल-अनुमति-उत्पत्ति: *');
  • हेडर ('हेडर सेट एक्सेस-कंट्रोल-अलाउंस-हेडर्स: "ओरिजिन, एक्स-रिक्वेस्ट-विद, कंटेंट-टाइप, एक्सेप्ट");

और अगर एपीआई GET और POST दोनों के रूप में व्यवहार कर रहा है तो अपने हेडर में भी सेट करें-

if ($ _SERVER ['REQUEST_METHOD'] == 'विकल्प') {अगर (isset ($ _ SERVER ['HTTP_ACCESS_CONTROL_REQUEST_METHOD]]) हेडर ("एक्सेस-कंट्रोल-अलाउंस-मेथड्स: GET, पोस्ट, विकल्प");
यदि (isset ($ _ SERVER ['HTTP_ACCESS_CONTROL_REQUEST_HEADERS))) हेडर ("एक्सेस-कंट्रोल-अलाउंस-हेडर्स:"
{$ _SERVER ['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}); बाहर निकलें (0);}


मेरी Apache VirtualHost config फाइल में, मैंने निम्नलिखित पंक्तियों को जोड़ा है:

Header always set Access-Control-Allow-Origin "*"
Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT"
Header always set Access-Control-Max-Age "1000"
Header always set Access-Control-Allow-Headers "x-requested-with, Content-Type, origin, authorization, accept, client-security-token"

RewriteEngine On
RewriteCond %{REQUEST_METHOD} OPTIONS
RewriteRule ^(.*)$ $1 [R=200,L]

मैं अपलोड के लिए AWS sdk का उपयोग कर रहा हूं, ऑनलाइन कुछ समय बिताने के बाद मैं इस धागे पर ठोकर खाई। @lsimoneau 45581857 की 45581857 यह पता चलता है कि ठीक वही बात हो रही थी। मैंने बस क्षेत्र के विकल्प को संलग्न करके अपनी बाल्टी पर इस क्षेत्र के लिए मेरे अनुरोध को इंगित किया और यह काम किया।

<web-app>
  <filter>
      <filter-name>cross-origin</filter-name>
      <filter-class>org.eclipse.jetty.servlets.CrossOriginFilter</filter-class>
  </filter>
  <filter-mapping>
      <filter-name>cross-origin</filter-name>
      <url-pattern>/*</url-pattern>
  </filter-mapping>
</web-app>

हमारी टीम कभी-कभी Vue, axios और C # WebApi का उपयोग करके इसे देखती है। एंडपॉइंट पर एक रूट विशेषता जोड़कर आप इसे हिट करने का प्रयास कर रहे हैं जो हमारे लिए इसे ठीक करता है।

[Route("ControllerName/Endpoint")]
[HttpOptions, HttpPost]
public IHttpActionResult Endpoint() { }

जियोसर्वर के स्टैंडअलोन वितरण में जेटी एप्लिकेशन सर्वर शामिल है। जियोसर्वर का उपयोग करने के लिए अपने स्वयं के डोमेन के बाहर जावास्क्रिप्ट अनुप्रयोगों को अनुमति देने के लिए क्रॉस-ऑरिजनल रिसोर्स शेयरिंग (कोर) सक्षम करें।

वेबपेप्स / जियोसर्वर / WEB-INF / web.xml से निम्नलिखित <filter> और <filter-mapping> को हटा दें:

 const s3 = new AWS.S3({
 accessKeyId: config.awsAccessKeyID,
 secretAccessKey: config.awsSecretAccessKey,
 region: 'eu-west-2'  // add region here });







http-status-code-405