I got a job interview which requires me to create a web app with Facebook login. I created the app and everything is working fine, But I got problems...
I noticed that my login page works only with my facebook account because it is in developer mode - this is a big problem for me because my interviewer wont be able to use this feature.
Is threre any way to allow all users test my app without going public with it (I dont have privacy policy , urls, etc...)
for now I am thinking to create a fake test account and send by mail but it is stupid Idia...
Go to your Facebook app Dashboard and under Roles tab try adding your client profile as Administrators/Developers/Testers your client has to accept the provided role and now it should work as expected.
I have a React/Horizon app with facebook login.
I am wondering if there is any option to work with facebook login from localhost?
There are some other good answers here. However I want to add information about how to create a Test app (as recommended by Facebook).
Go to the page to manage Facebook apps (you, the admin must be logged in): https://developers.facebook.com/apps/
Hover over the block containing your live Facebook app and click on the three dots button that appears on the bottom right corner. Then select Create Test App from the menu.
The test app will be created with a snapshot of your production app's settings. After this, you can independently edit the settings of your test app without affecting your production app.
See the documentation here: https://developers.facebook.com/docs/apps/test-apps/
Regarding the rest of the setup:
keep your app in Development mode
go to Settings -> Basic (left hand menu) and
enter "localhost" for the App Domain
change your Site URL to the localhost version (e.g. http://localhost:3000/users/auth/facebook)
Here are some (Jan 2022) screenshots of my test app settings, which I just use for Facebook login.
Settings -> Basic
Settings -> Advanced
Facebook Login -> Settings
You need to register as facebook developer and create you app there. Once you have your web app registered you can go to your app and click on add product.
Add Facebook Login. Then enable Web OAuth Login and add your localhost in the textfield below and save, you should be able to access it. Attaching a sample screenshot of my facebook app.
Disclaimer: This answer was written in 2019 and I have not been able to keep up with the latest changes introduced by Facebook, this is here for reference purposes.
So in my case doing the following things worked for me.
Make sure your application is in development mode
Make sure you don't have anything in Valid OAuth Redirect URIs when working from localhost
Make sure you don't have anything in App Domains also
Make sure you have entered localhost in your site url
I would like to add an update: July 2019
Facebook now allow localhost automatically in development mode and it is blocked in production mode. All you have to do is turn on development mode in your app settings and you are good to go.
You do not need to add localhost as a redirect URL anymore.
Here you can see the error at the Redirect URLs when I'm trying to add localhost.
You can use a tunneling tool like https://ngrok.com/ which is free for at least one instance. Then you can create a test App as already suggested and use the ngrok generated urls in this test app.
After test I see that we don't need to setup anything in facebook app
(even Site URL don't need to be localhost)
Just need to use https://localhost instead of http://localhost. Then login work and we able to receive response.
Note: If you see SSL warning after you enter https://localhost to browser. Just click on Advance -> Process to ... (unsafe)
The method FB.login can no longer be called from http pages.localhost, I get: App domains must match the domain of the Facebook Web Games URL (https), Mobile Site URL, Unity Binary URL, Site URL or Secure Page Tab URL. Please correct at least one of these domains: localhost
Using something like local-ssl-proxy is an easy way to solve this.
So I also have problem with working with Facebook Login from localhost in React and Express and I got this info:
"The method FB.login can no longer be called from http pages". After click login button, app just crashed.
My solution to fix this mess, was delete Facebook cookie from this localhost page. After this, I still have this error about http, but I can proceed and test login options.
Other solution is working in incognito mode.
I'm using Firebase to log into Facebook and honestly, the easiest thing was to just get your localhost served over HTTPS. I used ssl-serve for it, since I was working on a very basic ESM app with no build tools. But most build pipelines (e.g. Vue's vue-cli, React, etc.) have a CLI option for SSL as well.
What I used:
cd src && npx ssl-serve --ssl --clipless --port 5000 --silent
Then you just accept the self-signed cert ("Advanced" > "Continue" in Chrome/Brave) and you won't need to mess around with swapping the redirect URIs or domains under your Facebook app's config, nor the Facebook App IDs on Firebase.
Facebook provide Test App for your current app to get access to localhost environment. Create a test app on facebook https://developers.facebook.com/docs/development/build-and-test/test-apps/
and use the API and Secret to get testing on localhost.
I would like to share my experience for anyone who use firebase authentication combine with facebook login. Below solution work for me:
First, set your App Mode is development at https://developers.facebook.com.
Next, when you enable facebook login in Firebase Authentication, firebase will give you a link call OAuth redirect URI, you will have to add this link to the Valid OAuth Redirect URIs field in the setting page of your facebook app (inside tab Facebook Login). This is the most important step.
Finally, you don't need to do anything else. Good luck.
If you're using react and your local server is on http and still getting the error run this in the terminal to start up an https localhost
Windows:
set HTTPS=true&&npm start
Windows Powershel:
($env:HTTPS = "true") -and (npm start)
Linux and macOS (Bash):
HTTPS=true npm start
when it opens in the browser
click Advanced and proceed
Pretty much what the title says.
There are tons of questions about this but the vast majority was only a matter of a missing HTTPS URL, a couple are due to misconfigured app restrictions, and the rest are unsolved.
I have no country or age restrictions in my app, I have both HTTP and an HTTPS URLs, I can see the page when logged in as a page admin and everything works fine, but when visiting the page while logged out, I don't see the tab.
Also, this is not a matter of clicking the tab and not having any content displayed, like in some other questions here. If I'm logged in with my The actual tab link is missing and if I copy the tab URL from when I'm logged in and then try to access it while logged out, I am simply redirected to the page.
I don't think it matters much but this is a tab that has been created via the Graph API. The Graph API docs don't mention anything about tab visibility, at least as far as I see.
This is driving me crazy, I've been at it for hours and can't find any solution or even a hint at what the problem might be.
Any ideas?
EDIT: All I described above is happening with our staging application, which has a self-signed SSL certificate. The live application, which has a "proper" SSL certificate, works just fine. Could the self-signed certificate be the cause of the problem?
Had the same issue this morning. Remove any audience restrictions from your app e.g 13 + or location as this means people have to login to see your app.
So it turns out it was stupidly simple: it was happening on our staging application but not on our live application because our live application uses a non-test FB app, while staging uses a test FB app, which is never seen by people who are not developers (or other staff) on that app.
Talk about wasted time...
I've created a facebook app for my site and an html page where i can login into the user account allowing the app for do that...
So, this work correctly when i attempt to logon with the my account, that are the ADMIN of the page, but with other else account, the facebook popup window retrieve an error (with no useful details).. my sensation is that the app is not open to the public, how i can open it for the public?
Are you sure you haven't forgotten to take the app out of Sandbox mode in the app's advanced settings?
By default sandbox mode is not enabled, but yes try this way. If it's not that can you please bring us some code?
I'm trying to add facebook connect to my online mafia game that I own.
When trying to add my domain name I get this:
Error
App Domain: http://www.redhotglockz.com/ is not a valid domain.
It is valid cause I am logged in right now, the site is working fine.
I had to pay money to add this to my site, after purchase I go into my site control panel and into the newly available facebook connect option. It gave me an app name and game url and a link to facebook to create a new app. I followed this link and added the info as instructed, and result was invalid domain name. I used copy and paste to enter info. And url shown is correct.
Any idea how i can fix this?
thank you in advance.
i figured out my problem...
i was posting app domain as www.ReDHoTGLoCKz.com
facebook wouldn't accept it using caps.
it worked using www.redhotglockz.com
thanks for your responses!
check your facebook app configuration at https://developers.facebook.com/apps . make sure in basic setting, you set your App Domain with your url.
That's not a domain, that's a URL.
Enter just redhotglockz.com and it should work fine.