Auth-Callback Route
Now we have to create a route for the auth callback in router.js
// **** router.js ****
import ...
export default Router.extend({
...
routes: {
'':'public',
'repos': 'repos',
'login': 'login',
// ++++ 1. add login route
// we can add dynamic routes
// we extract only the query string
// from the url
// we set 'auth/callback' for the
// redirect uri previously
'auth/callback?:query': 'authCallback'
},
public () { ... },
repos () { ... },
login () {
window.location = 'https://github.com/login/oauth/authorize?' + qs.stringify({
client_id: 'see_previous_note',
redirect_uri: window.location.origin + '/auth/callback',
scope: 'user, repo'
})
},
// ++++ 2. Define the route handler
authCallback (query) {
query = qs.parse(query)
console.log(query);
}
})
At this point we have the authorisation code from the user, but we still have to give the app id (client_secret
). We should not give this to the browser (as static asset).For this we need a little microservice that would pass the app secret id.
He proposes to use the gatekeeper service
github.com/prose/gatekeeper
It gives you a deploy to Heroku button, to add it to your heroku apps.
It's a very simple nodejs server
It exposes a single route. We pass it our app secret and client authorisation code as a GET request, it will post it to github, and give us back the authorisation token.
Again "no magic"...
Do an ajax request to our gatekeeper service
// **** router.js ****
import ...
// ++++ 1. add an XHR module
// follows the same pattern as
// 'request' on nodejs
import xhr from 'xhr'
export default Router.extend({
...
routes: { ... },
public () { ... },
repos () { ... },
login () { ... },
authCallback (query) {
query = qs.parse(query)
console.log(query);
// ++++ 2. do the ajax request for the token
xhr({
url: 'https://the-heroku-labelr-service-url' + query.code,
json: true
}, (err, req, body) => {
console.log(body)
})
}
})
Then in he console we get he authorisation token from github.Talks more about the Heroku setup...