অ্যাক্সেস-কন্ট্রোল-মঞ্জুরি-উত্পন্ন ত্রুটি গুগল এপিআই-তে কোনও jQuery পোস্ট প্রেরণে


143

আমি 'অ্যাক্সেস-কন্ট্রোল-অরিজিন-অরিজিন' ত্রুটির জন্য অনেকগুলি পড়েছি, তবে আমার কী ঠিক করতে হবে তা আমি বুঝতে পারি না :(

আমি গুগল মডারেটর এপিআইয়ের সাথে খেলছি, তবে যখন আমি নতুন সিরিটি যুক্ত করার চেষ্টা করি তখন আমি পেয়ে যাব:

XMLHttpRequest cannot load 
https://www.googleapis.com/moderator/v1/series?key=[key]
&data%5Bdescription%5D=Share+and+rank+tips+for+eating+healthily+on+the+cheaps!
&data%5Bname%5D=Eating+Healthy+%26+Cheap
&data%5BvideoSubmissionAllowed%5D=false. 
Origin [my_domain] is not allowed by Access-Control-Allow-Origin.

আমি কলব্যাক প্যারামিটারের সাথে বা ছাড়া চেষ্টা করেছিলাম, আমি হেডারে 'অ্যাক্সেস-কন্ট্রোল-অলজন-অরিজিন *' যুক্ত করার চেষ্টা করেছি। এবং প্রয়োগ করার পরে আমি কীভাবে এখানে get .জেটসন ব্যবহার করতে জানি না, কারণ আমাকে অনুমোদনের শিরোনাম যোগ করতে হবে এবং আমি aj .জ্যাক্স থেকে কল না করে কীভাবে এটি করব তা আমি জানি না: /

এই অন্ধকারের জন্য কোন আলো?

এই কোড:

<script src="http://www.google.com/jsapi"></script>

<script type="text/javascript">

var scope = "https://www.googleapis.com/auth/moderator";
var token = '';

function create(){
     if (token == '')
      token = doCheck();

     var myData = {
      "data": {
        "description": "Share and rank tips for eating healthily on the cheaps!", 
        "name": "Eating Healthy & Cheap", 
        "videoSubmissionAllowed": false
      }
    };

    $.ajax({

        url: 'https://www.googleapis.com/moderator/v1/series?key='+key,
        type: 'POST',
        callback: '?',
        data: myData,
        datatype: 'application/json',
        success: function() { alert("Success"); },
        error: function() { alert('Failed!'); },
        beforeSend: setHeader

    });
}

function setHeader(xhr) {

  xhr.setRequestHeader('Authorization', token);
}

function doLogin(){ 
    if (token == ''){
       token = google.accounts.user.login(scope);
    }else{
       alert('already logged');
    }
}


function doCheck(){             
    token = google.accounts.user.checkLogin(scope);
    return token;
}
</script>
...
...
<div data-role="content">
    <input type="button" value="Login" onclick="doLogin();">
    <input type="button" value="Get data" onclick="getModerator();">
    <input type="button" value="Create" onclick="create();">
</div><!-- /content -->

1
আপনি কি দয়া করে আপনার কোডটি আরও কিছুটা পুরোপুরি রেখে দিতে পারেন? আমি আপনার কোড চালাতে পারিনি।
হোসেইন আকাশানী

উত্তর:


249

আমি অ্যাক্সেস-কন্ট্রোল-মঞ্জুরি-অরিজিন ত্রুটিটি ডেটা টাইপ পরামিতিগুলিকে ডেটা টাইপ: 'জসনপ' এবং একটি ক্রসডোমাইন যোগ করার ক্ষেত্রে সমাধান করেছি : সত্য

$.ajax({

    url: 'https://www.googleapis.com/moderator/v1/series?key='+key,
    data: myData,
    type: 'GET',
    crossDomain: true,
    dataType: 'jsonp',
    success: function() { alert("Success"); },
    error: function() { alert('Failed!'); },
    beforeSend: setHeader
});

20
আমি মনে করি না যে এটি crossDomain:trueপ্রয়োজনীয়। আমার বোধগম্যতা কেবলমাত্র এটি প্রয়োজনীয় যদি আপনি নিজের ডোমেইনে একটি অনুরোধ করেন তবে jQuery এটি ক্রস-ডোমেন অনুরোধের মতো আচরণ করতে চান।
অ্যালেক্স ডব্লিউ

7
crossDomainপ্রয়োজন হয় না। এটি একটি নিয়মিত jsonpঅনুরোধ যা ক্রস ডোমেন যোগাযোগের জন্য বোঝানো হয়।
hitautodestruct

50
আমি একই ত্রুটি পাচ্ছি, তবে আমি অনুরোধটি পোস্ট করতে চাই। jsonp পোষ্ট সমর্থন করবে না। আমি কীভাবে এটি সমাধান করতে পারি?
আইএমজেডকোডার

7
আপনি পোস্ট থেকে জিইটি
ডেভ বাঘদানভ

5
@ রবডোটোকম যদি ইউআরএল জসসনের পরিবর্তে এক্সএমএল প্রতিক্রিয়া ফেরায় ...?
বিকাশকারী ডেস্ক

43

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

<?php header('Access-Control-Allow-Origin: *'); ?>

এটি একটি মোহন মত কাজ করে। পোস্টার ধন্যবাদ


29
এটি খুব নিরাপদ। যদি কেউ আপনার পৃষ্ঠায় জাভাস্ক্রিপ্ট ইনজেক্ট করার ব্যবস্থা করে তবে তারা সহজেই কোনও ব্যবহারকারীকে সরবরাহ করতে পারে এমন কোনও তথ্য "ফোন হোম" করতে পারে।
dclowd9901

@ dclowd9901: "অনিরাপদ" সেট করার জন্য পালন ব্যবহার এবং ব্যবস্থা উদ্দেশ্য উপর নির্ভর করে আপেক্ষিক অ্যাক্সেস-নিয়ন্ত্রণ-মঞ্জুর করুন বংশোদ্ভূত হেডার থেকে বেনামী অন্যান্য কারণে মধ্যে।
নিবেদিতিকে

6

আপনি যদি Access-Control-Allow-Origin *সেই অ্যাপ্লিকেশনটিতে শিরোলেখ যোগ করতে না পারেন এমন কোনও পরিষেবা গ্রাস করার চেষ্টা করার ক্ষেত্রে এই ত্রুটিটি থাকে তবে আপনি সার্ভারের সামনে একটি বিপরীত প্রক্সি রাখতে পারেন, শিরোনামের পুনর্লিখনের মাধ্যমে ত্রুটিটি এড়ানো যেতে পারে।

আবেদন ধরে নেওয়া যাক করা হয় (এ পাবলিক ডোমেইনে পোর্টে 8080 চলমান www.mydomain.com ), এবং আপনি বন্দর 80 একই হোস্টে বিপরীত প্রক্সি করা, এই জন্য কনফিগারেশন হল nginx বিপরীত প্রক্সি:

server {
    listen      80;
    server_name www.mydomain.com;
    access_log  /var/log/nginx/www.mydomain.com.access.log;
    error_log   /var/log/nginx/www.mydomain.com.error.log;

    location / {
        proxy_pass   http://127.0.0.1:8080;
        add_header   Access-Control-Allow-Origin *;
    }   
}

2
উপরে উল্লিখিত হিসাবে '*' ব্যবহার খুব নিরাপদ।
অ্যাড্ডিনসনে

5
হ্যাঁ, তবে আপনি কী প্রকাশ করছেন তা নির্ভর করে। আপনি যদি অনুমোদন ব্যতীত কোনও পাবলিক এপিআই প্রকাশ করছেন তবে সেভাবেই (আমার ক্ষেত্রে)। যদি তা না হয় না, আপনি হতে shoud ভালো ব্যবহার somethig: Access-Control-Allow-Origin: http://example.com
মারিয়ানো রুইজ

2
যখন আমি পোস্টম্যান এবং এজাক্সের মাধ্যমে একটি এপিআই পরীক্ষা করি। তবে পোস্টম্যানের অনুরোধটি সাফল্য। কিন্তু এজাক্সে মিথ্যা প্রত্যাবর্তন।
আরাফ

@ আরাফ পোস্টম্যান এবং অন্যান্য অ্যাপ্লিকেশনগুলি ব্রাউজারগুলিতে তৈরি সিওআরএস সুরক্ষাগুলি ট্রিগার করে না।
সেনসেইহিটোকিরি

6

হ্যাঁ, যে মুহুর্তে jQuery URL টি অন্য কোনও ডোমেনের অন্তর্ভুক্ত দেখায়, সেই কলটিকে ক্রস ডোমেন কল হিসাবে ধরে নিয়েছে, সুতরাং crossdomain:trueএখানে এখানে প্রয়োজনীয় নয়।

এছাড়াও, লক্ষণীয় গুরুত্বপূর্ণ যে $.ajaxআপনার URL টি যদি অন্য কোনও ডোমেনের (ক্রস ডোমেন) এর সাথে সম্পর্কিত হয় বা আপনি জেএসএনপি ব্যবহার করছেন তবে আপনি এটির সাথে সিঙ্ক্রোনাস কল করতে পারবেন না । শুধুমাত্র অ্যাসিঙ্ক কল অনুমোদিত।

দ্রষ্টব্য: আপনি যদি async:falseআপনার অনুরোধটির সাথে নির্দিষ্ট করে থাকেন তবে আপনি পরিষেবাটি সিঙ্ক্রোনজলি কল করতে পারেন ।


0

আমার ক্ষেত্রে সাব ডোমেন নাম সমস্যা সৃষ্টি করে। এখানে বিশদ

আমি ব্যবহার করেছি app_development.something.com, এখানে আন্ডারস্কোর ( _) সাব ডোমেন CORS ত্রুটি তৈরি করছে। এটি পরিবর্তন app_developmentকরার পরে app-developmentসূক্ষ্ম কাজ করে।


0

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

আমাদের আমাদের ওয়েব সার্ভারে পিএইচপি-ফাইল (প্রাক্তন getContentFromUrl.php ) তৈরি করতে হবে এবং কিছুটা কৌশল তৈরি করতে হবে।

পিএইচপি

<?php

$ext_url = $_POST['ext_url'];

echo file_get_contents($ext_url);

?>

জাতীয়

$.ajax({
    method: 'POST',
    url: 'getContentFromUrl.php', // link to your PHP file
    data: {
        // url where our server will send request which can't be done by AJAX
        'ext_url': '/programming/6114436/access-control-allow-origin-error-sending-a-jquery-post-to-google-apis'
    },
    success: function(data) {
        // we can find any data on external url, cause we've got all page
        var $h1 = $(data).find('h1').html();

        $('h1').val($h1);
    },
    error:function() {
        console.log('Error');
    }
});

কিভাবে এটা কাজ করে:

  1. জেএসের সাহায্যে আপনার ব্রাউজারটি আপনার সার্ভারে অনুরোধ প্রেরণ করবে
  2. আপনার সার্ভারটি অন্য যে কোনও সার্ভারে অনুরোধ প্রেরণ করবে এবং অন্য সার্ভারের (কোনও ওয়েবসাইট) থেকে উত্তর পাবে
  3. আপনার সার্ভার আপনার জেএসকে এই উত্তর পাঠাবে

এবং আমরা ক্লিকগুলিতে ইভেন্টগুলি তৈরি করতে পারি, এই ইভেন্টটিকে কিছু বোতামে রেখে দিতে পারি। আশা করি এটি সাহায্য করবে!

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.