使用 Javascript 获取用户的 Github 存储库列表 [英] Use Javascript to get the list of a user's Github repositories

问题描述

首先感谢您的阅读.

我在 GitHub 上托管我当前的项目.使用 GitHub Pages，我托管我的个人博客，你可以在这里访问博客.

I am hosting my current projects on GitHub. Using GitHub Pages, I ]host my personal blog, you can reach the blog here.

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

On the blog, I have a page dedicated to all the projects I am currently working on. Basically, I wanted to display the list of all my on-going projects automatically, via querying GitHub.

虽然谷歌搜索了很多，我发现这个可以使用 JavaScript 来实现.我试过了，但没有按预期工作.加载页面时，我只收到文本消息查询 GitHub 以获取存储库".似乎什么也没发生.

While Googling a lot, I found that this can be achieved using JavaScript. I tried it, but it didn't work as expected. When loading the page, I just get the text message 'Querying GitHub for repositories'. And nothing seems to happen.

我联系了 GitHub 维护人员，他们友好地回复说，这种技术使用的是过时版本的 GitHub API.

I contacted GitHub maintainers, and they kindly replied that this technique uses an outdated version of the GitHub API.

由于我对 JavaScript 没有经验，有人能帮我解决吗?

As I am not experienced in JavaScript, can anyone help me to fix it ?

问候，
罗兰.

这是我在HTML页面

<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 中，我有以下内容:

Then, inside the file git.js, I have the following:

// 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 的别名，不是吗?好吧，发送相同的东西控制台只是输出多个对象，描述我的存储库.太棒了！
我认为现在的问题是正确解析它们并显示它们.哎呀，我需要为此学习 JavaScipt 语法...

@jcolebrand: Thanks for your kind help, but i didn't really get what you meant. I tried sending some command to Chrome's console, too. I guess $ is an alias for jQuery, isn't it? Well, sending same stuff The console just outputs multiple objects, describing my repos. Awesome!
I think the issue is now parsing them properly and display them. Gee, I need to learn JavaScipt syntax for that...

推荐答案

您发布的脚本不起作用，因为 URL 是针对旧 API 的.将 URL 更改为此，它应该适合您.

The script that you posted isn't working because the URL is for the older API. Change the URL to this and it should work for you.

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

注意:callback= 是可选的.

这篇关于使用 Javascript 获取用户的 Github 存储库列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！