I am planning to connect to Facebook chat from my localhost. I will need to get the session key from Facebook. When I give the site URL as localhost:8080
or ip-address:8080
it does not work.
I read about setting up two apps with 2 different API keys one runs on dev m/c and other on localhost but I did not quite get it.
Can anyone explain how to run a Facebook app on localhost?
This question is related to
facebook
localhost
facebook-chat
You need to setup your app to run over https for localhost
You can follow steps given in this to setup HTTPS on ubuntu
You need to do following steps:
install apache (if you do not have)
sudo apt-get install apache2
Step One—Activate the SSL Module
sudo a2enmod ssl
sudo service apache2 restart
Step Two—Create a New Directory
sudo mkdir /etc/apache2/ssl
Step Three—Create a Self Signed SSL Certificate
sudo openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout /etc/apache/ssl/apache.key -out /etc/apache2/ssl/apache.crt
With this command, we will be both creating the self-signed SSL certificate and the server key that protects it, and placing both of them into the new directory. The most important line is "Common Name". Enter your official domain name here or, if you don't have one yet, your site's IP address.
Common Name (e.g. server FQDN or YOUR name) []:example.com or localhost
Step Four—Set Up the Certificate
sudo vim /etc/apache2/sites-available/default-ssl
Find following lines and edit those with your settings
ServerName localhost or example.com
SSLEngine on SSLCertificateFile /etc/apache2/ssl/apache.crt
SSLCertificateKeyFile /etc/apache2/ssl/apache.key
Step Five—Activate the New Virtual Host
sudo a2ensite default-ssl
sudo service apache2 reload
A trick:
Use MAMPPRO and create: server name: the EXACT adress of you website (eg: helloworld.com) to your site on your disk
On Facebook: So you can keep your original Site URL as well (eg: helloworld.com)
Now you understand that when you type your website on the adress bar you are in local! ..and when you want to be online, just inactive the server on MAMP PRO..
:)
if you use localhost:
in Facebook-->Settings-->Basic, in field "App Domains" write "localhost", then click to "+Add Platform" choose "Web Site",
it will create two fields "Mobile Site URL" and "Site URL", in "Site URL" write again "localhost".
works for me.
just specify your canvas url as http://localhost/app_path.
You can also edit 'hosts' file and create local variation of your domain.
Example
If your real facebook application address is "example.com" you can create "localhost.example.com" (accessible only from your pc) domain in your "hosts" file pointing to "localhost" and run your local website under this domain. You can trick Facebook this way.
Ok I'm not sure what's up with these answers but I'll let you know what worked for me as advised by a senior dev at my work. I'm working in Ruby on Rails and using Facebook's JavaScript code to get access tokens.
Problem: To do authentication, Facebook is taking the url from your address bar and comparing that with what they have on file. They don't allow you to use localhost:3000
for whatever reason. However, you can use a completely made-up domain name like yoursite.dev
by running a local server and pointing yoursite.dev
to 127.0.0.1:3000
or wherever your localhost was pointing to.
Step 1: Install or update Nginx
$ brew install nginx
(install) or $ brew upgrade nginx
(update)
Step 2: Open up your nginx config file
/usr/local/etc/nginx/nginx.conf
(usually here)
/opt/boxen/config/nginx/nginx.conf
(if you use Boxen)
Step 3 Add this bit of code into your http {}
block
Replace proxy_pass
with wherever you want to point yoursite.dev
to. In my case it was replacing localhost:3000 or the equivalent 127.0.0.1:3000
server {
listen yoursite.dev:80;
server_name yoursite.dev;
location / {
proxy_pass http://127.0.0.1:3000;
}
}
Step 4: Edit your hosts file, in /etc/hosts
on Mac to include
127.0.0.1 yoursite.dev
This file directs domains to localhost. Nginx listens in on localhost and redirects if it matches a rule.
Step 5: Every time you use your dev environment going forward, you use the yoursite.dev
in the address bar instead of localhost:3000
so Facebook logs you in correctly.
Forward is a great tool for helping with development of facebook apps locally, it supports SSL so the cert thing isn't a problem.
https://forwardhq.com/in-use/facebook
DISCLAIMER: I'm one of the devs
In your app's basic settings (https://developers.facebook.com/apps) under Settings->Basic->Select how your app integrates with Facebook...
Use "Site URL:" and "Mobile Site URL:" to hold your production and development URLs. Both sites will be allowed to authenticate. I'm just using Facebook for authentication so I don't need any of the mobile site redirection features. I usually change the "Mobile Site URL:" to my "localhost:12345" site while I'm testing the authentication, and then set it back to normal when I'm done.
None of the answers above worked for me. I am running on FB API 2.5. Mine was a combination of issues that lead to success once resolved
It's probably not ideal as Dynamic IP's change and one could probably use DynDNS or something similar to make the IP more "static" but it worked for me
2013 August. Facebook doesn't allow to set domain with port for an App, as example "localhost:3000".
So you can use https://pagekite.net to tunnel your localhost:port
to proper domain.
Rails developers can use http://progrium.com/localtunnel/ for free.
So I got this to work today. My URL is http://localhost:8888
. The domain I gave facebook is localhost. I thought that it was not working because I was trying to pull data using the FB.api
method. I kept on getting an "undefined" name and an image without a source, so definitely didn't have access to the Graph.
Later I realized that my problem was really that I was only passing a first argument of /me
to FB.api
, and I didn't have a token. So you'll need to use the FB.getLoginStatus
function to get a token, which should be added to the /me
argument.
In my case the issue revealed to be chrome blocking the CORS request from localhost:4200 to facebook api website. Running Chrome with this setting: "YOUR_PATH_TO_CHROME\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir="c:/chrome worked like a charm while developing. Even with no localhost added to facebook app's settings.
Source: Stackoverflow.com