将 jQuery Post 发送到 Google API 的 Access-Control-Allow-Origin 错误

问题描述

我阅读了很多关于访问控制允许来源"错误的信息，但我不明白我必须修复什么:(

I read a lot for the 'Access-Control-Allow-Origin' error, but I don't understand what I have to fix :(

我正在使用 Google Moderator API，但是当我尝试 添加新系列 我收到:

I'm playing with Google Moderator API, but when I try to add new serie I receive:

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.

我尝试使用和不使用回调参数，我尝试将Access-Control-Allow-Origin *"添加到标题中.而且我不知道如何在此处使用 $.getJSON(如果适用)，因为我必须添加 Authorization 标头，而且如果没有来自 $.ajax 的 beforeCall，我不知道该怎么做:/

I tried with and without callback parameter, I tried to add 'Access-Control-Allow-Origin *' to the header. And I don't know how to use $.getJSON here, if apply, because I have to add the Authorization header and I don't know how to do it without beforeCall from $.ajax :/

这黑暗你有什么光明吗?

Any light for this darkness u.u?

代码如下:

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

推荐答案

我解决了 Access-Control-Allow-Origin 错误，修改 dataType 参数为 dataType:'jsonp' 并添加一个 crossDomain:true

I solved the Access-Control-Allow-Origin error modifying the dataType parameter to dataType:'jsonp' and adding a crossDomain:true

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

这篇关于将 jQuery Post 发送到 Google API 的 Access-Control-Allow-Origin 错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！