web-dev-qa-db-ja.com

GitHub list-issues-for-a-repository APIの使用

GitHubに移動すると、[Issues]で、未解決のすべての懸案がHTMLページとして表示されます。正しくラベル付けされていない問題を含む、ラベルでグループ化されたリポジトリ内のすべての問題を表示するダッシュボードを実装したいと思います。

これは対応する list-issues-for-a-repository API です。

私は最初にjQueryとJavascriptを使用していましたが、組み込みのセッション処理により同じページを使用してログインできるため、PHPを概念実証に使用しています。GitHubに認証とコールバックを行ってください。 、そして続けます。しかし、それは私には関係ありません、どんな言語でも大丈夫です。

OAUTH2経由でGitHub APIにアクセスできましたが、https://api.github.com/orgs/{org}/repos経由でリポジトリのリストを取得すると、空の配列として表示されます。

/orgs/{org}/repos AP​​Iは空の配列を返すため、対応する/repos/{org}/{repo}/issues AP​​Iはもちろんエラーを返します。

Edit:解決策は this followup を参照してください!やっと動作しました!

9
Yimin Rong

REST APIです。 Httpリクエストを使用していくつかのエンドポイントを呼び出す必要があります。私はあなたがどの言語を使おうとしているのかわからないので、これを達成する方法の良い例を示すことはできません。使用する言語がまだわからない場合は、 postman を使用してREST github APIへのAPI呼び出しを作成します。

MicrosoftのTypeScript repo の問題を取得したいとします。このAPIエンドポイントを呼び出す必要があります。

https://api.github.com/repos/Microsoft/TypeScript/issues

ここで、:ownerおよび:repo取得しようとしているドキュメントの値。

次に、APIラベルなどのいくつかのパラメーターを呼び出しに渡して、データをフィルター処理できます。

https://api.github.com/repos/Microsoft/TypeScript/issues?labels=API

これは、APIのラベルが付いた問題のみを返します。

これは、APIの使用方法の基本です。

7
Nicolas

JQuery Ajaxを使用してGithub APIにアクセスし、認証するための基本認証ヘッダーを追加できます( here を参照)。次に例を示します。これにより、特定のリポジトリの問題がプルされ、最初の10件が表示されます警告ウィンドウ。

プルの問題に関するドキュメントはこちら https://developer.github.com/v3/issues/ を使用して、フィルタリング、並べ替えなどに使用できるパラメーターを確認してください。

たとえば、次のコマンドを使用して、「バグ」というラベルの付いたすべての問題を取得できます。

/issues?labels=bug

これには、複数のラベルを含めることができます。

/issues?labels=enhancement,nicetohave

テーブルなどのリストに簡単に変更できます。

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

以下は、jQueryとGithub APIを使用する(パブリック)リポジトリの問題をリストするスニペットです。

(ここでは認証ヘッダーを追加しないことに注意してください!)

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>
4
Terry Lennox