Verwenden der GitHub-API für Listenprobleme für ein Repository

9

Wenn Sie zu GitHub gehen, werden unter Probleme alle offenen Probleme als HTML-Seite angezeigt. Wir möchten ein Dashboard implementieren, das alle Probleme in einem Repository anzeigt, gruppiert nach Bezeichnungen, einschließlich der Probleme, die nicht korrekt gekennzeichnet sind.

Dies ist die entsprechende Liste-Probleme-für-ein-Repository-API .

Während ich ursprünglich jQuery und Javascript verwendet habe, verwende ich jetzt PHP als Proof-of-Concept, da ich mich aufgrund der integrierten Sitzungsbehandlung auf derselben Seite anmelden, GitHub authentifizieren und zurückrufen und fortfahren kann. Aber es ist mir egal, jede Sprache ist in Ordnung.

Ich habe es geschafft, über OAUTH2 auf die GitHub-API zuzugreifen, aber wenn ich die Liste der Repositorys über https://api.github.com/orgs/{org}/repossie erhalte, wird sie als leeres Array angezeigt .

Da die /orgs/{org}/reposAPI ein leeres Array zurückgibt, gibt die entsprechende /repos/{org}/{repo}/issuesAPI natürlich einen Fehler zurück.

Bearbeiten : In diesem Follow-up finden Sie eine Lösung! Ich bin froh, dass ich es endlich geschafft habe!

Yimin Rong
quelle

Antworten:

7

Es ist eine Rest-API. Sie müssen einige Endpunkte mithilfe einer HTTP-Anforderung aufrufen. Ich weiß nicht, welche Sprache Sie verwenden möchten, daher kann ich Ihnen kein gutes Beispiel dafür geben, wie Sie dies erreichen können. Wenn Sie noch nicht wissen, welche Sprache Sie verwenden sollen, erstellen Sie mit postman einen REST-API-Aufruf für die github-API.

Angenommen, Sie möchten die Probleme des Typoskript- Repos von Microsoft beheben. Sie müssen diesen API-Endpunkt aufrufen:

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

Beachten Sie hier, dass ich den :ownerund :repoWert der Dokumentation für die ersetzt habe, die ich zu bekommen versuche.

Sie können dann einige Parameter an den Aufruf übergeben, um Ihre Daten zu filtern, z. B. die API-Bezeichnung.

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

Dies gibt nur Probleme zurück, die als gekennzeichnet sind API.

Dies sind die Grundlagen für die Verwendung einer API.

Nicolas
quelle
Vielen Dank. Das hat mich auf halbem Weg dorthin gebracht. Es sagt es mir { "message": "Not Found", "documentation_url": "https://developer.github.com/v3/issues/#list-issues-for-a-repository" }, aber ich habe es gelesen und das ist anscheinend die Standardantwort, wenn ich versuche, auf private Repos zuzugreifen, also nach OAuth usw. zu suchen. FWIW, mit JavaScript unter jQuery Framework.
Yimin Rong
Es gibt wahrscheinlich, aber an diesem Punkt kann ich Ihnen nicht beibringen, wie oauth funktioniert. Es gibt viele Online-Tutorials. Ich muss sagen, verstehen Sie das nicht falsch, aber dies ist ein ziemlich großes Projekt für jemanden mit Ihrem Wissen über APIs. Ich möchte nur sicherstellen, dass Sie wissen, was Sie in @YiminRong
Nicolas
Vielen Dank. Ich habe OAUTH2 zum Laufen gebracht, aber es gibt keine erwarteten Informationen zurück. Bitte siehe Ausgabe bearbeiten.
Yimin Rong
4

Sie können jQuery Ajax verwenden, um auf die Github-API zuzugreifen und einen grundlegenden Authentifizierungsheader zur Authentifizierung hinzuzufügen (siehe hier ). Ein Beispiel wird unten gezeigt. Dadurch werden die Probleme für ein bestimmtes Repo behoben und die ersten 10 in einem Warnfenster angezeigt.

In der Dokumentation zum Abrufen von Problemen finden Sie hier: https://developer.github.com/v3/issues/ , welche Parameter Sie zum Filtern, Sortieren usw. verwenden können.

Zum Beispiel können Sie alle Probleme mit der Bezeichnung "Fehler" erhalten, indem Sie:

/issues?labels=bug

Dies kann mehrere Etiketten umfassen, z

/issues?labels=enhancement,nicetohave

Sie können leicht ändern, um in einer Tabelle usw. aufzulisten.

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));
        }
    });
});

Im Folgenden finden Sie einen Ausschnitt mit Problemen für ein (öffentliches) Repo mit jQuery und der Github-API:

(Beachten Sie, dass wir hier keinen Authentifizierungsheader hinzufügen!)

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>

Terry Lennox
quelle
Vielen Dank. Ich werde mir das so schnell wie möglich ansehen. Ich erhalte mit OAUTH2 nicht die erwarteten Ergebnisse und habe festgestellt, dass eine API https://api.github.com/authorizationsangibt, dass nur mit grundlegender Berechtigung auf sie zugegriffen werden kann : stdClass Object ( [message] => This API can only be accessed with username and password Basic Auth [documentation_url] => https://developer.github.com/v3 ). Vielleicht funktioniert das also.
Yimin Rong
Die grundlegende Authentifizierung funktioniert für mich unter Verwendung meiner Github-Anmeldeinformationen. Wenn Sie auf ein öffentliches Repo zugreifen möchten, können Sie den Abschnitt beforeSend auskommentieren!
Terry Lennox