GitHub API 失败,JavaScript FETCH

GitHub API fails with JavaScript FETCH

GitHub 似乎自 2021 年底以来进行了更新。

https://developer.github.com/changes/2020-02-10-deprecating-auth-through-query-param/

我关注了许多资源,其中以下代码增加了每小时可以执行的请求量。现在下面的请求不起作用。相反,文档说使用 CURL,因此例如以下在终端中工作:

curl -u client_id:secret_key https://api.github.com/users/<username>

我想在 JavaScript 中执行此操作,我正在 JavaScript 中使用 GitHub 用户查找器应用程序。有人可以告诉我如何让它真正起作用吗?我使用的代码如下。

TL:DR:我可以使用下面的代码访问 github API 并接收要显示的 JSON 对象,但它限制为每小时 60 个请求。 GitHub 文档说,自 2021 年底以来,不再允许使用查询参数,所以我现在迷路了。我现在如何在 JavaScript 中执行此操作?

const client_id = "df2429c311a306c35233";
const client_secret = "5c23233326680aa21629451a6401d36ec";

const fetchUsers = async (user) => {
    const api_call = await fetch(`https://api.github.com/users/${user}?client_id=df5429c311a306c356f4&
    client_secret=${client_secret}`);

    const data = await api_call.json();
    return {data};

};

EDIT/UPDATE:

const inputValue = document.querySelector("#search");
const searchButton = document.querySelector(".searchButton");
const nameContainer = document.querySelector(".main__profile-name");
const unContainer = document.querySelector(".main__profile-username");
const reposContainer = document.querySelector(".main__profile-repos");
const urlContainer = document.querySelector(".main__profile-url");

const client_id = "<user_id>";
const client_secret = "<client_secret>";

const headers = {
    'Authorization': 'Basic ' + (new Buffer(client_id + ':' + client_secret).toString('base64'))
}

const fetchUsers = async (user) => {
    const api_call = await fetch(`https://api.github.com/users/${user}`, {
        method: 'GET',
        headers: headers
    });

    const data = await api_call.json();
    return {data};

};

const showData = () => {
    fetchUsers(inputValue.value).then((res) => {
        console.log(res);

        nameContainer.innerHTML = `Name: <span class="main__profile-value">${res.data.name}</span>`

        unContainer.innerHTML = `Username: <span class="main__profile-value">${res.data.login}</span>`

        reposContainer.innerHTML = `Repos: <span class="main__profile-value">${res.data.public_repos}</span>`

        urlContainer.innerHTML = `Url: <span class="main__profile-value">${res.data.url}</span>`

    })
};

searchButton.addEventListener("click", () => {
    showData();
})

它们相当于基本身份验证类型的用户名和密码。因此,您的 Api 请求应具有以下 header.

const headers = {
      'Authorization': 'Basic ' + btoa(CLIENT_ID + ':' + CLIENT_SECRET)
    }

请注意,使用 btoa 函数是因为浏览器本身不支持 Buffer。如果 btoa 抛出错误然后尝试使用 window.btoa 并像

一样使用它
const response = await fetch(url, {method:'GET',
    headers: headers,
   })