Использование API GitHub list-questions-for-a-repository

Когда вы заходите на GitHub в разделе «Проблемы», он отображает все открытые проблемы в виде HTML-страницы. Мы хотели бы реализовать панель инструментов, отображающую все проблемы в репозитории, сгруппированные по меткам, включая те, которые не были правильно помечены.

Это соответствующий API списков проблем для хранилища .

В то время как я первоначально использовал jQuery и Javascript, сейчас я использую PHP для проверки концепции, потому что его встроенная обработка сеансов позволяет мне использовать ту же страницу для входа в систему, аутентификации и обратного вызова GitHub и продолжения. Но это не важно для меня, любой язык в порядке.

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

Поскольку /orgs/{org}/reposAPI возвращает пустой массив, конечно, соответствующий /repos/{org}/{repo}/issuesAPI вернет ошибку.

Изменить : Смотрите это продолжение для решения! Рад, что наконец-то все заработало!

Это API отдыха. Вам нужно вызвать некоторые конечные точки, используя запрос Http. Я не знаю, какой язык вы пытаетесь использовать, поэтому я не могу дать вам хороший пример того, как этого добиться. Если вы еще не знаете, какой язык использовать, используйте почтальон, чтобы создать вызов API REST для 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 для доступа к Github API и добавить базовый заголовок проверки подлинности для проверки подлинности (см. Здесь ), пример показан ниже, при этом будут устранены проблемы для данного репозитория и показаны первые 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>