Make local development work with Facebook/Google APIs

Question

I'm working on implementing omniauth into a Rails project. My problem is that the authentication providers - Twitter, Google, Facebook etc all require me to create an application with a url that limits authentication requests from anywhere other than the url. I need to be able to to test locally but also run code in production, but Facebook for example doesn't allow 2 domains and doesn't allow localhost anyhow.

So what are my options?

Strand McCutchen · Answer 1 · 2012-08-01T00:33:25.770

Here's a blog post with my solution: http://make.bettermistak.es/2012/05/03/how-to-create-a-local-sandbox-facebook-app/

Here's the relevant bit: "Facebook verifies that all requests for your app are coming from the right domain–they don’t allow requests from localhost or 127.0.0.1–and this info can be updated in your apps settings under Hosting URL. Add “local.herokuapp.com” to your Hosting URLs and save this setting. Then edit your /etc/hosts file so that local content is under the domain local.herokuapp.com. This file is hidden, so from the command line enter sudo vi /etc/hosts. (Substitute your favorite editor for vi.) We need to use sudo, because this file is locked. Add the line “127.0.0.1 local.herokuapp.com” below “127.0.0.1 localhost” and save and quit your text editor."

score 3 · Accepted Answer · answered Jan 11 '12 at 12:24

3

At work, we have multiple applications setup for the different environments. On local, add an entry in /etc/hosts (assuming you are on linux) eg: 127.0.0.1 mydomain.local.

On the facebook app setup for the local environment, add this as the url. Most things, except where facebook needs to scrape your site (Like buttons) work.

answered Jan 11 '12 at 12:24

zsquare

9,916
6
53
87

Thanks for answering. I've added the following: 127.0.0.1 development.mydomainname.com to hosts and flushed the cache, but Chrome cannot connect to development.mydomainname.com. Any ideas? – Undistraction Jan 11 '12 at 12:33
Is it just chrome? Does the page load on another browser? – zsquare Jan 11 '12 at 12:44
Sorry. No its all browsers. They can't connect to the server 'development.mydomainname.com' – Undistraction Jan 11 '12 at 12:49
Do I need to remove the localhost entry that is already there? – Undistraction Jan 11 '12 at 12:58
no, that would remove the binding between 127.0.0.1 and localhost – zsquare Jan 11 '12 at 13:10
The problem with Rails is that you must connect to development.mydomainname.com:3000 or start the server on another port. – collimarco Feb 20 '13 at 12:33

score 1 · Answer 3 · answered May 06 '12 at 08:11

As far as I know, you must sing up two apps for you app.(one for remote side, one for local side)

Fortunately, there is a way to reduce the complication(Assuming you are working on linux):

You can configure you .bash_profile (local machine and remote machine separately):

export YOURAPP_APP_ID="XXXXX"                                         
export YOURAPP_APP_SECRET="XXXXX"

And use ENV['YOURAPP_APP_ID'] and ENV['YOURAPP_APP_SECRET'] in your code. For example, you can code like this in rails:

config.omniauth :facebook, ENV['YOURAPP_APP_ID'], ENV['YOURAPP_APP_SECRET']

By this way, you can use the same code in both local and remote side. It will be much easier for maintaining.

If you are using Heroku to host your application, you can refer to this page to config the environment variables.

Yes. In the end I used the two-app solution. One for remote and one for local. — Undistraction, May 07 '12 at 20:32

score 0 · Answer 4 · answered Jan 11 '12 at 12:25

0

I have created two apps on Facebook one of which i run in sandbox mode for development purposes. Would that be an option for you?

answered Jan 11 '12 at 12:25

Volker Pacher

1,827
18
8

Thanks. Yes, that is a possibility. It still doesn't solve the problem that I can't use localhost for Facebook though. – Undistraction Jan 11 '12 at 12:37
if you have a dynamic ip you could use something like dyndns.com to assign a fqdn, that is what we are doing here and using for the development app. – Volker Pacher Jan 11 '12 at 12:43

Make local development work with Facebook/Google APIs

4 Answers4

Linked