Политика GitHub API CORS

Я использую jQuery и ajax для выполнения запроса на получение к API GitHub, но после того, как я обновляюсь примерно 3 раза, запрос начинает терпеть неудачу, говоря:

Доступ к XMLHttpRequest по адресу 'https://api.github.com/users/X/repos'from origin' my domain 'был заблокирован политикой CORS: на запрошенном ресурсе отсутствует заголовок' Access-Control-Allow-Origin '

хотя я зарегистрировал свой домен как приложение GitHub OAuth.

Вот мой javascript:

let repos = [];
const isEnglish = document.documentElement.lang == 'en';
class Repo {
  constructor(name, description, webUrl, apiUrl) {
    this._name = name;
    this._description = description;
    this._webUrl = webUrl;
    this._apiUrl = apiUrl;
    this._languages = [];
    this.fetchLanguages();
  }

  get name() {
    return this._name;
  }

  get description() {
    return this._description;
  }

  get url() {
    return this._webUrl;
  }

  get languages() {
    return this._languages;
  }

  set languages(value) {
    this._languages = value;
  }

  async fetchLanguages() {
    const url = this._apiUrl + '/languages';
    await $.ajax({ url: url, complete: data => { this._languages = Object.keys(data.responseJSON); }, }); } } $(document).ready(async () => {
  $.ajax({ url: 'https://api.github.com/users/X/repos', complete: xhr => { repos = xhr.responseJSON.map(json => { return new Repo(json.name, json.description, json.html_url, json.url); }); // build up list based on data const container = document.getElementById('projectListContainer'); repos.forEach(repo => { const li = document.createElement('li'); //header const collapsibleHeader = document.createElement('div'); collapsibleHeader.classList.add('collapsible-header'); const headerText = document.createTextNode(repo.name); collapsibleHeader.appendChild(headerText); li.appendChild(collapsibleHeader); //body const collapsibleBody = document.createElement('div'); collapsibleBody.classList.add('collapsible-body'); const description = document.createElement('p'); const descText = document.createTextNode(repo.description); description.appendChild(descText); collapsibleBody.appendChild(description); const languages = document.createElement('p'); languages.style.marginTop = '1rem'; const langTxt = isEnglish ? 'Languages used: ' : 'Talen gebruikt: '; const langText = document.createTextNode(langTxt + repo.languages); languages.appendChild(langText); collapsibleBody.appendChild(languages); const url = document.createElement('a'); url.href = repo.url; url.target = '_blank'; url.style.marginTop = '1rem'; url.style.display = 'block'; url.style.fontSize = '12px'; const urlText = document.createTextNode(repo.url); url.appendChild(urlText); collapsibleBody.appendChild(url); li.appendChild(collapsibleBody); container.appendChild(li); }); }, error: () => { const container = document.getElementById('projectListContainer'); const div = document.createElement('div'); div.classList.add('center'); const txt = isEnglish ? 'Something went wrong or the request limit is reached, check back later!' : 'Er is iets fout gegeaan of het maximum aantal requests is bereikt, kom later terug!'; const text = document.createTextNode(txt); div.appendChild(text); container.appendChild(div); }, }); updateTable(); }); const updateTable = () => { repos.forEach(repo => { const tdLanguages = document.getElementsByClassName(`${repo.name}Lang`)[0];
    tdLanguages.innerHTML = repo.languages.join(', ');
  });
};

Для запросов без аутентификации они ограничивают до 60 запросов в час. Вы можете увеличить это количество до 5000 в час, аутентифицируя запросы api.

Итак, когда я столкнулся с этой проблемой пару недель назад, я создал personal_auth_tokenна gihub и передал этот токен в, headersи проблема была решена.

Чтобы сгенерировать personal_auth_token, войдите в систему github.com, перейдите в настройки -> настройки разработчиков -> Персональные токены доступа и сгенерируйте один.

Передайте этот токен headersниже Auhtorization: *token*. Итак, в вашем запросе AJAX это может выглядеть примерно так:

$.ajax({
    url: *yourUrl*
    ...
    beforeSend: function (xhr) {
        xhr.setRequestHeader('Authorization', *token*));
    },
});

Здесь следует отметить одну вещь: НЕ размещайте код с this tokenна github, если репозиторий является общедоступным. Это немедленно обнаруживается token, аннулируется, и вам необходимо создать его снова.

Для запросов API с использованием базовой аутентификации или OAuth вы можете делать до 5000 запросов в час. Запросы, прошедшие проверку подлинности, связаны с пользователем, прошедшим проверку подлинности, независимо от того, использовалась ли обычная проверка подлинности или токен OAuth. Это означает, что все приложения OAuth, авторизованные пользователем, имеют одинаковую квоту в 5000 запросов в час, когда они проходят аутентификацию с использованием разных токенов, принадлежащих одному и тому же пользователю.

Для неаутентифицированных запросов ограничение скорости позволяет обрабатывать до 60 запросов в час. Запросы, не прошедшие проверку подлинности, связаны с исходным IP-адресом, а не с запросом пользователя.

https://developer.github.com/v3/#rate-limiting

Другое решение, которое эффективно сработало в моем случае, заключалось в решении CORSпроблемы с прокси-сервером. В этом случае вам просто нужно добавить URL-адрес запроса API к провайдеру прокси-службы, например,https://cors-anywhere.herokuapp.com/

var url = "http://example.com/repo"; //your api request url,
var proxyUrl = `https://cors-anywhere.herokuapp.com/${url}`;

fetch(proxyUrl)... //Make a request with this proxy url to navigate CORS issue

По правде говоря, GitHub REST API не отвергает CORS (см. Старый документ ).
Даже если у вас есть ошибка CORS, это должна быть другая проблема.

В моем случае это было из-за

• старая информация: заголовок требует НЕ, Authorization: bearer YOUR__TOKENноAuthorization: token YOUR_TOKEN
• плохое использование: только опечатка
• Ошибка CORS, но успех: консоль возвращает ошибку CORS, но соединение установлено.