jQuery AJAX ক্রস ডোমেন

Question

এখানে দুটি পৃষ্ঠাগুলি, টেস্ট.পিএইচপি এবং টেস্টেরের.পিএফপি রয়েছে।

test.php

<script src="scripts/jq.js" type="text/javascript"></script>
<script>
    $(function() {
        $.ajax({url:"testserver.php",
            success:function() {
                alert("Success");
            },
            error:function() {
                alert("Error");
            },
            dataType:"json",
            type:"get"
        }
    )})
</script>

testserver.php

<?php
$arr = array("element1",
             "element2",
             array("element31","element32"));
$arr['name'] = "response";
echo json_encode($arr);
?>

এখন আমার সমস্যা: এই দুটি ফাইলই যখন একই সার্ভারে থাকে (লোকালহোস্ট বা ওয়েব সার্ভার হয়) তখন এটি কাজ করে এবং alert("Success")ডাকা হয়; যদি এটি বিভিন্ন সার্ভারে থাকে, যার অর্থ ওয়েব সার্ভারে testserver.php এবং লোকালহোস্টে test.php, এটি কাজ করছে না এবং alert("Error")কার্যকর করছে । এমনকি এজাক্সের URL টি http://domain.com/path/to/file/testserver.php এ পরিবর্তিত হয়

Comments

লোকেরা থেমে আছে। ক্রস ডোমেন জাভাস্ক্রিপ্ট কীভাবে কল করে স্ট্যাকওভারফ্লো.com

— আবদুল মুনিম

: আমি এই প্রশ্নের জন্য একটি উত্তর এখানে লিখেছিলেন jQuery এর AJAX সঙ্গে ক্রস ডোমেইন HTML পাতায় লোড করা হচ্ছে - গত এক সমর্থন HTTPS

— jherax

Answer 1

জেএসএনপি ব্যবহার করুন ।

JQuery:

$.ajax({
     url:"testserver.php",
     dataType: 'jsonp', // Notice! JSONP <-- P (lowercase)
     success:function(json){
         // do stuff with json (in this case an array)
         alert("Success");
     },
     error:function(){
         alert("Error");
     }      
});

পিএইচপি:

<?php
$arr = array("element1","element2",array("element31","element32"));
$arr['name'] = "response";
echo $_GET['callback']."(".json_encode($arr).");";
?>

প্রতিধ্বনি ভুল হতে পারে, যখন থেকে আমি পিএইচপি ব্যবহার করেছি কিছুক্ষণ হয়েছে। যে কোনও ক্ষেত্রে আপনার callbackName('jsonString')উদ্ধৃতিগুলি লক্ষ্য করা দরকার । jQuery এর নিজস্ব কলব্যাক নামটি পাস করবে, সুতরাং আপনাকে এটি জিইটি প্যারামগুলি থেকে পাওয়া দরকার।

এবং স্টেফান কেন্ডাল পোস্ট করার সাথে সাথে $ .getJSON () একটি শর্টহ্যান্ড পদ্ধতি, তবে তারপরে আপনাকে 'callback=?'ইউআরএলটিতে জিইটি প্যারামিটার যুক্ত করতে হবে (হ্যাঁ, মানটি কি ?, JQuery এটিকে তার নিজস্ব উত্পন্ন কলব্যাক পদ্ধতিতে প্রতিস্থাপন করে)।

Comments

callbackName('/* json */')পরিবর্তে আপনার ফিরে কেন দরকার callbackName(/* json */)?

— এরিক

@ এরিক কলব্যাকটি জেএসএন স্ট্রিংয়ের প্রত্যাশা করে। তাত্ত্বিকভাবে, কোনও বস্তু পাশাপাশি কাজ করতে পারে তবে জিক্যুরি কীভাবে এটির প্রতিক্রিয়া জানায় তা নিশ্চিত নয়, এটি একটি ত্রুটি ফেলতে পারে বা নিঃশব্দে ব্যর্থ হতে পারে।

— বিজিরিসসেন

আমি নিম্নলিখিত ত্রুটি পাচ্ছি। সিনট্যাক্সেরর: নিখোঁজ; বিবৃতি দেওয়ার আগে {"রেজাল্টকোড": 2} যেখানে Res "রেজাল্টকোড": 2 একটি প্রতিক্রিয়া। আপনার পরামর্শ দিন.

— user2003356

@ ব্যবহারকারী ২০০3356 দেখে মনে হচ্ছে আপনি JSONP এর পরিবর্তে সরল JSON ফিরিয়ে দিচ্ছেন। আপনাকে এমন কিছু ফিরিয়ে দিতে হবে: কলব্যাক ফাংশন (Res "রেজাল্টকোড": 2।)। jQuery অনুরোধে জিইটি প্যারামিটারকে 'কলব্যাক' যুক্ত করেছে, এটি কলব্যাক ফাংশনটির নাম jquery ব্যবহার করে এবং প্রতিক্রিয়াতে যুক্ত করা উচিত।

— বিজিরিসসেন

এটি ২০১ 2016 J সিওআরএস এখন একটি বহুল সমর্থিত মান, জেএসওএনপির বিপরীতে যা কেবল হ্যাক হিসাবে বর্ণনা করা যেতে পারে। নীচে @ জোশুড়ের উত্তরটি এখন পছন্দসই হওয়া উচিত।

— ভিকি চিজওয়ানি

Answer 2

জেএসএনপি একটি ভাল বিকল্প, তবে আরও সহজ উপায় রয়েছে। আপনি কেবল Access-Control-Allow-Originআপনার সার্ভারে শিরোনাম সেট করতে পারেন । এটি সেট করা *কোনও ডোমেনের ক্রস-ডোমেন এজেএক্স অনুরোধ গ্রহণ করবে। ( https://developer.mozilla.org/en/http_access_control )

এটি করার পদ্ধতিটি অবশ্যই ভাষা থেকে আলাদা হয়ে যায়। এটি এটি কারাগারে রয়েছে:

class HelloController < ApplicationController
  def say_hello
    headers['Access-Control-Allow-Origin'] = "*"
    render text: "hello!"
  end
end

এই উদাহরণে, say_helloক্রিয়াটি কোনও ডোমেনের AJAX অনুরোধগুলি গ্রহণ করবে এবং "হ্যালো!" এর প্রতিক্রিয়া ফিরিয়ে দেবে।

এটি যে শিরোনামগুলি ফিরে আসতে পারে তার উদাহরণ এখানে রয়েছে:

HTTP/1.1 200 OK 
Access-Control-Allow-Origin: *
Cache-Control: no-cache, no-store, max-age=0, must-revalidate
Content-Type: text/html; charset=utf-8
X-Ua-Compatible: IE=Edge
Etag: "c4ca4238a0b923820dcc509a6f75849b"
X-Runtime: 0.913606
Content-Length: 6
Server: WEBrick/1.3.1 (Ruby/1.9.2/2011-07-09)
Date: Thu, 01 Mar 2012 20:44:28 GMT
Connection: Keep-Alive

এটি যেমন সহজ, এতে ব্রাউজারের কিছু সীমাবদ্ধতা রয়েছে। Http://caniuse.com/#feat=cors দেখুন ।

Comments

জাসনপ পোস্ট, লাগানো এবং মুছতে সহায়তা করেনি। আপনার সমাধান দুর্দান্ত কাজ করে।

— টনিটেকশি

পিএইচপি শিরোনামে ("অ্যাক্সেস-নিয়ন্ত্রণ-মঞ্জুরি-উত্স: *");

— স্পার্ক

@ ওয়ারিয়র আপনি যদি jQuery এর .post()পদ্ধতি ব্যবহার করেন তবে আপনাকে jQuery এ ক্রস-ডোমেন সমর্থন সক্ষম করতে হবে। এটা এই সঙ্গে সম্পন্ন হয়: $.support.cors = true।

— ফ্রেডেরিকে

এই পদ্ধতিতে কোনও সার্ভার কনফিগার করার সুরক্ষা সম্পর্কিত কী কী প্রভাব রয়েছে?

— জন স্নাইডার

উইলকার্ড "*" ব্যবহারের পরিবর্তে আপনি কেবল সেই ডোমেনগুলিকেই ডেটা ভাগ করতে চান সেগুলি অনুমতি দেওয়া ভাল।

— সেবাস্তিয়ান গ্রিগনোলি

Answer 3

আপনি এইচটিটিপি শিরোনামের মাধ্যমে অ্যাক্সেস-কন্ট্রোল-মঞ্জুরি-উত্স যোগ করে এটি নিয়ন্ত্রণ করতে পারেন । এটিকে সেট করা * যে কোনও ডোমেনের ক্রস-ডোমেন এজেএক্স অনুরোধ গ্রহণ করবে।

পিএইচপি ব্যবহার করে এটি সত্যিই সহজ, কেবলমাত্র আপনার লিখিত স্ক্রিপ্টে নিম্নলিখিত লাইনটি যুক্ত করুন যা আপনি আপনার ডোমেন থেকে বাইরে অ্যাক্সেস করতে চান:

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

Httpd.conf এ mod_headers মডিউল সক্ষম করতে ভুলবেন না।

Comments

তুমি আমার দিন বাঁচিয়েছ

— নোমান জাভেদ

Answer 4

আপনার একই অরিজিন নীতিটি দেখতে হবে :

কম্পিউটিংয়ে, জাভাস্ক্রিপ্টের মতো কয়েকটি ব্রাউজার-সাইড প্রোগ্রামিং ভাষার জন্য একই উত্স নীতিটি একটি গুরুত্বপূর্ণ সুরক্ষা ধারণা। নীতিটি কোনও নির্দিষ্ট সীমাবদ্ধতা ছাড়াই একে অপরের পদ্ধতি এবং বৈশিষ্ট্যে অ্যাক্সেস করার জন্য একই সাইট থেকে উত্পন্ন পৃষ্ঠায় চলমান স্ক্রিপ্টগুলিকে অনুমতি দেয় তবে বিভিন্ন সাইটের পৃষ্ঠাগুলি জুড়ে বেশিরভাগ পদ্ধতি এবং বৈশিষ্ট্যগুলিতে অ্যাক্সেসকে বাধা দেয়।

আপনি ডেটা পেতে সক্ষম হতে, এটি হতে হবে:

একই প্রোটোকল এবং হোস্ট

এটি কার্যকর করার জন্য আপনাকে জেএসএনপি বাস্তবায়ন করতে হবে।

Answer 5

আমাকে লোকাল ডিস্ক "ফাইল: /// সি: / সর্বশেষ / htmlpage.html" থেকে ওয়েবপৃষ্ঠাটি লোড করতে হয়েছিল, "http: //localhost/getxML.php" url কল করতে হবে এবং আইই 8 + এবং ফায়ারফক্স 12 + ব্রাউজারে এটি করতে, jQuery ভি 1 ব্যবহার করুন .7.2 বয়লারপ্লেট কোড কমাতে lib। কয়েক ডজন নিবন্ধ পড়ার পরে অবশেষে এটি আউট। আমার সংক্ষিপ্তসারটি এখানে।

• সার্ভার স্ক্রিপ্ট (। php, .jsp, ...) অবশ্যই HTTP প্রতিক্রিয়া শিরোনামটি অ্যাক্সেস-কন্ট্রোল-মঞ্জুরি-উত্স দিতে হবে: *
• jQuery আজাক্স ব্যবহার করার আগে জাভাস্ক্রিপ্টে এই পতাকাটি সেট করুন: jQuery.support.cors = সত্য;
• আপনি jQuery আজাক্স ফাংশন ব্যবহার করার আগে একবার বা প্রতিবার পতাকা সেট করতে পারেন
• এখন আমি IE এবং ফায়ারফক্সে .xML ডকুমেন্ট পড়তে পারি। অন্যান্য ব্রাউজারগুলি আমি পরীক্ষা করিনি।
• প্রতিক্রিয়া নথি সরল / পাঠ্য, এক্সএমএল, জসন বা অন্য যে কোনও কিছু হতে পারে

এখানে কিছু ডিবাগ সিউসাউট সহ jQuery এজাক্স কল উদাহরণ রয়েছে।

jQuery.support.cors = true;
$.ajax({
    url: "http://localhost/getxml.php",
    data: { "id":"doc1", "rows":"100" },
    type: "GET",
    timeout: 30000,
    dataType: "text", // "xml", "json"
    success: function(data) {
        // show text reply as-is (debug)
        alert(data);

        // show xml field values (debug)
        //alert( $(data).find("title").text() );

        // loop JSON array (debug)
        //var str="";
        //$.each(data.items, function(i,item) {
        //  str += item.title + "\n";
        //});
        //alert(str);
    },
    error: function(jqXHR, textStatus, ex) {
        alert(textStatus + "," + ex + "," + jqXHR.responseText);
    }
});

Comments

: আমি এই প্রশ্নের জন্য একটি উত্তর এখানে লিখেছিলেন jQuery এর AJAX সঙ্গে ক্রস ডোমেইন HTML পাতায় লোড করা হচ্ছে - গত এক সমর্থন HTTPS

— jherax

দমকলের পয়েন্টের জন্য: পিএইচপি-তে স্ক্রিপ্টটিতে এই লাইনটি যুক্ত করুন:header("Access-Control-Allow-Origin: *");

— T30

@ যারা আপনার উত্তরের জন্য আপনাকে অনেক ধন্যবাদ। আপনি আমাকে অনেক সাহায্য করেছেন। চিয়ার্স।

— লুইস

Answer 6

এটি সত্য যে একই-উত্স নীতিটি জাভাস্ক্রিপ্টটিকে ডোমেনগুলি জুড়ে অনুরোধ করতে বাধা দেয়, তবে সিওআরএস স্পেসিফিকেশন আপনার সন্ধান করা কেবলমাত্র এপিআই অ্যাক্সেসের অনুমতি দেয় এবং প্রধান ব্রাউজারগুলির বর্তমান ব্যাচ দ্বারা সমর্থিত।

ক্লায়েন্ট এবং সার্ভারের জন্য ক্রস-অরিজিন রিসোর্স ভাগ করে নেওয়া কীভাবে সক্ষম করবেন তা দেখুন:

http://enable-cors.org/

"ক্রস-অরিজিন রিসোর্স শেয়ারিং (সিওআরএস) হ'ল একটি স্পেসিফিকেশন যা ডোমেন সীমানা জুড়ে সত্যই উন্মুক্ত অ্যাক্সেস সক্ষম করে public আপনি যদি জনসাধারণের সামগ্রীর পরিবেশন করেন তবে দয়া করে সিওআরএসকে সর্বজনীন জাভাস্ক্রিপ্ট / ব্রাউজার অ্যাক্সেসের জন্য এটি খুলতে বিবেচনা করুন" "

Answer 7

এটি সম্ভব, তবে আপনাকে জেএসএনপি নয়, জেএসএনপি ব্যবহার করতে হবে। স্টিফানের লিঙ্কটি আপনাকে সঠিক দিকে নির্দেশ করেছে। JQuery এর AJAX এর পৃষ্ঠা jsonp সম্পর্কে আরও তথ্যের হয়েছে।

রেমি শার্পের পিএইচপি ব্যবহার করে একটি বিশদ উদাহরণ রয়েছে ।

Answer 8

আমি অ্যাপাচি সার্ভার ব্যবহার করি, তাই আমি মোড_প্রক্সি মডিউলটি ব্যবহার করেছি। মডিউলগুলি সক্ষম করুন:

LoadModule proxy_module modules/mod_proxy.so
LoadModule proxy_http_module modules/mod_proxy_http.so

তারপর যোগ:

ProxyPass /your-proxy-url/ http://service-url:serviceport/

অবশেষে, আপনার স্ক্রিপ্টে প্রক্সি-url পাস করুন pass

Answer 9

ব্রাউজার সুরক্ষা অন্য ডোমেনে হোস্ট করা পৃষ্ঠায় একটি ডোমেনে হোস্ট করা পৃষ্ঠা থেকে একটি অজ্যাক্স কল করতে বাধা দেয়; এটিকে " একই-উত্স নীতি " বলা হয়।

Answer 10

জেএসএনপি ব্যবহারের জন্য কয়েকটি উদাহরণ রয়েছে যার মধ্যে ত্রুটি পরিচালনা করা অন্তর্ভুক্ত রয়েছে।

তবে, দয়া করে নোট করুন যে JSONP ব্যবহার করার সময় ত্রুটি-ইভেন্টটি ট্রিগার করা হয়নি! দেখুন: http://api.jquery.com/jQuery.ajax/ বা jsonp ত্রুটি ব্যবহার করে jQuery এজ্যাক্স অনুরোধ

Answer 11

জ্যাকুরি ডক্স থেকে ( লিঙ্ক ):

• ব্রাউজার সুরক্ষা বিধিনিষেধের কারণে, বেশিরভাগ "অ্যাজাক্স" অনুরোধগুলি একই উত্স নীতি সাপেক্ষে; অনুরোধটি কোনও অন্য ডোমেন, সাবডোমেন বা প্রোটোকল থেকে সাফল্যের সাথে ডেটা পুনরুদ্ধার করতে পারে না।

• স্ক্রিপ্ট এবং জেএসএনপি অনুরোধগুলি একই উত্স নীতি সীমাবদ্ধতার অধীন নয়।

সুতরাং আমি এটি গ্রহণ করব যে আপনি অনুরোধ জন্য jsonp ব্যবহার করা প্রয়োজন। তবে আমি নিজে চেষ্টা করে দেখিনি।

Answer 12

আমি আপনার সমস্যা সমাধানের 3 উপায় জানি:

1. প্রথমে যদি আপনার উভয় ডোমেইনে অ্যাক্সেস থাকে তবে আপনি অন্য সমস্ত ডোমেন ব্যবহার করে অ্যাক্সেসের অনুমতি দিতে পারবেন:

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

   বা .htaccess ফাইলে কোড বেলো যুক্ত করে একটি ডোমেন:

   <FilesMatch "\.(ttf|otf|eot|woff)$"> <IfModule mod_headers.c> SetEnvIf Origin "http(s)?://(www\.)?(google.com|staging.google.com|development.google.com|otherdomain.net|dev02.otherdomain.net)$" AccessControlAllowOrigin=$0 Header add Access-Control-Allow-Origin %{AccessControlAllowOrigin}e env=AccessControlAllowOrigin </IfModule> </FilesMatch>

2. আপনার সার্ভারে একটি পিএইচপি ফাইলে এজাক্স অনুরোধ থাকতে পারে এবং এই পিএইচপি ফাইলটি ব্যবহার করে অন্য ডোমেনের কাছে অনুরোধ পরিচালনা করতে পারেন।

3. আপনি jsonp ব্যবহার করতে পারেন, কারণ এটির অনুমতির দরকার নেই। এর জন্য আপনি আমাদের বন্ধু @ বিগ্রিসেন উত্তরটি পড়তে পারেন।

Answer 13

মাইক্রোসফ্ট আজুরের জন্য এটি কিছুটা আলাদা।

অ্যাজুরেতে একটি বিশেষ সিওআরএস সেটিং রয়েছে যা সেট করা দরকার। এটি মূলত পর্দার আড়ালে একই জিনিস, তবে কেবলমাত্র শিরোনাম জোশুড়হর উল্লেখ করে কাজ করবে না। ক্রস ডোমেন সক্ষম করার জন্য আজুর ডকুমেন্টেশনটি এখানে পাওয়া যাবে:

https://docs.microsoft.com/en-us/azure/app-service-api/app-service-api-cors-consume-javascript

আমার হোস্টিং প্ল্যাটফর্মটি এই বিশেষ সেটিংসটি অনুধাবন করার আগে আমি কয়েক ঘন্টা ধরে এটিকে ঘিরে ধরেছিলাম।

Answer 14

এটি আপনার প্রয়োজন সমস্ত কাজ করে:

পিএইচপি:

header('Access-Control-Allow-Origin: http://www.example.com');
header("Access-Control-Allow-Credentials: true");
header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');

জেএস (jQuery আজাক্স):

var getWBody = $.ajax({ cache: false,
        url: URL,
        dataType : 'json',
        type: 'GET',
        xhrFields: { withCredentials: true }
});