I am using the following code to rendered the facebook login button
<div id="facebook-login">
<script>
FB.init({
appId:"appid", cookie:true,
status:true, xfbml:true
});
FB.Event.subscribe("auth.login", function(response) {
window.location = "http://xxx"; // redirect if user has logged in
});
</script>
<fb:login-button perms="publish_stream"><?php print 'Login with Facebook'; ?></fb:login-button>
</div>
But it no longer works today, and I think it is related to the oauth2.
So I tried to update the code as suggested in Facebook's developer docs.
The new code:
<div id="facebook-login">
<script>
window.fbAsyncInit = function() {
FB.init({
appId:"appid", cookie:true,
status:true, xfbml:true, oauth:true, xfbml: true, channelUrl: '//mydomain/channel.php'
});
FB.Event.subscribe("auth.login", function(response) {
window.location = "http://xxx"; // redirect if user has logged in
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
<fb:login-button scope="publish_stream"><?php print 'Login with Facebook'; ?></fb:login-button>
</div>
Now whenever I click the facebook login button, the chrome console keeps throwing the following error Unsafe JavaScript attempt to access frame with URL https://www.facebook.com/login.php?...
I think it is a js cross domain issue, but I have setup the channel url. Any idea on how to solve this problem?
Thanks.
Regards, Kit