'The method FB.getLoginStatus can no longer be called from http pages
So I tried to implement Facebook Login feature in my nodejs backend server. For testing purpose, I am trying client side to check the login and get access token. For that, I followed the docs and it says to use Javascript SDK and I followed the procedure, but there is a problem.
window.fbAsyncInit = function() {
FB.init({
appId : '##############',
autoLogAppEvents : true,
xfbml : true,
version : 'v4.0'
})
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
}
This is the code where I want to get the user login status, but I get an error saying:
The method FB.getLoginStatus can no longer be called from http pages
I am very much aware about the production rules, but this is development mode I am working on and still getting the error. Anything I am missing? Anything I have to do? I am running it on localhost and getting the error.
Solution 1:[1]
- If your server runs on localhost (aka on your machine): Use devcert for https on localhost
- alternatively, use a self signed certificate manually
- ...or use ngrok, if you want to expose your local server
- If not on localhost, use a free certificate of Let's Encrypt with certbot: https://letsencrypt.org/docs/client-options/
Solution 2:[2]
There's an easier fix if using create-react-app: set environment variable HTTPS to true. Cange your start script in package.json
:
"scripts": {
"start": "HTTPS=true react-scripts start",
...
}
If already using a custom script, you can also add it there:
process.env.HTTPS = true;
The main advantage of the latter method is that you can add a comment to explain it.
More info on configuration in CRA: https://create-react-app.dev/docs/advanced-configuration
Solution 3:[3]
To solve this problem "The method FB.getLoginStatus can no longer be called from http pages" i used application https://ngrok.com/
and its make https in my browser on localserver via tunneling or sth like that
Windows 10 +wsl(Debian)
Download ngrok
Unzip it to folder
Run cmd and navigate to folder with ngrok
Now You can run :"ngrok http:80" <-assuming that You have apache2 service working
I have my project in different/sub folder of DocumentRoot and i need also do this:
Solution 4:[4]
In package.json I just used this:
"serve": "vue-cli-service serve --https true",
Instead of:
"serve": "vue-cli-service serve",
And it worked fine.
Solution 5:[5]
You need an SSL-certificate deployed on your server (i.e. localhost). It will reject anything from an insecure location.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | |
Solution 2 | |
Solution 3 | Jakub Ujvvary |
Solution 4 | Mohamed El Firdoussi |
Solution 5 | blackforest-tom |