Використання GitHub list-issues-for-a-repository API

Коли ви переходите до GitHub, у розділі "Випуски" він відкриває всі відкриті проблеми як HTML-сторінку. Ми хотіли б застосувати інформаційну панель, де відображаються всі проблеми у сховищі, згруповані за мітками, включаючи ті, які неправильно позначені.

Це відповідний API-список-для-репозиторію API .

Хоча я спочатку використовував jQuery і Javascript, зараз я використовую PHP для підтвердження концепції, оскільки його вбудована обробка сеансу дозволяє мені використовувати ту саму сторінку для входу, мати GitHub аутентифікацію та зворотний виклик та продовжувати. Але для мене це не має значення, будь-яка мова в порядку.

Мені вдалося отримати доступ до API GitHub через OAUTH2, але коли я отримую список сховищ через https://api.github.com/orgs/{org}/reposнього, з'являється як порожній масив.

Оскільки /orgs/{org}/reposAPI повертає порожній масив, звичайно відповідний /repos/{org}/{repo}/issuesAPI поверне помилку.

Редагувати : Дивіться цей спосіб для вирішення! Радий, що я нарешті дійшов!

Це відпочинок API. Вам потрібно викликати деякі кінцеві точки, використовуючи Http-запит. Я не знаю, якою мовою ви намагаєтесь користуватися, тому я не можу дати вам хорошого прикладу, як це досягти. Якщо ви ще не знаєте, якою мовою користуватися, скористайтеся листоношею, щоб створити REST API-виклик API github.

Скажімо, ви хочете відновити проблеми репо-версії шрифта microsoft , вам потрібно буде зателефонувати до цієї кінцевої точки API:

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

Зауважте тут, що я замінив :ownerі :repoзначення документації на ту, яку я намагаюся отримати.

Потім ви можете передати деякі параметри виклику для фільтрування ваших даних, наприклад, мітка API.

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

Це поверне лише ті питання, які позначені як API.

Це основи використання API.

Ви можете використовувати jQuery Ajax для доступу до API Github та додайте базовий заголовок аутентифікації для автентифікації (див. Тут ). Приклад наведено нижче. Це дозволить вивести проблеми для даної репо-версії та показати перші 10 у вікні попередження.

Дивіться документацію щодо вирішення проблем тут: https://developer.github.com/v3/isissue/, щоб побачити, які параметри можна використовувати для фільтрації, сортування тощо.

Наприклад, ви можете отримати всі проблеми з позначкою "помилка", використовуючи:

/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 та API Github:

(Зверніть увагу, ми тут не додаємо заголовок аутентифікації!)

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>