how to access javascript variables in python - javascript

I am creating a facebook app and it uses Javascript API to store username and other details in js variables. And this app is created under Python(using Google App Engine). I want to access the js variables in Python and store the values in Db. How to do this?
class MainPage(webapp2.RequestHandler):
def get(self):
self.response.out.write("""
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb#">
<head>
<title>Captain Pandey</title>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '185318768251247',
channelURL : 'http://localhost:8080/channel.html',
status : true,
cookie : true,
xfbml : true,
oauth : true,
});
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
// the user is logged in and has authenticated your
// app, and response.authResponse supplies
// the user's ID, a valid access token, a signed
// request, and the time the access token
// and signed request each expire
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
FB.api('/me', function(apiResponse) {
var name = apiResponse.name;
});
}
else if (response.status === 'not_authorized') {
// the user is logged in to Facebook,
// but has not authenticated your app
}
else {
// the user isn't logged in to Facebook.
}
});
};
(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>
<div class="fb-login-button" data-show-faces="true" data-width="200" data-max-rows="1" scope="email">Login to Facebook</div>
</body>
</html>
""")
and template used is webapp2

Design the Javascript code so that it makes an AJAX request that sends the data, and write a Python handler for that request.

Related

Facebook Connect - Need email and userlikes

I can't seem to get the permissions for my facebook connection. Here's what I have:
window.fbAsyncInit = function() {
FB.init({
appId : 'myID', // App ID
channelUrl : 'myChannel', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML
oauth : true
});
FB.Event.subscribe('auth.authResponseChange', function(response) {
if (response.status === 'connected') {testAPI();}
if (response.status === 'not_authorized') { FB.login(function(response) {}, {scope: 'email,user_likes'});}
else { FB.login(function(response) {}, {scope: 'email,user_likes'});}
});
};
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
When I hit my login button it asks:
MyApp would like to access your public profile and friend list.
What have I done wrong?
When you set the scope you are not giving permissions to the app. You are only telling that permissions that your app will need.
When you click in the login button for the first time, that dialog saying that "MyApp would like to access your public profile and friend list." appear. You need to confirm that you grant that permissions to your app by clicking in the ok button or similar in that dialog.
You should not need to to this again unless you change your application id or key or you manually revoke the authorization for that app in the facebook settings.

JavaScript SDK for Facebook

I want to get the access token for facebook and I got this code from facebook developer website but it can't generate or give me any access token . I use this code in a simple text file not any of my website.
<div id="fb-root"></div>
<script>
<div class="fb-login-button" data-show-faces="true" data-width="400" data-max-rows="1"></div>
window.fbAsyncInit = function() {
FB.init({
appId : '377263832388887', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.Event.subscribe('auth.authResponseChange', function(response) {
if (response.status === 'connected') {
// the user is logged in and has authenticated your
// app, and response.authResponse supplies
// the user's ID, a valid access token, a signed
// request, and the time the access token
// and signed request each expire
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
// TODO: Handle the access token
} else if (response.status === 'not_authorized') {
// the user is logged in to Facebook,
// but has not authenticated your app
} else {
// the user isn't logged in to Facebook.
}
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
});
</script>
I want to get access token so that I can further proceed for my work. Thank you.
consider using this code provided by http://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/
replace the FB.Event.subscribe function with the following.
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
// dump success data here, and dump response data if needed
} else if (response.status === 'not_authorized') {
// dump fail data here
} else {
// dump other fail data here
}
});
Although I see on http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/ that the FB.Event.subscribe should also have the access code in its result array. Have you tried dumping the 'response' to console, to view the results?

Facebook Authentication no longer works - Doesn't render the login button

My Facebook authentication has stopped working all of a sudden. Has FB changed something? I am running the site from localhost at the moment using FB Javascript SDK. None of the following FB code is working?
alert("got here");
window.fbAsyncInit = function () {
alert("didn't get here");
FB.init({
appId: '102671026556892', // App ID
//appId: '384834001576531', // App ID
channelUrl: '//localhost/channel.html', // Channel File
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true // parse XFBML
});
FB.Event.subscribe('auth.authResponseChange', function (response) {
if (response.status === 'connected') {
// the user is logged in and has authenticated your
// app, and response.authResponse supplies
// the user's ID, a valid access token, a signed
// request, and the time the access token
// and signed request each expire
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
FB.api('/' + uid, function (user) {
if (user) {
loginUser(uid, user.email, user.name);
window.location = "/users/index.html";
}
});
// check an load DB
// TODO: Handle the access token
} else if (response.status === 'not_authorized') {
// the user is logged in to Facebook,
// but has not authenticated your app
} else {
// the user isn't logged in to Facebook.
}
});
};
alert("got here too");
// Load the SDK Asynchronously
(function (d) {
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) { return; }
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
alert("got here as well");
The alert that are not in the window.fbAsyncInit display fine. The one in the window.fbAsyncInit does not. It doesn't render the login button (code below)
<!-- START of Facebook LOGIN BUTTON -->
<div id="fb-root"></div>
<div class="fb-login-button" data-show-faces="false" data-width="400" data-max-rows="1" data-size="medium" data-colorscheme="light" scope="user_about_me, email, read_stream, publish_actions">Login with Facebook</div>
<!-- END of Facebook LOGIN BUTTON -->
Any help greatly appreciated. It all worked at the end of last week. :(

Facebook authenticated referrals is not working

I have a problem with the authenticated referrals in the Auth Dialog. When a user uses the app for the first time and is requesting authorization, he/she gets "The App will receive: Your basic data." which is different from what is displayed when I preview the Auth Dialog in Facebook developer Apps site. I use the following code:
<script>
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
// Init the SDK upon load
window.fbAsyncInit = function() {
FB.init({
appId : '<%= Facebook::APP_ID %>', // App ID
channelUrl : '//'+window.location.hostname+'/channel', // Path to your Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
url = '<%= users_path %>'
// listen for and handle auth.statusChange events
FB.Event.subscribe('auth.statusChange', function(response) {
if (response.authResponse) {
// user has auth'd your app and is logged into Facebook
FB.api('/me', function(me){
if (me.name) {
window.open(url);
}
})
} else {
// user has not auth'd your app, or is not logged into Facebook
document.getElementById('auth-loggedout').style.display = 'block';
}
});
// respond to clicks on the login and logout links
document.getElementById('auth-loginlink').addEventListener('click', function(){
FB.login();
});
}
replaced FB.login() with
FB.login(function(response) {
// handle the response
}, {scope : 'user_likes'}); });

Facebook connected but /me user is an empty object

I used the example from the facebook documentation but after granting facebook permission to connect I cannot get any user info from the user object. The user is defined but all its attributes are null. Here is my code:
<html>
<head>
<title>My Facebook Login Page</title>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '161718123880158', // App ID
channelUrl : '', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML
logging : true
});
FB.api('/me', function(user) {
if (user) {
var image = document.getElementById('image');
image.src = 'http://graph.facebook.com/' + user.id + '/picture';
var name = document.getElementById('name');
name.innerHTML = user.name
}
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
<div class="fb-login-button" scope="email,user_checkins">Login with Facebook</div>
<div align="center">
<img id="image"/>
<div id="name"></div>
</div>
</body>
</html>
The output is undef for name and empty image
It's because you haven't got an active access token. If you do a put a console.log(user) and examine the response it shows the error.
What is the 'Website with Facebook login' field set to in your app settings? It needs to match the URL that you are developing on.
Try wrapping the FB.api call in a FB.getLoginStatus callback function, like this:
FB.getLoginStatus(function() {
FB.api('/me', function(user) {
//your code here
});
})

Categories

Resources