从网站表单写入谷歌文档时遇到 CORS 错误

Question

我的网站上有一个表单，应该将文本字段“电子邮件”写入谷歌电子表格。提交表单时，它会调用一个函数，该函数将 jquery ~ v 1.4 ajax POST 发送到谷歌文档。（我已经测试了谷歌表单并且它有效）

我遇到了 CORS 错误。

跨域请求被阻止：同源策略不允许在https://docs.google.com/forms/ **********************读取远程资源 **************************** /formResponse. 这可以通过将资源移动到同一域或启用 CORS 来解决。

• 我显然无法将 google 文档移动到同一个域。
• 我没有服务器的配置控制。
• 我不想进行任何会影响站点上许多其他 ajax 和 $httpProvider 使用的全局 angularjs 更改。
• 我不想将谷歌表单作为 iframe 嵌入网站中。

我的阿贾克斯是

$scope.storeEmail = function() {
var email = $scope.fA.email;
$.ajax({type: "POST",
        async: true,
        url: 'https://docs.google.com/forms/***************************/formResponse',
        data: { field_key : email, submit : "Submit"},
        success: function(resp) {
        // give success feedback and redirect page
        }
        error: function(xhr, statusText, error){
          console.log(xhr);
        }        
};

我试过 向 ajax 请求添加凭据和标头

withCredentials: true,
headers: {
  'Content-Type': 'application/json; charset=utf-8'
}

但是我不能（至少我认为我不能）设置“AccessControlAllow*”参数。

作为注释设置 withCredentials 本身似乎没有什么不同。设置标头或使用其他类型（例如 PUT）会导致“NetworkError: 405 Method Not Allowed”响应。

我尝试使用以下配置 angularjs

App.config(['$httpProvider', function($httpProvider) {
    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];
  }
]);

但是，我是 angularjs 的新手，我不知道这是否已放入正确的文件中，或者它是否会对站点上的其他（内部）$httpProvider 使用产生影响。

有人告诉我，我需要为来自我的服务器的所有 HTTP 响应添加一个“Access-Control-Allow-Origin：*”标头。但由于服务器是我的谷歌文档服务器，我认为我无法做到这一点。

任何帮助请。

Answer 1

我知道的跨域请求的两个选项是 jsonp 和 CORS。正如您已经注意到的，CORS 要求托管服务器在响应中包含 CORS 标头。听起来谷歌文档网站没有。

Google 确实在工作表和文档中提供了各种 jsonp 选项，因此一切都不会丢失 - https://developers.google.com/gdata/samples/spreadsheet_sample

您可以使用自己的服务器作为中间人，甚至使用 cors 代理等服务将所需的标头添加到您请求的 Google 内容中，而无需支付带宽费用。

http://www.corsproxy.com/ http://en.wikipedia.org/wiki/Cross-origin_resource_sharing