Question

我已经在网上搜索了一段时间，但是找不到如何使用普通客户端javascript（没有node-js，jquery等）的GitHub API的示例。我想要一些像authenticate那样的东西，然后推送一个blob，尽可能简单地让我理解它。不应该太复杂，我打赌你可以用十几行代码做到这一点，但我不太了解ajax，json和jsonp。

你能提供一个让我入门的例子吗？

谢谢！

编辑发现了这个：http://blog.vjeux.com/category/javascript，但我仍然对这个过程的具体步骤感到困惑。

Answer 1

如果您希望使用vanilla JavaScript（即没有框架），则需要使用XMLHttpRequest对象。 XMLHttpRequest为AJAX实现提供了核心。

尽管有XMLHttp前缀，但您不仅限于XML或HTTP。您可以检索任何数据类型（例如JSON）并使用其他协议，例如FTP。

假设我们想从GitHub GET提供您的用户信息。通过浏览器，我们可以通过访问https://api.github.com/users/funchal轻松提出请求。使用XMLHttpRequest发送HTTP请求与// Create a new request object var request = new XMLHttpRequest(); // Initialize a request request.open('get', 'https://api.github.com/users/funchal') // Send it request.send()：

一样简单

readyState

如果你从JavaScript控制台开始，你可能会感到有些失望：什么都不会立即发生。您必须等待服务器响应您的请求。从您创建实例化请求对象到服务器响应之间，对象将经历一系列状态更改，由UNSENT属性的值表示：

0 open()：OPENED未提及
1 send()：HEADERS_RECIEVED未提及
2 send()：标题和状态在LOADING
3 responseText：DONE仍在下载
4 response：Wahoo！

完成所有操作后，您可以检查数据的request.readyState // => 4 (We've waited enough) request.response // => "{whatever}"属性：

XMLHttpRequest#open()

使用void open( DOMString method, DOMString url, optional boolean async, optional DOMString user, optional DOMString password );时，您需要考虑几个选项。这是方法签名：

false

第三个参数（默认为true）指示是否应异步进行响应。如果将其设置为#send()，则必须等到onload的响应完成后才能返回，并且您将支付阻止整个程序的价格。因此，我们以异步方式编码，以便我们的程序即使在我们等待时也能保持响应。这种异步性是通过使用和事件监听器（a.k.a.事件处理程序）和回调函数来实现的。

假设我们只想在响应到达时将响应转储到控制台。我们首先需要创建一个我们想要执行function dumpResponse() { // `this` will refer to the `XMLHTTPRequest` object that executes this function console.log(this.responseText); }的回调函数：

onload

然后我们将此回调设置为XMLHttpRequest接口定义的var request = new XMLHttpRequest(); // Set the event handler request.onload = dumpResponse; // Initialize the request request.open('get', 'https://api.github.com/users/funchal', true) // Fire away! request.send()事件的侦听器/处理程序：

JSON.parse()

现在，由于您将以字符串形式接收数据，因此您需要使用function printRepoCount() { var responseObj = JSON.parse(this.responseText); console.log(responseObj.name + " has " + responseObj.public_repos + " public repositories!"); } var request = new XMLHttpRequest(); request.onload = printRepoCount; request.open('get', 'https://api.github.com/users/funchal', true) request.send() // => Giovanni Funchal has 8 public repositories!解析字符串以执行任何有意义的操作。假设我想调试您的公共存储库的数量以及您的名称。我可以使用此函数将字符串解析为JSON，然后我可以提取我想要的属性：

XMLHttpRequest

有关{{1}}的更多信息，请参阅the W3C spec和Mozilla Developer Network。

从javascript使用github API的示例

1 个答案: