Using GitHub list-issues-for-a-repository API

Question

When you go to GitHub, under Issues, it pulls up all the open issues as an HTML page. We'd like to implement a dashboard showing all the issues in a repository, grouped by labels, including those issues which are not correctly labelled.

This is the corresponding list-issues-for-a-repository API.

While I was initially using jQuery and Javascript, am now using PHP for a proof-of-concept because its built-in session handling lets me use the same page to login, have GitHub authenticate & callback, and continue. But it doesn't matter to me, any language is okay.

I've managed to get access to the GitHub API via OAUTH2, but when I get the list of repositories via https://api.github.com/orgs/{org}/repos it comes up as an empty array.

Because the /orgs/{org}/repos API returns an empty array, of course the corresponding /repos/{org}/{repo}/issues API will return an error.

Edit: See this followup for a solution! Glad I finally got it working!

score 8 · Accepted Answer · answered Nov 04 '19 at 16:59

8

It is a rest API. You need to call some endpoints using an Http request. I don't know what language you are trying to use so I can't give you a good example on how to acheive this. If you don't know which language to use yet, use postman to create REST API call to the github API.

Let's say you want to retreive the issues of the microsoft's typescript repo, You would need to call this API endpoint :

https://api.github.com/repos/microsoft/typescript/issues

Notice here that i have replace the :owner and :repo value of documentation for the one i'm trying to get.

You can then pass some parameters to the call to filter your data, for example, the API label.

https://api.github.com/repos/microsoft/typescript/issues?labels=API

This will only return issues that are labelled as API.

This is the basics of how to use an API.

answered Nov 04 '19 at 16:59

Nicolas

8,077
4
21
51

1

Thank you. That got me part way there. It's telling me `{ "message": "Not Found", "documentation_url": "https://developer.github.com/v3/issues/#list-issues-for-a-repository" }`, but I read up and that's apparently the standard response when trying to access private repos, so researching on OAuth, etc. FWIW, using JavaScript under jQuery framework. – Yimin Rong Nov 04 '19 at 21:25
There probably is, but at this point, i cannot teach you how oauth works. There is plenty of tutorial online. I must say, don't take this the wrong way, but this is quite a big project for someone with your knownledge of APIs. I just want to make sure you know what you are getting into @YiminRong – Nicolas Nov 04 '19 at 23:31
Thank you. I've gotten OAUTH2 to work, but it's not returning expected information. Please see edit in issue. – Yimin Rong Nov 06 '19 at 21:11
Hi @Nicolas I got stuck in a scenario where i need to filter only the user-generated issues. This is the API link of a repository issue list https://api.github.com/repos/angular/angular/issues I want to filter only the user-generated issue but it also included the issue created by the "renovate[bot]". Please help me how can I do this? – Salman Ahmad - Mean Developer Jan 11 '22 at 18:40
1

@SalmanAhmad-MeanDeveloper The only filter, we seams to be able to use is `filter` with the parameter `all`. This will returns all the issues for a given repo. You can then filter out the one that have "renovate[bot]" as their property `user.login`, in whatever language you are using. – Nicolas Jan 11 '22 at 22:12
@Nicolas Thanks man I was thinking the same and I figure it out by filtering the list using user.type !== 'Bot'. Actually, I was looking at the solution from the API filter but unfortunately, no options are there. – Salman Ahmad - Mean Developer Jan 12 '22 at 05:08
@SalmanAhmad-MeanDeveloper A solution directly on the API side would be ideal, but it doesn't look like there is, no. Good luck with your project ! – Nicolas Jan 12 '22 at 12:58

Terry Lennox · Answer 2 · 2019-11-07T10:40:49.467

You can use jQuery Ajax to access the Github API and add a basic authentication header to authenticate (see here), an example is shown below, this will pull the issues for a given repo and show the first 10 in an alert window.

See the documentation on pulling issues here: https://developer.github.com/v3/issues/ to see which parameters you can use to filter, sort etc.

For example you can get all issues labelled 'bug' using:

/issues?labels=bug

This can include multiple labels, e.g.

/issues?labels=enhancement,nicetohave

You could easily modify to list in a table etc.

const username = 'github_username'; // Set your username here
const password = 'github_password'; // Set your password here
const repoPath = "organization/repo" // Set your Repo path e.g. microsoft/typescript here

$(document).ready(function() {
    $.ajax({
        url: `https://api.github.com/repos/${repoPath}/issues`,
        type: "GET",
        crossDomain: true,
        // Send basic authentication header.
        beforeSend: function (xhr) {
            xhr.setRequestHeader ("Authorization", "Basic " + btoa(username + ":" + password));
        },
        success: function (response) {
            console.log("Response:", response);
            alert(`${repoPath} issue list (first 10):\n - ` + response.slice(0,10).map(issue => issue.title).join("\n - "))
        },
        error: function (xhr, status) {
            alert("error: " + JSON.stringify(xhr));
        }
    });
});

Below is a snippet listing issues for a (public) repo using jQuery and the Github API:

(Note we don't add an authentication header here!)

const repoPath = "leachim6/hello-world" // 

$(document).ready(function() {
$.ajax({
    url: `https://api.github.com/repos/${repoPath}/issues`,
    type: "GET",
    crossDomain: true,
    success: function (response) {
        tbody = "";
        response.forEach(issue => {
            tbody += `<tr><td>${issue.number}</td><td>${issue.title}</td><td>${issue.created_at}</td><td>${issue.state}</td></tr>`;
        });
        $('#output-element').html(tbody);
    },
    error: function (xhr, status) {
        alert("error: " + JSON.stringify(xhr));
    }
});
});

<head>
<meta charset="utf-8">
<title>Issue Example</title>
<link rel="stylesheet" href="css/styles.css?v=1.0">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.4.1.min.js" crossorigin="anonymous"></script>
</head>
<body style="margin:50px;padding:25px">
<h3>Issues in Repo</h3>
<table class="table table-striped">
    <thead>
      <tr>
        <th scope="col">Issue #</th>
        <th scope="col">Title</th>
        <th scope="col">Created</th>
        <th scope="col">State</th>
      </tr>
    </thead>
    <tbody id="output-element">
    </tbody>
</table>
</body>

Thank you. I'll look at this ASAP. I'm not getting the expected results using OAUTH2, and I noticed one API `https://api.github.com/authorizations` indicated that it could be accessed only with basic authorization: `stdClass Object ( [message] => This API can only be accessed with username and password Basic Auth [documentation_url] => https://developer.github.com/v3 )`. So maybe this will work. — Yimin Rong, Nov 06 '19 at 21:17
The basic authentication works for me, using my github credentials. If you wish to access a public repo you can comment out the beforeSend section! — Terry Lennox, Nov 06 '19 at 21:19
Hi @TerryLennox I got stuck in a scenario where I need to filter only the user-generated issues. This is the API link of a repository issue list https://api.github.com/repos/angular/angular/issues I want to filter only the user-generated issue but it also included the issue created by the "renovate[bot]". Please help me how can I do this? — Salman Ahmad - Mean Developer, Jan 11 '22 at 18:46
Maybe an Array.filter will work for the user name once the issues are retrieved from the api? — Terry Lennox, Jan 11 '22 at 22:46
@TerryLennox Thanks man I was thinking the same and I figure it out by filtering the list using user.type !== 'Bot'. Actually, I was looking at the solution from the API filter. — Salman Ahmad - Mean Developer, Jan 12 '22 at 05:05

Using GitHub list-issues-for-a-repository API

2 Answers2

Linked