jquery - 使用 jQuery.ajax() 保存匿名 github 要点

Question

我在使用 jQuery.ajax() 将要点发布到 Github 时遇到问题。要点已创建，响应为 201 Created，但 Firebug 中的响应选项卡为空，并且命中了错误回调。

  var data = {
    "description": "posting gist test",
    "public": true,
    "files": {
      "test.txt": {
        "content": "hello gist!"
      }
    }
  }
  $.ajax({
    url: 'https://api.github.com/gists',
    type: 'POST',
    dataType: 'json',
    data: JSON.stringify(data)
  })
  .success( function(e) {
    console.log(e);
  })
  .error( function(e) {
    console.warn("gist save error", e);
  });

令人沮丧的是，它在 jsfiddle 中运行良好:http://jsfiddle.net/vXpCV/

<小时/>

也许这就是问题所在。 jsFiddle 正在获取不同的响应 header :

Access-Control-Allow-Cred...    true
Access-Control-Allow-Orig...    http://fiddle.jshell.net
Access-Control-Expose-Hea...    Link, X-RateLimit-Limit, X-RateLimit-Remaining, X-OAuth-Scopes, X-Accepted-OAuth-Scopes
Connection  keep-alive
Content-Length  1093
Content-Type    application/json; charset=utf-8
...

Answer 1

福雷斯托自己的回答是完全正确的:

Adding my http://local.dev/ to https://github.com/settings/applications seemed to fix it.

...但是只要当人们在 google 上搜索 Gist+jQuery 时出现这个答案，它就应该对正在发生的事情有一个解释。

浏览器存在一个名为 Same Origin Policy 的安全问题。它禁止网页与加载该页面的服务器以外的服务器进行通信，因此这基本上不起作用。有一种解决方法称为 JSONP但它仅适用于 GET 请求，而本示例具有 POST。

还有一种名为 Cross-Origin Resource Sharing 的新技术(CORS)。它允许在现代浏览器中打开的页面使用古老的 AJAX 与其他服务器进行通信。

GitHub API only accepts来自在 GitHub 上注册为 OAuth 应用程序的域的 CORS 请求。当 jQuery 发送 POST 请求时，它将 Origin HTTP header 设置为与其启动的站点的域相同。

但我应该说，对我来说，即使使用困惑的 Origin header ，剪裁也能完成。它有效，但我不知道为什么。 :)