Problema di Axios CORS con Github oauth Non ricevendo token di accesso

Question

Ho creato 2 percorsi sulla mia app React-Redux. Ho già aggiunto le impostazioni delle applicazioni github con la home page e l'URL di callback.

1. Quando si preme questo percorso: https://reduxapp.herokuapp.com/signin Si fa clic sul pulsante di accesso Github, ==>githubGeturi

2. Github reindirizza indietro con un codice https://reduxapp.herokuapp.com/auth/callback?code=9536286a59228e7784a1 e githubSendCode ('9536286a59228e7784a1 ') viene attivata l'azione

È possibile visualizzare nella chiamata di rete OPZIONI la chiamata passa, ma la chiamata POST non si verifica mai. e si ottiene un errore di console:

XMLHttpRequest cannot load https://github.com/login/oauth/access_token?client_id=32b70bf671e04762b26c&…_secret=5851623d94887db7612d4c9bc689310b9d53284b&code=9536286a59228e7784a1. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://reduxapp.herokuapp.com' is therefore not allowed access. 

Di seguito le mie funzioni di azione:

const CLIENT_ID = '32b70bf671e04762b26c'; 
const CLIENT_SECRET = '5851623d94887db7612d4c9bc689310b9d53284b'; 
const ROOT_URL = window.location.origin; 
const REDIRECT_URL = `${ROOT_URL}/auth/callback`; 
const AUTHORIZE_URL = 'https://github.com/login/oauth/authorize'; 
const ACCESS_TOKEN_URL = 'https://github.com/login/oauth/access_token'; 
const STATE = _.random(10000); 

export function githubGeturi() { 
    const GITHUB_URL = `${AUTHORIZE_URL}?client_id=${CLIENT_ID}&scope=user,public_repo&redirect_uri=${REDIRECT_URL}`; 

    return (dispatch) => dispatch(signinUrl(GITHUB_URL)); 
} 

export function githubSendCode(code) { 
    const GITHUB_URL = `${ACCESS_TOKEN_URL}?client_id=${CLIENT_ID}&client_secret=${CLIENT_SECRET}&code=${code}`; 

    axios.defaults.headers.post['Access-Control-Allow-Origin'] = '*'; 
    const axiosPost = axios.post(
    GITHUB_URL, 
    { 
    headers: { 
     'Content-Type': 'application/x-www-form-urlencoded', 
     'Accept': 'text/json' 
    } 
    }); 

    return (dispatch) => { 
    dispatch(signinRequest()); 
    return axiosPost 
     .then(
     success => dispatch(signinSuccess(success)), 
     error => dispatch(signinError(error)) 
    ); 
    }; 
} 

======== L'unico modo possibile che ho trovato è fare chiamata POST con il server . È possibile visualizzare l'intera soluzione qui: https://github.com/steelx/ReduxWeatherApp/commit/6215634ca543a4760ea96397fe31b61f22184d91

Answer 1

Sembra che non è possibile effettuare una chiamata a quel punto finale tramite JavaScript

https://github.com/isaacs/github/issues/330

Sul tuo esempio vedo che OPZIONI metodo chiamata non riesce, e questo perché Axios lo fa quando si aggiungono intestazioni extra da richiedere, ma fallisce anche la chiamata POST.

È possibile configurare un proxy tra l'app e github sul server che inoltra semplicemente le richieste e le risposte con risposta.