Bạn có thể sử dụng jQuery Ajax để truy cập API Github và thêm tiêu đề xác thực cơ bản để xác thực (xem tại đây ), một ví dụ được hiển thị bên dưới, điều này sẽ kéo các vấn đề cho một repo nhất định và hiển thị 10 đầu tiên trong cửa sổ cảnh báo.
Xem tài liệu về các vấn đề kéo ở đây: https://developer.github.com/v3/issues/ để xem bạn có thể sử dụng tham số nào để lọc, sắp xếp, v.v.
Ví dụ: bạn có thể nhận được tất cả các vấn đề được dán nhãn 'bug' bằng cách sử dụng:
/issues?labels=bug
Điều này có thể bao gồm nhiều nhãn, ví dụ
/issues?labels=enhancement,nicetohave
Bạn có thể dễ dàng sửa đổi để liệt kê trong một bảng, vv
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));
}
});
});
Dưới đây là một vấn đề liệt kê đoạn trích cho một repo (công khai) bằng cách sử dụng jQuery và API Github:
(Lưu ý chúng tôi không thêm tiêu đề xác thực ở đây!)
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>
{ "message": "Not Found", "documentation_url": "https://developer.github.com/v3/issues/#list-issues-for-a-repository" }, nhưng tôi đã đọc và đó rõ ràng là phản hồi tiêu chuẩn khi cố gắng truy cập các repos riêng, vì vậy hãy nghiên cứu về OAuth, v.v. FWIW, sử dụng JavaScript trong khung jQuery.