Login Route
It's important that all the app will be bundled as a static asset, so the app key has to be stored somewhere.
Solution is to run a microservice
That will manage the secret key
First the login route
1. Add the login route to router
In router.js
// **** router.js ****
import ...
// ++++ 4. import qs (see below)
import qs from 'qs'
export default Router.extend({
...
routes: {
'':'public',
'repos': 'repos',
// ++++ 1. add login route
'login': 'login'
},
public () {
React.render(<PublicPage/>, document.body)
},
repos () {
React.render(<ReposPage/>, document.body)
},
// ++++ 2. redirect to Github
login () {
// documentation is at
// developer.github.com/v3/oauth/#web-application-flow
// get the url and parameters from there
window.location = 'https://github.com/login/oauth/authorize?' +
// +++ 3. Add the extra parameters
// (use qs module to serialise an object)
qs.stringify({
client_id: 'clientid_see_below',
redirect_uri: window.location.origin + '/auth/callback',
scope: 'user, repo'
})
}
})
The client_id
parameter:Github, facebook etc will give you one when you register. On your profile page (for Github) > settings > Applications > Developers Applications TAB
Here you can register your application
Here you have a callback URL. For now he uses localhost. In prod you put your address. This is the
redirect_uri
parameter aboveA this step we're sending Jimmy to the godfaher and he'll get enough information
At first run, the user will be sent to the Github authorisation page where he can authorise the app. On other runs it will remember to user and authorisation.