4

Yet another Facebook app/API post I know, but please read carefully.

For better clarity, I'll add here that we're currently in 2021, March 29, their API has changed quite a lot over the last few months (and might change as well), therefore most answers on StackO aren't working anymore.

Furthermore, IMO their documentations aren't fully updated yet to the current version, and have things that doesn't exist anymore (like Dev/Live mode for ex).

After making sure that my app can work with my localhost by changing:

  • Settings -> Basic -> App Domains -> 'localhost'
  • Settings -> Basic -> Add platform -> Website -> 'http://localhost:8000/')
  • Add Product -> Facebook Login -> leave everything empty
  • Make sure to run my localhost with localhost and not 127.0.0.1.

It seems that the Facebook JavaScript SDK doesn't work from an http url.

As I'm working on localhost (so not in https) it is quite annoying. After checking the FB documentation and some tooltips in the Facebook login settings, it seems that localhost should work without https enabled. And if that wasn't enough: the Enforce HTTPS button is greyed-out and cannot be turned off anymore.

I also tried to put something in the Valid OAuth Redirect URIs, but the field/tooltip doesn't let you put http://localhost:8000/:

http://localhost redirects are automatically allowed while in development mode only and do not need to be added here.

As mentioned above, there is no such thing as development mode anymore, or at least no button or anything to change or even see the mode on their new interface.

Did anyone managed to make his localhost work with the JS SDK?

Ngrok and other answers are indeed appreciated, but I would like to know first if there is a "real" solution (on FB side) at this problem ("No there isn't yet" is an acceptable answer as it will probably save a lot of time for other people). Thanks a lot!

Edit: The dev/live mode distinction still exists, but only for apps developed by individual developers. For business apps, they have been replaced with access levels. (see comment, @CBroe) However, I tried without being in business, but it didn't work either.

Killick
  • 289
  • 1
  • 11
  • The dev/live mode distinction still exists, but only for apps developed by individual developers. For business apps, they have been replaced with access levels. – CBroe Mar 29 '21 at 06:25
  • @CBroe I see, I am indeed in business app. But, I also tried with my own FB app, saw the button for Dev/Live mode, but it still doesn't work at all with http. I'll edit my post to be more specific, thank you! – Killick Mar 29 '21 at 06:59
  • There is now a thing called create test app look into that https://stackoverflow.com/a/65286193/9802012 – SujithaW Nov 18 '21 at 19:20

1 Answers1

0

It seems like there isn't any solution for my problem on Facebook side, the JavaScript error clearly says:

The Login Button plugin no longer work on http pages. Please update your site to use https for Facebook login.

As the link in the error goes to a blog post (not the documentation) and as I didn't find anything related to that problem in FB doc, well... can't use it in http pages.

Therefore for other people searching for a solution, I would recommend another StackO thread on how to turn your localhost django app to run in https (as I'm working with Django).

For those working with Google Chrome, following the above thread, you'll need to turn off Chrome error about your connection not being private, here is how:

  • open a new tab
  • paste : chrome://flags/#allow-insecure-localhost
  • enable the option 'Allow invalid certificates for resources loaded from localhost.'

Please, feel free to post another solution to my question if there is finally a way to make it work, or an update from FB side later on.

Killick
  • 289
  • 1
  • 11