CORS на GitHub OAuth

Question

import request from 'superagent'; 
 

 
const self = this; 
 
    request 
 
     .post('https://github.com/login/oauth/access_token') 
 
     .set('Content-Type', 'multipart/form-data') 
 
     .query({ 
 
     client_id: CLIENT_ID, 
 
     client_secret: CLIENT_SECRET, 
 
     callback: 'http://127.0.0.1:3000/callback', 
 
     code, 
 
     state, 
 
     }) 
 
     .end((err, res) => { 
 
     const token = res.body.access_token; 
 
     console.log(token); 
 
     self.setToken(token); 
 
     });

Код выше даст мне ошибку как этот

XMLHttpRequest не может загрузить https://github.com/login/oauth/access_token?client_id=112asdecf3805fdada12& ... 127.0.0.1% 3A3000% 2Fcallback & код = 434ebd7bb98d9809bf6e & Состояние = HelloWorld1234. Нет заголовка «Access-Control-Allow-Origin» на запрашиваемом ресурсе . Origin 'http://127.0.0.1:3000' поэтому не разрешен доступ.

Я понятия не имею, почему, хотя я зарегистрировал заявление OAuth с GitHub и обратного вызова URL является http://127.0.0.1:3000/callback

Answer 1

Хотя все the actual GitHub API endpoints support CORS, отправляя заголовки правильных ответов, то a known issue что https://github.com/login/oauth/access_token конечная точка для создания токен доступа OAuth не поддерживает запросы CORS из веб-приложений.

очень специфический обходной путь для этого случая использовать https://github.com/prose/gatekeeper:

Gatekeeper: Позволяет клиентские приложения танцевать OAuth с GitHub.

Из-за некоторых ограничений, связанных с безопасностью, Github запрещает вам реализовывать поток веб-приложений OAuth только в клиентском приложении.

Это настоящий облом. Поэтому мы создали Gatekeeper, который является недостающим элементом, который вам нужен, чтобы заставить его работать.

Общее временное решение: использовать открытый обратный прокси-сервер, как https://cors-anywhere.herokuapp.com/

var req = new XMLHttpRequest(); 
req.open('POST', 
    'https://cors-anywhere.herokuapp.com/https://github.com/login/oauth/access_token', 
    true); 
req.setRequestHeader('Accept', 'application/json'); 
req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); 
req.send('code=' + encodeURIComponent(location.query.code) + 
    '&client_id=foo' + 
    '&client_secret=bar'); 
... 

Смотрите также How to use Cors anywhere to reverse proxy and add CORS headers.