javascript - 使用 Javascript 获取用户的 Github 存储库列表

Question

首先感谢阅读。

我在 GitHub 上托管我当前的项目。使用 GitHub Pages，我]托管我的个人博客，you can reach the blog here .

在博客上，我有一个页面专门介绍我目前正在从事的所有项目。基本上，我想通过查询 GitHub 自动显示我所有正在进行的项目的列表。

在大量谷歌搜索时，我发现 this can be achieved using JavaScript .我试过了，但没有按预期工作。加载页面时，我只收到短信“查询 GitHub 的存储库”。似乎什么也没有发生。

我联系了 GitHub 维护者，他们友善地回答说该技术使用了过时版本的 GitHub API。

由于我没有 JavaScript 经验，谁能帮我解决这个问题？

问候，
罗兰。

---

这是我在 HTML page 中使用的代码

<div id="opensource-projects"></div> 

<!-- JavaScript to load and display repos from GitHub -->
<script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="/javascripts/git.js" type="text/javascript"></script>
<script type="text/javascript">
  $(function() {
    $("#opensource-projects").loadRepositories("Yonaba");
  });
  </script>

然后，在文件 git.js 中，我有以下内容:

// http://aboutcode.net/2010/11/11/list-github-projects-using-javascript.html

jQuery.githubUser = function(username, callback) {
  jQuery.getJSON("http://github.com/api/v1/json/" + username + "?callback=?", callback);
}

jQuery.fn.loadRepositories = function(username) {
  this.html("<span>Querying GitHub for " + username +"'s repositories...</span>");

  var target = this;
  $.githubUser(username, function(data) {
    var repos = data.user.repositories;
    sortByNumberOfWatchers(repos);

    var list = $('<dl/>');
    target.empty().append(list);
    $(repos).each(function() {
      list.append('<dt><a href="'+ this.url +'">' + this.name + '</a></dt>');
      list.append('<dd>' + this.description + '</dd>');
    });
  });

  function sortByNumberOfWatchers(repos) {
    repos.sort(function(a,b) {
      return b.watchers - a.watchers;
    });
  }
};

@jcolebrand:感谢您的帮助，但我并没有真正理解您的意思。我也尝试向 Chrome 的控制台发送一些命令。我想 $ 是 jQuery 的别名，不是吗？好吧，发送相同的东西控制台只输出多个对象，描述我的 repo 协议(protocol)。太棒了!
我认为现在的问题是正确解析它们并显示它们。哎呀，我需要为此学习 JavaScipt 语法...

Answer 1

您发布的脚本无效，因为该 URL 适用于较旧的 API。将 URL 更改为此，它应该适合您。

https://api.github.com/users/YOUR_USERNAME_HERE/repos?callback=CALLBACK

备注:callback=<YOUR_CALLBACK>是可选的。