Local setup for Facebook Connect app development
As you might know, if you wish to work with Facebook Connect it requires your development site to be accessible to it for security reasons. So that it can verify that you (your application) have rights to access certain information from its users. In this article, in short, I’ll show you how to make your local development machine accessible from the internet. If that’s what you need, read on!
There are 3 main steps you need to do in order to accomplish this kind of accessibility:
- Getting the Accessibility
- Setup of local host
- Generating Facebook API key
So, to move on:
Getting the Accessibility
For this I chose free DynDns service. Basically what it does is that it gives you a domain you chose that will represent your local connection IP (that your ISP provided).
In order to complete this part you must do the following:
- Go to that site and register for free
- Create a new (add) host, with “hostname” you want
- For “Service Type” field, chose “Host with IP address”
- And if it isn’t already set, enter your IP
- Save the changes
Just so that this article would be easier to follow, for my “hostname” on DynDns, I chose “myproject.dyndns.org”.
And those few simple steps conclude this first part of “getting it done”. 😀
Setup of local host
In this part it all comes to 2 files – “httpd-vhosts.conf” and “hosts”.
Now their location depends on you local setup. Here’s a link that explain the basics about virtual hosts if you haven’t heard of them before.
My sample setup for “httpd-vhosts.conf” is as follows:
<VirtualHost *:80>
ServerAdmin webmaster@marcus.lc
DocumentRoot /home/mladen/workspace/myproject.dyndns.org/
ServerName myproject.dyndns.org
<Directory "/home/mladen/workspace/myproject.dyndns.org/">
Options Indexes FollowSymLinks
AllowOverride all
</Directory>
</VirtualHost>And in “hosts” file, I’ve added this line:
127.0.0.1 myproject.dyndns.orgAnd that’s about it for second part.
Generating Facebook API key
First, go to Facebook Developers page, enter App Name as you wish, and on next step confirm it.
On next screen’s left side you’ll see “Web Site” link. Follow it and enter URL like this: “http://myproject.dyndns.org/”, and for Domain enter: “myproject.dyndns.org”. Save changes.
Guess what, now you have your “Application ID” and “Application Secret” and all you have to do is start with the development. If this will be your first Facebook application, this is a good place for start.
I hope it was helpful, cheers!
11 comments
Can we add IP address as App Domain in Facebook Connect Application?
I am unable to create new host….tell me the steps please…
I am a .net developer and I was having an issues which wasted my day.
Create app give app name agree to the agreement and
Enter Captcha code
In website section enter Site URL do not enter Site Domain
In App on Facebook section enter Canvas URL do not enter Secure Canvas URL
Save changes and happily run your application from vs 2008
Note: Make sure that your port is fixed in the project.
Dear Sir, you didn’t mentioned anything about setting up magento accordingly. Like we have core_config_data and in that we store web secure/unsecure as localhost.com/magento and in host file we do 127.0.0.1 localhost.com . So does this change also require? If no then when we type myproject.dyndns.org in the browser. Magento will not start
Since FB just redirects to the URL that you specify when you created the FB app, why can’t you just use localhost or a fake URL in the app settings, and have your app running locally at that URL (may need to modify the hosts file on the local machine)? My point being that FB doesn’t actually determine that the URL is a real, live site on the internet for authentication.
how can i user FBlogin in magento login ?
Yeah, thanks, Toni. I know port-forwarding technics, but I wanted to point, that being behind some router/firewall makes dynamic dns services much more hard to use.
You need to setup traffic forwarding. And you need to distinguish local ips if there are not only you but other developers working with callback services.
@Andrey you can use an ssh tunnel from your machine to a remote server that is accessible from the internet, e.g.
This will forward any incoming connections on example.com:8090 to your localhost:80.
To make it work, on the remote server, add to the sshd config
I mean behind the office firewall in local office network
Hmmm… why wouldn’t you allow DynDns access behind firewall?
When I’m behind the firewall DynDns won’t help me 🙁