मैं जावास्क्रिप्ट के माध्यम से क्रॉस-डोमेन POST अनुरोध कैसे भेजूं?


568

मैं जावास्क्रिप्ट के माध्यम से क्रॉस-डोमेन POST अनुरोध कैसे भेजूं?

नोट्स - यह पृष्ठ को ताज़ा नहीं करना चाहिए, और मुझे बाद में प्रतिक्रिया को हथियाने और पार्स करने की आवश्यकता है।


मैं उपयोग के मामले के बारे में थोड़ा जानना चाहता हूं जो आपको ऐसा करने की कोशिश करता है। क्या आप इसके बारे में कुछ बता सकते हैं?
मोकेलर 14

मूल रूप से मैं एक स्क्रिप्ट पर काम कर रहा हूं, जिसमें प्रसंस्करण के लिए HTML फ़ाइल से दूसरे सर्वर पर कुछ पाठ भेजने की आवश्यकता है।

3
क्या आप एक प्रॉक्सी सेट कर सकते हैं जो सर्वर-साइड पर करता है और बस आपकी स्क्रिप्ट को परिणाम देता है? या क्या इसे 100% जावास्क्रिप्ट होने की आवश्यकता है?
साशा चोडगोव

जवाबों:


382

अपडेट: जारी रखने से पहले सभी को CORS पर html5rocks ट्यूटोरियल पढ़ना और समझना चाहिए । यह समझना आसान है और बहुत स्पष्ट है।

यदि आप सर्वर को पोस्ट किया जा रहा है, तो सर्वर पर प्रतिक्रिया हेडर सेट करके "क्रॉस-ऑरिजनल रिसोर्स शेयरिंग मानक" का लाभ उठाएं। इस उत्तर की चर्चा इस सूत्र में अन्य उत्तरों में की गई है, लेकिन मेरी राय में यह बहुत स्पष्ट नहीं है।

संक्षेप में यहाँ बताया गया है कि आप किस तरह से पार डोमेन POST को.com/1.html से लेकर in.com/postHere.php (उदाहरण के रूप में PHP का उपयोग करके) को पूरा करते हैं। नोट: आपको केवल Access-Control-Allow-Originएनओएन OPTIONSअनुरोधों के लिए सेट करने की आवश्यकता है - यह उदाहरण हमेशा छोटे कोड स्निपेट के लिए सभी हेडर सेट करता है।

  1. PostHere.php सेटअप में निम्नलिखित हैं:

    switch ($_SERVER['HTTP_ORIGIN']) {
        case 'http://from.com': case 'https://from.com':
        header('Access-Control-Allow-Origin: '.$_SERVER['HTTP_ORIGIN']);
        header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
        header('Access-Control-Max-Age: 1000');
        header('Access-Control-Allow-Headers: Content-Type, Authorization, X-Requested-With');
        break;
    }

    यह आपकी स्क्रिप्ट को क्रॉस डोमेन POST, GET और विकल्प बनाने की अनुमति देता है। यह स्पष्ट हो जाएगा क्योंकि आप पढ़ना जारी रखते हैं ...

  2. अपने क्रॉस डोमेन POST को JS (jQuery उदाहरण) से सेट करें:

    $.ajax({
        type: 'POST',
        url: 'https://to.com/postHere.php',
        crossDomain: true,
        data: '{"some":"json"}',
        dataType: 'json',
        success: function(responseData, textStatus, jqXHR) {
            var value = responseData.someKey;
        },
        error: function (responseData, textStatus, errorThrown) {
            alert('POST failed.');
        }
    });

जब आप चरण 2 में POST करते हैं, तो आपका ब्राउज़र सर्वर को "विकल्प" विधि भेजेगा। यह ब्राउज़र द्वारा "स्निफ" है यह देखने के लिए कि क्या सर्वर आपके साथ ठंडा है या नहीं। सर्वर "पहुंच-नियंत्रण-अनुमति-उत्पत्ति" के साथ ब्राउज़र को जवाब देता है कि वह ब्राउज़र को अपना POST बताता है। GET = ORIGIN यदि अनुरोध " http://from.com " या " https://from.com " से उत्पन्न हुआ है । चूंकि सर्वर इसके साथ ठीक है, ब्राउज़र 2 बार अनुरोध करेगा (इस समय एक पोस्ट)। यह अच्छा है कि आप अपने ग्राहक को वह सामग्री प्रकार सेट करें जो वह भेज रहा है - इसलिए आपको उसे भी अनुमति देने की आवश्यकता होगी।

एमडीएन में HTTP एक्सेस कंट्रोल के बारे में एक शानदार लिखा गया है , जो पूरे प्रवाह के काम करने के तरीके के बारे में विस्तार से बताता है। उनके डॉक्स के अनुसार, इसे "उन ब्राउज़र में काम करना चाहिए जो क्रॉस-साइट XMLHttpRequest का समर्थन करते हैं"। हालांकि यह थोड़ा भ्रामक है, क्योंकि मुझे लगता है कि केवल आधुनिक ब्राउज़र ही क्रॉस डोमेन POST की अनुमति देते हैं। मैंने केवल सफारी, क्रोम, एफएफ 3.6 के साथ इस काम को सत्यापित किया है।

ऐसा करने पर निम्नलिखित बातों का ध्यान रखें:

  1. आपके सर्वर को प्रति ऑपरेशन 2 अनुरोधों को संभालना होगा
  2. आपको सुरक्षा निहितार्थ के बारे में सोचना होगा। 'पहुंच-नियंत्रण-अनुमति-उत्पत्ति: *' जैसे कुछ करने से पहले सावधान रहें
  3. यह मोबाइल ब्राउज़र पर काम नहीं करेगा। मेरे अनुभव में वे क्रॉस डोमेन POST की अनुमति नहीं देते हैं। मैंने Android, iPad, iPhone का परीक्षण किया है
  4. FF <3.6 में एक बहुत बड़ा बग है जहां अगर सर्वर एक गैर 400 प्रतिक्रिया कोड देता है और एक प्रतिक्रिया निकाय है (उदाहरण के लिए सत्यापन त्रुटियां), तो FF 3.6 को प्रतिक्रिया शरीर नहीं मिलेगा। यह गधे का बहुत बड़ा दर्द है, क्योंकि आप अच्छी REST प्रथाओं का उपयोग नहीं कर सकते। यहां बग देखें (इसे jQuery के तहत दायर किया गया है, लेकिन मेरा अनुमान इसकी FF बग है - FF4 में तय किया गया लगता है)।
  5. हमेशा शीर्षकों को वापस लौटाएं, न कि केवल वैकल्पिक अनुरोधों पर। FF को POST की प्रतिक्रिया में इसकी आवश्यकता है।

क्या यह उदाहरण के लिए html वापस कर सकता है? मुझे html वापस करने की आवश्यकता है और कुछ काम नहीं कर रहा है ...
denis_n

हाँ, आप सक्षम होना चाहिए। यह कभी नहीं की कोशिश की। आपका सर्वर 200 लौटा रहा है? क्या आपका सर्वर OPTION और POST अनुरोधों पर शीर्ष लेख लौटा रहा है? मैंने इस बारे में अधिक विस्तार के साथ अपना जवाब अपडेट किया है। सुनिश्चित करें कि आपका सर्वर सही सामग्री-प्रकार हेडर के साथ भी जवाब दे रहा है (जैसे टेक्स्ट / html)। मेरा पुनर्संयोजन google क्रोम का उपयोग करना है, पृष्ठ पर क्लिक करें> तत्व का निरीक्षण करें। नेटवर्क टैब पर क्लिक करें, और POST और प्रतिक्रिया देखें। आपको जानकारी देनी चाहिए कि क्या गलत हो रहा है।
rynop

मैंने यह कोशिश की है, लेकिन अभी भी अनुरोध 400 Bad Requestपर मिलता हूं OPTIONS। और firefoxके दूसरे अनुरोध में POSTकभी नहीं किया जाता है। :(
ज़ैन शेख

क्या आपके केस स्टेटमेंट में आपके स्थानीय मशीन को कॉलआउट करने का कोई तरीका है? या क्या आपको केवल इस मामले में अनुमति उत्पत्ति के लिए * का उपयोग करना है।
टोड वंस

1
यह 4 साल पहले अंतिम बार संपादित किया गया था - क्या यह अब मोबाइल ब्राउज़र पर काम करेगा?
फ्रैंकपिन्टो

121

यदि आप रिमोट सर्वर को नियंत्रित करते हैं, तो आपको संभवतः कोर का उपयोग करना चाहिए, जैसा कि इस उत्तर में वर्णित है ; यह IE8 और ऊपर, और FF, GC, और Safari के सभी हाल के संस्करणों में समर्थित है। (लेकिन IE8 और 9 में, CORS आपको अनुरोध में कुकीज़ भेजने की अनुमति नहीं देगा।)

इसलिए, यदि आप दूरस्थ सर्वर को नियंत्रित नहीं करते हैं , या यदि आपको IE7 का समर्थन करना है, या यदि आपको कुकीज़ की आवश्यकता है और आपको IE8 / 9 का समर्थन करना है, तो आप शायद एक iframe तकनीक का उपयोग करना चाहते हैं।

  1. एक अद्वितीय नाम के साथ एक आइफ्रेम बनाएं। (iframes पूरे ब्राउज़र के लिए एक वैश्विक नामस्थान का उपयोग करते हैं, इसलिए ऐसा नाम चुनें जिसे कोई अन्य वेबसाइट उपयोग नहीं करेगी।)
  2. छिपे हुए आदानों के साथ एक फार्म का निर्माण, iframe को लक्षित करना।
  3. फॉर्म जमा करें।

यहाँ नमूना कोड है; मैंने इसे IE6, IE7, IE8, IE9, FF4, GC11, S5 पर परीक्षण किया।

function crossDomainPost() {
  // Add the iframe with a unique name
  var iframe = document.createElement("iframe");
  var uniqueString = "CHANGE_THIS_TO_SOME_UNIQUE_STRING";
  document.body.appendChild(iframe);
  iframe.style.display = "none";
  iframe.contentWindow.name = uniqueString;

  // construct a form with hidden inputs, targeting the iframe
  var form = document.createElement("form");
  form.target = uniqueString;
  form.action = "http://INSERT_YOUR_URL_HERE";
  form.method = "POST";

  // repeat for each parameter
  var input = document.createElement("input");
  input.type = "hidden";
  input.name = "INSERT_YOUR_PARAMETER_NAME_HERE";
  input.value = "INSERT_YOUR_PARAMETER_VALUE_HERE";
  form.appendChild(input);

  document.body.appendChild(form);
  form.submit();
}

सावधान रहें! आप सीधे POST की प्रतिक्रिया नहीं पढ़ पाएंगे, क्योंकि iframe एक अलग डोमेन पर मौजूद है। फ़्रेम को विभिन्न डोमेन से एक दूसरे के साथ संवाद करने की अनुमति नहीं है; यह समान-मूल नीति है

यदि आप दूरस्थ सर्वर को नियंत्रित करते हैं, लेकिन आप CORS का उपयोग नहीं कर सकते हैं (जैसे कि आप IE8 / IE9 पर हैं और आपको कुकीज़ का उपयोग करने की आवश्यकता है), तो समान-मूल नीति के आसपास काम करने के तरीके हैं, उदाहरण के लिए window.postMessageऔर / या का उपयोग करके कई पुस्तकालयों में से एक आपको पुराने ब्राउज़र में क्रॉस-डोमेन क्रॉस-फ़्रेम संदेश भेजने की अनुमति देता है:

यदि आप दूरस्थ सर्वर को नियंत्रित नहीं करते हैं, तो आप POST, अवधि की प्रतिक्रिया नहीं पढ़ सकते हैं। यह अन्यथा सुरक्षा समस्याओं का कारण होगा।


2
आपको कुछ के लिए form.target सेट करना होगा, अन्यथा ब्राउज़र आपकी साइट से फ़ॉर्म एक्शन URL पर नेविगेट करेगा। इसके अलावा, स्ट्रिंग को अद्वितीय होने की आवश्यकता है; यदि समान नाम का उपयोग करके अन्य फ़्रेम या विंडो हैं, तो फॉर्म आपके आइफ्रेम के बजाय उस विंडो पर पोस्ट कर सकता है। लेकिन यह कितना अनूठा है? शायद बहुत नहीं। क्लोबिंग की संभावनाएं बहुत छोटी हैं। कंधे उचकाने की क्रिया
दान Fabulich

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

1
+1 - यह सबसे अच्छा समाधान है जो मैंने पाया है अगर आपके पास सर्वर तक पहुंच नहीं है
जेम्स लॉन्ग

1
@VojtechB नहीं, यह सुरक्षा छेद होगा।
डैन फेबुलिच

1
@Andrus आप पोस्ट का परिणाम पढ़ सकते हैं, लेकिन केवल अगर आप सर्वर को नियंत्रित करते हैं! उस उत्तर में देखें, यह कहता है "प्रेषक [ग्राहक] पर एक्स करें, रिसीवर [सर्वर] पर वाई करें।" यदि आप रिसीवर / सर्वर को नियंत्रित नहीं करते हैं, तो आप Y नहीं कर सकते हैं, और इसलिए आप POST का परिणाम नहीं पढ़ सकते हैं।
डैन फेबुलिच

48
  1. एक iFrame बनाएँ,
  2. हिडन इनपुट्स के साथ इसमें एक फॉर्म डालें,
  3. प्रपत्र की कार्रवाई URL पर सेट करें,
  4. दस्तावेज़ में iframe जोड़ें
  5. फॉर्म जमा करें

स्यूडोकोड

 var ifr = document.createElement('iframe');
 var frm = document.createElement('form');
 frm.setAttribute("action", "yoururl");
 frm.setAttribute("method", "post");

 // create hidden inputs, add them
 // not shown, but similar (create, setAttribute, appendChild)

 ifr.appendChild(frm);
 document.body.appendChild(ifr);
 frm.submit();

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


4
वास्तव में, यह थोड़ा गलत है, क्योंकि ifr.appendChild (frm); काम नहीं करेगा। iframe एक विंडो ऑब्जेक्ट का संदर्भ है, और इसके लिए appendChild विधि मौजूद नहीं है। आपको पहले iframe में डॉक्यूमेंट नोड को हथियाना होगा। इसके लिए ब्राउज़र में काम करने के लिए फ़ीचर डिटेक्शन की आवश्यकता होती है।
राकेश पाई

धन्यवाद। इस मामले के बारे में इन उपयोगी लिंक को मिला: bindzus.wordpress.com/2007/12/24/… developer.apple.com/internet/webcontent/iframe.html
डायमंड स्कैचम

19
मुसीबत! Iframe में प्राप्त प्रतिक्रिया एक अलग डोमेन पर होती है, इसलिए मुख्य विंडो की उस तक कोई पहुंच नहीं है, और न ही iframe की मुख्य विंडो तक पहुंच है। तो यह समाधान केवल POST करने के लिए अच्छा लगता है, लेकिन आप इसके बाद की प्रतिक्रिया को पार्स नहीं कर सकते हैं :(
14

2
जावास्क्रिप्ट फ़ंक्शन की प्रतिक्रिया के बॉडी टैग में एक ऑनलोड स्थापित करने का प्रयास करें जो प्रतिक्रिया स्ट्रिंग के साथ माता-पिता में एक फ़ंक्शन को कॉल करता है।
लू फ्रैंको

यह जवाब मेरे काम नहीं आया; मैंने अपनी भिन्नता नीचे पोस्ट की है।
डैन फेबुलिच

24

इसे सरल रखें:

  1. क्रॉस-डोमेन POST:
    उपयोगcrossDomain: true,

  2. पेज को रिफ्रेश नहीं करना चाहिए:
    नहीं, यह पेज को रिफ्रेश नहींकरेगा क्योंकि सर्वर द्वारा रिस्पॉन्स वापस भेजे जाने परsuccessयाerrorasync कॉलबैक कहा जाएगा।


उदाहरण लिपि:

$.ajax({
        type: "POST",
        url: "http://www.yoururl.com/",
        crossDomain: true,
        data: 'param1=value1&param2=value2',
        success: function (data) {
            // do something with server response data
        },
        error: function (err) {
            // handle your error logic here
        }
    });

8
crossDomain: trueअजीब तरह से वास्तविक क्रॉस-डोमेन अनुरोधों के साथ कुछ भी नहीं करना है। यदि अनुरोध क्रॉस-डोमेन है, तो jquery इसे स्वचालित रूप से सही पर सेट करता है।
केविन बी

16

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

पीएचपी:

header('Access-Control-Allow-Origin: *');

उदाहरण के लिए, Drupal के xmlrpc.php कोड में आप ऐसा करेंगे:

function xmlrpc_server_output($xml) {
    $xml = '<?xml version="1.0"?>'."\n". $xml;
    header('Connection: close');
    header('Content-Length: '. strlen($xml));
    header('Access-Control-Allow-Origin: *');
    header('Content-Type: application/x-www-form-urlencoded');
    header('Date: '. date('r'));
    // $xml = str_replace("\n", " ", $xml); 

    echo $xml;
    exit;
}

यह संभवतः एक सुरक्षा समस्या पैदा करता है, और आपको यह सुनिश्चित करना चाहिए कि आप अनुरोध को सत्यापित करने के लिए उचित उपाय करें।



6
  1. सीएसएस शैली में दो छिपे हुए आइफ्रेम बनाएं ("प्रदर्शन: कोई नहीं;" जोड़ें)। अपने डोमेन पर किसी चीज़ के लिए अपना दूसरा iframe पॉइंट बनाएं।

  2. एक छिपा हुआ फ़ॉर्म बनाएं, लक्ष्य के साथ "पोस्ट" करने के लिए इसकी विधि सेट करें = अपना पहला iframe, और वैकल्पिक रूप से "मल्टीपार्ट / फॉर्म-डेटा" के लिए सेट करें (मैं सोच रहा हूं कि आप POST करना चाहते हैं क्योंकि आप चित्रों की तरह मल्टीपार्ट डेटा भेजना चाहते हैं ?)

  3. तैयार होने पर, फॉर्म सबमिट करें () पोस्ट करें।

  4. यदि आप जावास्क्रिप्ट को वापस करने के लिए अन्य डोमेन प्राप्त कर सकते हैं जो iframes ( http://softwareas.com/cross-domain-communication-with-iframes ) के साथ क्रॉस-डोमेन कम्युनिकेशन करेंगे, तो आप भाग्य में हैं, और आप प्रतिक्रिया पर कब्जा कर सकते हैं भी।

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


6

एक और महत्वपूर्ण बात ध्यान दें !!! में उदाहरण है कि यह कैसे उपयोग करने के लिए वर्णित ऊपर

$.ajax({
    type     : 'POST',
    dataType : 'json', 
    url      : 'another-remote-server',
    ...
});

JQuery 1.6 और निचले में क्रॉस-डोमेन XHR के साथ एक बग है। फायरबग के अनुसार विकल्प के अलावा कोई अनुरोध नहीं भेजा गया था। कोई पोस्ट नहीं। बिल्कुल भी।

5 घंटे का परीक्षण / मेरे कोड को ट्यून किया। रिमोट सर्वर (स्क्रिप्ट) पर बहुत सारे हेडर जोड़ना। बिना किसी प्रभाव के। लेकिन बाद में, मैंने 1.6.4 में JQuery के लेबर को अपडेट किया है, और सब कुछ एक आकर्षण की तरह काम करता है।


व्हूप्स, ओपेरा 10.61 में नहीं। ऐसा करने का मेरा अंतिम निर्णय मेरे डोमेन पर PHP प्रॉक्सी का उपयोग करना था।
बासटैलर

आपने PHP प्रॉक्सी का उपयोग कैसे किया? क्या आप मेरा मार्गदर्शन कर सकते हैं?
ज़ोरान777

नीचे दिए गए उत्तर देखें, जैसे कि इवान डर्स्ट
बेसटेलर

5

यदि आप ASP.NET MVC वातावरण में JQuery AJAX के साथ ऐसा करना चाहते हैं, तो इन चरणों का पालन करें: (यह इस धागे पर प्रस्तुत समाधान का सारांश है )

मान लें कि "caller.com" (किसी भी वेबसाइट हो सकती है) को "server.com" (एक ASP.net MVC एप्लिकेशन) पर पोस्ट करना होगा

  1. "Server.com" ऐप के Web.config में निम्न अनुभाग जोड़ें:

      <httpProtocol>
          <customHeaders>
              <add name="Access-Control-Allow-Origin" value="*" />
              <add name="Access-Control-Allow-Headers" value="Content-Type" />
              <add name="Access-Control-Allow-Methods" value="POST, GET, OPTIONS" />
          </customHeaders>
      </httpProtocol>
  2. "Server.com" पर, हमारे पास नियंत्रक (जिसे "होम" कहा जाता है) पर निम्नलिखित कार्रवाई होगी, जिस पर हम पोस्टिंग करेंगे:

    [HttpPost]
    public JsonResult Save()
    {
        //Handle the post data...
    
        return Json(
            new
            {
                IsSuccess = true
            });
    }
  3. फिर "caller.com" से, एक फॉर्म (html आईडी "formId" के साथ) से "server.com" के रूप में डेटा पोस्ट करें:

    $.ajax({
            type: "POST",
            url: "http://www.server.com/home/save",
            dataType: 'json',
            crossDomain: true,
            data: $(formId).serialize(),
            success: function (jsonResult) {
               //do what ever with the reply
            },
            error: function (jqXHR, textStatus) {
                //handle error
            }
        });

4

एक और तरीका है (html5 सुविधा का उपयोग करके)। आप उस अन्य डोमेन पर होस्ट किए गए प्रॉक्सी iframe का उपयोग कर सकते हैं, आप उस iframe को पोस्टमासेज का उपयोग करके संदेश भेजते हैं, फिर उस iframe POST अनुरोध (उसी डोमेन पर) कर सकते हैं और पोस्टमासेज को मूल विंडो में वापस भेज सकते हैं।

प्रेषक। com पर जनक

var win = $('iframe')[0].contentWindow

function get(event) {
    if (event.origin === "http://reciver.com") {
        // event.data is response from POST
    }
}

if (window.addEventListener){
    addEventListener("message", get, false)
} else {
    attachEvent("onmessage", get)
}
win.postMessage(JSON.stringify({url: "URL", data: {}}),"http://reciver.com");

rerver.com पर iframe

function listener(event) {
    if (event.origin === "http://sender.com") {
        var data = JSON.parse(event.data);
        $.post(data.url, data.data, function(reponse) {
            window.parent.postMessage(reponse, "*");
        });
    }
}
// don't know if we can use jQuery here
if (window.addEventListener){
    addEventListener("message", listener, false)
} else {
    attachEvent("onmessage", listener)
}

में संबंधित सवाल नहीं है stackoverflow.com/questions/38940932/... । क्या आपके नमूने के आधार पर कुछ प्लगइन या जेनेरिक फ़ंक्शन बनाना संभव है?
एंड्रस

@ और शायद कुछ इस तरह की बात है। gith.github.com/jcubic/26f806800abae0db9a0dfccd88cf6f3c
jcubic

इस कोड को रिसीवर पृष्ठ को संशोधित करने की आवश्यकता होती है। यदि रिसीवर पृष्ठों को संशोधित नहीं किया जा सकता है तो प्रतिक्रिया कैसे पढ़ें?
एंड्रस

@ और इसके लिए आपको ajax रिक्वेस्ट भेजने के लिए आपको recever.com iframe तक पहुंच की आवश्यकता नहीं है। बिना iframe के कोई रिक्वेस्ट नहीं होगी।
जकुबिक १४'१६ को १c:

3

उच्च स्तर .... आपको अपने सर्वर पर एक cname सेटअप करने की आवश्यकता है ताकि other-serve.your-server.com other-verver.com पर इंगित किया जा सके।

आपका पृष्ठ गतिशील रूप से एक अदृश्य iframe बनाता है, जो अन्य-server.com में आपके परिवहन के रूप में कार्य करता है। फिर आपको JS को अपने पेज से दूसरे-server.com पर संचार करना होगा और कॉल बैक करना होगा जो डेटा को आपके पेज पर वापस कर देगा।

संभव है, लेकिन आपके-server.com और other-server.com से समन्वय की आवश्यकता है


रीडायरेक्ट करने के लिए CNAME का उपयोग करने के बारे में भी नहीं सोचा था। अच्छा निर्णय! मुझे अभी तक यह कोशिश करनी है लेकिन मैं यह मान रहा हूं कि CNAME ब्राउज़र को उसी साइट के साथ इंटरैक्ट करने की सोच कर धोखा देगा? मैं अमेज़ॅन एस 3 को पोस्ट करने के लिए इसका उपयोग करने जा रहा हूं इसलिए मैं इस काम की उम्मीद कर रहा हूं।
स्पेंसरएलीट

1
मैं नहीं देखता कि यह कैसे कुछ हल करेगा। एक अलग उपडोमेन को पार करने में अलग डोमेन को पार करने के समान समस्याएं हैं।
ऑक्टोपस

3

मुझे लगता है कि सबसे अच्छा तरीका है कि XMLHttpRequest (जैसे $ .ajax), $ .post () को jQuery में से एक के साथ क्रॉस-ऑरिजनल रिसोर्स शेयरिंग पॉलीफ़िल्स https://github.com/Modernizr/Modernizr/wiki/HTML5- का उपयोग करें। क्रॉस ब्राउज़र Polyfills # विकि-CORS


2

यह एक पुराना सवाल है, लेकिन कुछ नई तकनीक किसी की मदद कर सकती हैं।

यदि आपके पास अन्य सर्वर तक प्रशासनिक पहुंच है, तो आप अपने क्रॉस-डोमेन POST को पूरा करने के लिए ओपनसोर्स फोर्ज प्रोजेक्ट का उपयोग कर सकते हैं। फोर्ज एक क्रॉस-डोमेन जावास्क्रिप्ट XmlHttpRequest आवरण प्रदान करता है जो फ्लैश के कच्चे सॉकेट एपीआई का लाभ उठाता है। पोस्ट भी टीएलएस पर किया जा सकता है।

जिस कारण से आप पोस्ट कर रहे हैं, उस सर्वर तक आपको प्रशासनिक पहुंच की आवश्यकता है क्योंकि आपको एक क्रॉस-डोमेन नीति प्रदान करनी होगी जो आपके डोमेन से पहुंच की अनुमति देती है।

http://github.com/digitalbazaar/forge


2

मुझे पता है कि यह एक पुराना सवाल है, लेकिन मैं अपना दृष्टिकोण साझा करना चाहता था। मैं एक प्रॉक्सी के रूप में, बहुत आसान और सुसंगत है। Ph.pp नामक एक php पेज बनाएँ, और निम्नलिखित कोड जोड़ें:

<?

function post($url, $data) {
$header = array("User-Agent: " . $_SERVER["HTTP_USER_AGENT"], "Content-Type: application/x-www-form-urlencoded");
$curl = curl_init();
curl_setopt($curl, CURLOPT_URL, $url);
curl_setopt($curl, CURLOPT_HTTPHEADER, $header);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($curl, CURLOPT_POST, 1);
curl_setopt($curl, CURLOPT_POSTFIELDS, $data);
$response = curl_exec($curl);
curl_close($curl);
return $response;
}

$url = "your cross domain request here";
$data = $_SERVER["QUERY_STRING"];
echo(post($url, $data));

फिर, अपने js (jQuery यहाँ) में:

$.ajax({
type: 'POST',
url: 'submit.php',
crossDomain: true,
data: '{"some":"json"}',
dataType: 'json',
success: function(responseData, textStatus, jqXHR) {
    var value = responseData.someKey;
},
error: function (responseData, textStatus, errorThrown) {
    alert('POST failed.');
}
});

1

YQL कस्टम टेबल + JS XHR के साथ संभव होना चाहिए, इस पर एक नज़र डालें: http://developer.yahoo.com/yql/guide/index.html

मैं इसका उपयोग कुछ क्लाइंट साइड (js) html स्क्रैपिंग करने के लिए करता हूं, ठीक काम करता है (मेरे पास एक पूर्ण ऑडियो प्लेयर है, जिसमें इंटरनेट / प्लेलिस्ट / लिरिक्स / अंतिम fm informations पर खोज की जाती है, सभी क्लाइंट js + YQL)


1

कॉर्स आपके लिए है। CORS "क्रॉस ओरिजिनल रिसोर्स शेयरिंग" है, क्रॉस डोमेन रिक्वेस्ट भेजने का एक तरीका है। अब XMLHttpRequest2 और Fetch API दोनों को सपोर्ट करें, और यह POST और GET रिक्वेस्ट दोनों को भेज सकता है।

लेकिन इसकी सीमाएँ हैं। किसी को भी एक्सेस-कंट्रोल-अलाउंस- ओरिजनल क्लेम करने की आवश्यकता है , और इसे '*' पर सेट नहीं किया जा सकता है।

और यदि आप चाहते हैं कि कोई भी उत्पत्ति आपसे अनुरोध भेज सके, तो आपको JSONP की आवश्यकता है ( Access-Control-Allow-Origin सेट करने की आवश्यकता है , लेकिन '*' हो सकता है)

बहुत सारे अनुरोध के तरीके के लिए यदि आप नहीं जानते कि कैसे चुनाव करना है, तो मुझे लगता है कि आपको ऐसा करने के लिए एक पूर्ण कार्यात्मक घटक की आवश्यकता है। मुझे एक साधारण घटक का परिचय दें https://github.com/Joker-Jelly/catta


यदि आप आधुनिक ब्राउज़र (> IE9, Chrome, FF, Edge, आदि) का उपयोग कर रहे हैं, तो आपको एक सरल लेकिन सौंदर्य घटक https://github.com/Joker-Jelly/catta का उपयोग करने की सलाह देते हैं । इसकी कोई निर्भरता नहीं है, कम 3KB की तुलना में, और यह एक ही घातक सैंपल सिंटैक्स और विकल्पों के साथ Fetch, AJAX और JSONP का समर्थन करता है।

catta('./data/simple.json').then(function (res) {
  console.log(res);
});

यह आपकी परियोजना को आयात करने के लिए सभी तरह से समर्थन करता है, जैसे ईएस 6 मॉड्यूल, कॉमनजस और यहां तक <script>कि HTML में भी ।


1

यदि आपके पास क्रॉस डोमेन सर्वर तक पहुंच है और सर्वर साइड पर कोई कोड परिवर्तन नहीं करना चाहते हैं, तो आप 'xdomain' नामक लाइब्रेरी का उपयोग कर सकते हैं।

यह काम किस प्रकार करता है:

चरण 1: सर्वर 1: xdomain लाइब्रेरी को शामिल करें और क्रॉस डोमेन को दास के रूप में कॉन्फ़िगर करें:

<script src="js/xdomain.min.js" slave="https://crossdomain_server/proxy.html"></script>

चरण 2: क्रॉस डोमेन सर्वर पर, एक प्रॉक्सी। Html फ़ाइल बनाएं और सर्वर 1 को एक मास्टर के रूप में शामिल करें:

proxy.html:
<!DOCTYPE HTML>
<script src="js/xdomain.min.js"></script>
<script>
  xdomain.masters({
    "https://server1" : '*'
  });
</script>

चरण 3:

अब, आप सर्वर 1 से एंडपॉइंट के रूप में प्रॉक्सी.html को AJAX कॉल कर सकते हैं। यह कोर अनुरोध को बायपास करता है। पुस्तकालय आंतरिक रूप से iframe समाधान का उपयोग करता है जो क्रेडेंशियल्स और सभी संभावित तरीकों के साथ काम करता है: GET, POST आदि।

क्वेरी अजाक्स कोड:

$.ajax({
        url: 'https://crossdomain_server/proxy.html',
        type: "POST",
        data: JSON.stringify(_data),
        dataType: "json",
        contentType: "application/json; charset=utf-8"
    })
    .done(_success)
    .fail(_failed)
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.