Paulo Bernardo

Paulo Bernardo

  • 1.9k
  • 16
  • 178

How to redirect to html page after login with facebook

Apr 14 2020 1:42 PM
good afternoon,
 
I have been trying to use “login with facebook” on my website for 15 days. I have been using the code published by Facebook
 
My problem with this code is that I want the customer after login with his facebook (through the window that pop out) to be redirected to a specific page on my website, but what happens is that after the customer does login with your facebook, the client is redirected to the same page that asks him to login.
 
I have already followed the steps that are explained in the link that I mentioned earlier. Could someone help me? Thanks
 
The code i am using is this:
  1. <fb:login-button scope=“public_profile,email” onlogin=“checkLoginState();”> </fb:login-button>  
  2. </script> <html> <head> <title>Facebook Login JavaScript Example</title> <meta charset="UTF-8"> </head> <body> <script>  
  3. function statusChangeCallback(response) { // Called with the results from FB.getLoginStatus().  
  4. console.log('statusChangeCallback');  
  5. console.log(response); // The current login status of the person.  
  6. if (response.status === 'connected') { // Logged into your webpage and Facebook.  
  7. testAPI();  
  8. else { // Not logged into your webpage or we are unable to tell.  
  9. document.getElementById('status').innerHTML = 'Please log ' +  
  10. 'into this webpage.';  
  11. }  
  12. }  
  13. function checkLoginState() { // Called when a person is finished with the Login Button.  
  14. FB.getLoginStatus(function(response) { // See the onlogin handler  
  15. statusChangeCallback(response);  
  16. });  
  17. }  
  18. window.fbAsyncInit = function() {  
  19. FB.init({  
  20. appId : '{xxxxxxxxxxxx}',  
  21. cookie : true// Enable cookies to allow the server to access the session.  
  22. xfbml : true// Parse social plugins on this webpage.  
  23. version : '{api-version}' // Use this Graph API version for this call.  
  24. });  
  25. FB.getLoginStatus(function(response) { // Called after the JS SDK has been initialized.  
  26. statusChangeCallback(response); // Returns the login status.  
  27. });  
  28. };  
  29. (function(d, s, id) { // Load the SDK asynchronously  
  30. var js, fjs = d.getElementsByTagName(s)[0];  
  31. if (d.getElementById(id)) return;  
  32. js = d.createElement(s); js.id = id;  
  33. js.src = "https://connect.facebook.net/en_US/sdk.js";  
  34. fjs.parentNode.insertBefore(js, fjs);  
  35. }(document, 'script''facebook-jssdk'));  
  36. function testAPI() { // Testing Graph API after login. See statusChangeCallback() for when this call is made.  
  37. console.log('Welcome! Fetching your information.... ');  
  38. FB.api('/me'function(response) {  
  39. console.log('Successful login for: ' + response.name);  
  40. document.getElementById('status').innerHTML =  
  41. 'Thanks for logging in, ' + response.name + '!';  
  42. });  
  43. }  
  44. </script> <fb:login-button scope="public_profile,email" onlogin="checkLoginState();"> </fb:login-button> <div id="status"> </div> </body> </html> <div id="fb-root"></div> <script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v6.0&appId=xxxxxxxxx&autoLogAppEvents=1"></script> <div class="fb-login-button" data-width="" data-size="" data-button-type="continue_with" data-layout="rounded" data-auto-logout-link="true" data-use-continue-as="true"></div> <script>  

Brought to you by: JavaScript SDK for Bold BI dashboard and analytics embedding. Free trial.

Answers (2)