Google API'larına jQuery Postası gönderirken Access-Control-Allow-Origin hatası

'Access-Control-Allow-Origin' hatası için çok şey okudum, ancak neyi düzeltmem gerektiğini anlamıyorum :(

Google Moderatör API'sı ile oynuyorum, ancak yeni seri eklemeye çalıştığımda :

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.

Geri arama parametresi ile ve olmadan, başlığa 'Access-Control-Allow-Origin *' eklemeye çalıştım. Ve eğer geçerliyse, burada $ .getJSON'u nasıl kullanacağımı bilmiyorum, çünkü Yetkilendirme başlığını eklemeliyim ve $ .ajax'dan daha önce olmadan nasıl yapacağımı bilmiyorum: /

Bu karanlık için ışık var mı?

Kod budur:

<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 -->

DataType parametresini dataType: 'jsonp' olarak değiştirip bir crossDomain: true ekleyerek Access-Control-Allow-Origin hatasını çözdüm

$.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
});

Aynı sorunu yaşadım ve alanlar arası değil aynı alan adı. Ben sadece ajax isteği ele php dosyasına bu satırı ekledi.

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

Bir cazibe gibi çalıştı. Poster sayesinde

Bu Access-Control-Allow-Origin *uygulamada üstbilgiyi ekleyemediğiniz bir hizmeti kullanmaya çalışırken bu hatayla karşılaşırsanız , ancak sunucunun önüne bir ters proxy yerleştirebilirsiniz, hata, üstbilgi yeniden yazma işlemiyle önlenebilir.

Uygulamanın 8080 bağlantı noktasında ( www.mydomain.com adresinde ortak etki alanı ) çalıştığını ve 80 numaralı bağlantı noktasında aynı ana bilgisayara ters proxy'yi yerleştirdiğinizi varsayarsak , bu Nginx ters proxy yapılandırmasıdır :

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 *;
    }   
}

Evet, jQuery'nin URL'nin farklı bir alana ait olduğunu gördüğü anda, bu alanın çapraz alan adı çağrısı olduğunu varsayar, bu nedenle crossdomain:trueburada gerekli değildir.

Ayrıca, $.ajaxURL'niz farklı bir alana (alanlar arası) aitse veya JSONP kullanıyorsanız , senkronize çağrı yapamayacağınızı da belirtmek önemlidir. Yalnızca zaman uyumsuz çağrılara izin verilir.

Not: async:falseisteğinizi ile belirtmeniz halinde servisi senkronize olarak arayabilirsiniz .

Benim durumumda alt etki alanı adı soruna neden olur. İşte detaylar

Kullandım app_development.something.com, burada alt çizgi ( _) alt etki alanı CORS hatası oluşturuyor. Değiştirdikten sonra app_developmenthiç app-developmentbunun cezası çalışır.

Php ile küçük bir kesmek var. Ve sadece Google ile değil, kontrol ettiğiniz ve Erişim-Kontrol-İzin Ver-Menşei * ekleyemediğiniz herhangi bir web sitesinde de çalışır *

Web sunucumuzda PHP dosyası (ör. GetContentFromUrl.php ) oluşturmalı ve biraz hile yapmalıyız.

PHP

<?php

$ext_url = $_POST['ext_url'];

echo file_get_contents($ext_url);

?>

JS

$.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');
    }
});

Nasıl çalışır:

1. JS yardımıyla tarayıcınız sunucunuza istek gönderecek
2. Sunucunuz başka bir sunucuya istek gönderecek ve başka bir sunucudan (herhangi bir web sitesi) yanıt alacaktır
3. Sunucunuz bu yanıtı JS'nize gönderecek

Etkinlikleri onClick yapabiliriz, bu etkinliği bazı düğmelere koyabiliriz. Umarım bu yardımcı olur!