Omniauth with Facebook

This week I created my first Ruby on Rails application. I created a simple “creepypasta” website named “The Haunted Library”, where users and create and share their own scary stories, view other users stories and sort them by author or genre. Besides learning how to get a rails project up and running, the toughest part was getting the gem “omniauth” to work properly and allow my users to sign in using their Facebook accounts. This blog will be my attempt at explaining how I finally got it to work and the errors I ran into.

The first thing you need to do is add the omniauth gem and the strategy for whatever specific website you want to add for your users into your gem file.

You don’t need to add omniauth & omniauth-facebook, you just need to add the strategy you want but I added both just incase.

Due to the omniauth recent update you need to add “gem ‘omniauth-rails_csrf_protection’” or you will get a csrf(cross site request forgery)error that will stop your code from running correctly.

Next you will want to go into your /config/initializers/ folder and create a “omniauth.rb” file inside it and add the following code.

Your code may look different depending on which “provider”, you decide to go with.

You need to obtain your websites “key” and “secret” from your websites developer page. You can find out where to get them at(https://dev.to/nkemjiks/implementing-facebook-authentication-with-devise-for-your-rails-6-app-1p3b) just follow the first half to get your key and secret. Once you have those two things, you want to create a .env file in your main branch inside you want to add your key and secret as follows.

Obviously you would put whatever your key and secret are after the equal sign.

You don’t want to show your key and secret to anyone so make sure you add your .env file in your .gitignore file so it doesn’t get pushed to your repo on github.

Once you have your omniauth.rb and .env files set up you need to go into your /config/routes.rb file and create the following route.

You can route it to whichever controller you want, I chose my sessions controller.

After you set up your routes you want to go into your views and add a button_to ‘/auth/facebook’. You do NOT have to create a ‘/auth/facebook’ route because omniauth automatically sends you to your chosen providers log in page and then gets sent to your ‘/auth/facebook/callback’ route which brings you back to your rails app. Add the following code to your chosen views page.

I added this line to my ‘sessions/new’ view file but you can add it where ever you want to add your login page.

You normally don’t need to add “method: :post” since button_to normally sends a post request, however I ran into a bug where my button was sending a get request instead so in order to fix it I specified the post method.

Next I created a omniauth method inside of my sessions_controller and added the following code.

This piece of code makes sure to add your facebook user(or whatever provider you use) into your database.

This is how omniauth searches for info from the provider.

If you notice, I added a “from_omniauth” method which is referring to my last piece of code which I added into my user model.

This last piece of code is grabbing whatever specific info you want from your user and adds it to your database each provider words their info a bit different so you need to look in to it but it’s somewhat similar. Just make sure that whatever info you choose to get is also in your users migration otherwise the users info won’t be saved in your database. Hopefully this post helps you avoid some of the errors I encounter and you are able to get your rails applications up and running.