EmberCLI, Github authentication and DivShot
I don’t want to do authentication.
It’s just troublesome. I say let someone else deal with it and I’ll just manage my application. I don’t want to store your passwords anymore.
This will be a multi part post, building a simple chat application. I may never actually build the chat functionality, as I’m more interested in setting up the authentication side of things. Non the less, context helps.
To make authenticating with github super simple we’re going to use torii to handle our user flow. Torii has some really nice abstractions and isn’t opinionated on how your app should behave. It has an optional session manager (which I’ll end up using), providers for authenticating with external services (such as github), and adapters for talking to your backend.
Let’s go ahead and generate a new ember-cli app and add torii:
We can then setup our application template to show a login button:
session is provided by Torii via a config setting we’ll supply to
config/environments later. Lets get that
signInViaGithub action setup:
and our Torii adapter so we can control the logic for the temporary token returned from github:
Here I’ve placed the url into
config/environment.js as it will change between
development and production.
I’ve modified it slightly, but all of the above can be found on the Torii github page.
I can then run my server with
ember s --proxy=http://localhost:9000. The
--proxy option means that any ajax requests my app makes will be forwarded to
the provided address. When I end up making my rails app, I’ll have it host on
port 9000 and hopefully everything should be wired up.
Next we’ll need to go get an api key from github. Login to github, hit settings and head to ‘Applications’ (It should be a menu item on the right). You should then be able to ‘Register new application’ and set it’s callback URL to localhost:4200.
With this setup, when we go to
localhost:4200 we should see our button to
login to github. Pressing it will take you to github and ask you to allow the
app access to you github account. Accepting, will redirect back to the app and
try to post the temporary token from github to
course this won’t work yet as there isn’t anything listening at port 9000.
Usually at this point I’d start looking at the rails side of things but I’m leaving that for the next blog post. Instead, I’m going to talk about getting this off of localhost.
Divshot is a static web hosting service that I like to think of as Heroku for ember-cli. There’s even an addon to help get setup so we’re going to be using it. Go get an account setup at divshot and run through the getting started, then run the following:
This should give us a
divshot.json file to setup settings for our app. Let’s
add some settings for proxying to
where our rails app will eventually live on heroku:
Now we just need some settings for our new production environment:
Don’t forget to setup a production github application to fill in the
Now let push our application up divshot. At the time of writing,
ember-divshot-cli doesn’t build in the production environment before pushing
to divshot so we’ll use the plain old divshot-cli (which should have been
installed during signup) and build the site ourselves:
We’ll look into setting up a rails app to authenticate with github and push it up to Heroku.