Facebook App : This must be derived from Canvas URL, Secure Canvas URL

Question

Hi I wan\'t to create a facebook app to use it for the auth in my new site locally installed(my machine),but from yesterday I don\'t succeed to install it and use it, all time I

Answer 1

I had this same problem yesterday, the stackoverflow answers that helped me the most were Make local development work with Facebook/Google APIs and Canvas URL / Secure Canvas URL error message ( Also checkout How to handle OmniAuth callbacks in multiple environments?)

The Facebook developer UI has changed a bit. I'm writing this answer to consolidate all the info that helped me.

1. Make local.host Point to Your Computer

First thing you need to do is (as answered in the first link), facebook won't take localhost as a valid callback site, because it confuses localhost with a top level domain (com org etc.) in other words there is not dot . in your domain name. So change your /etc/hosts to add the entry

127.0.0.1   local.host

Now youcan access your app at http://local.host/... (this will take effect as soon as you save /etc/hosts file, no need to restart anything)

2. Add local.host as the Site URL on the facebook Dev Console

The second thing you need to do is add local.host as the site url on the facebook page

Now don't use your production app. Add a dummy app on your https://developers.facebook.com account Because your production app will have to set the site URL to your production URL and not local.host

Configure the dummy app as shown in the screenshot. But that website section(shown in the screenshot) won't be visible on the Basic settings page from the beginning.

First you will have to click + Add Platform button at the bottom, and select Website.

Notice I added http://local.host:3000/. That's where my ruby server runs in dev mode.

Also, be sure to use App Id and App Secret for the dummy app when running your webapp in dev mode.

HTH.