I'm trying to use hello.js to allow users to login using their social media accounts. I seem to be successfully getting the allow page to show, and a redirect is happening but I don't understand how my system is supposed to know who that person is. I'm assuming it's via the access token but I can't seem to print it to the console at any point of the login process.
$('#facebookLogin').on('click', function(e){
e.preventDefault();
hello('facebook').login({display:'page'});
return false;
});
This "works" as in, I see the app connected in my Facebook apps. I've tried to follow the instructions here in order to show the object after login but I see nothing with console.log(token).
$('#facebookLogin').on('click', function(e){
e.preventDefault();
hello( 'facebook' ).login({display: 'page'} function() {
var token = hello( 'facebook' ).getAuthResponse().access_token;
console.log(token);
});
return false;
});
I humbly request that if you have answer to post working code. There's a lot of text trying to explain this and I really don't understand it. I need to see something that works.
Try this code.
$('#facebookLogin').on('click', function(event) {
event.preventDefault();
hello('facebook').login({display: 'page'},
function() {
hello('facebook').api("me")
.then(function(userDetails) {
console.log("hello api success");
console.log(userDetails);
}, function(e) {
console.log(e);
});
});
return false;
});
userDetails contains user credentials.
Hope it helps.
Related
I intergrate like button in my website. After login with facebook, now if any one already liked fb page directly from facebook then some fields will be shown to user otherwise fields will be hidden. I already put function for above thing and it works for me but not for others. Don't know why?
Here is a function which contains fb like thing and triggered on button click
function getUserDetail(){
FB.api("me/likes/242500342443159", function(response) {
if ( response.data.length == 1 ) {
$('#myModal').modal('show');
getUserInfo();
document.getElementById("note").style.display="none";
console.log('You like it');
} else {
$('#myModal').modal('show');
getUserInfo();
document.getElementById("form").style.display="none";
console.log("You don't like it");
}
});
}
and i also took user_likes permission on login.
Please correct me if i am doing any mistake in above function.
IMPORTANT: You are not allowed to hide/gate content behind a like or incentivize liking a Page in any way. you must read the platform policy before creating any App: https://developers.facebook.com/policy/
That being said, you would need user_likes for that API call, which needs to get reviewed by Facebook before everyone can use it. Without review, only users with a role in the App are able to authorize that permission. It is called Login Review: https://developers.facebook.com/docs/facebook-login/review
If you got permission for your application, and got premission from the logged in user, but it still doesn't work I would sugest creating error handling and in case of debugging log the response object.
Check for error codes and response format: https://developers.facebook.com/docs/graph-api/reference/user/likes/
I've got following code for user authorization using Firebase but I'm not able to understand the code. Below the code I've mentioned the doubts I'm facing. Plase someone clarify them.
var ref = new Firebase("https://prj_name.firebaseio.com");
var loggedInUser = [];
$(document).ready(function() {
authData=ref.getAuth();
if(authData == null){
//TODO find an elegant way to manage authorization
// window.location = "../index.html";
}else{
ref.child("users").child(authData.uid).on("value", function(snapshot){
$( "span.user-name").html(snapshot.val().displayName);
loggedInUser.displayName = snapshot.val().displayName;
});
}
$("#cPassword").focusout(function() {
validatePassword($("#cPassword"), $("#password"));
});
$(document).on("click", ".clickable-row" ,function(){
window.document.location = $(this).data("href");
});
});
function validatePassword(password, cPassword) {
if (cPassword.val() != password.val()) {
cPassword.css('border-color', 'red');
password.css('border-color', 'red');
return false;
}
return true;
}
All the necessary libraries like firebase have been included and above code is working absolutely fine, the only concern is I'm not able to understand it.
My doubts are as follows :
What does the line authData=ref.getAuth(); do and what authData contains after it get execute?
In else block, what is value and snapshot. I didn't understand at all the line. ref.child("users").child(authData.uid).on("value", function(snapshot)
Can someone please clarify my doubts? Thanks.
Ok here goes:
Firstly you should update your firebase security rules first if you haven't already: Firebase security rules guide
ref.getAuth() returns a value that will either be null if you haven't been authorised yet or it will contain an object with some info about how the user was authorised (custom token, facebook id, email etc.)
This line: ref.child("users").child(authData.uid).on("value", function(snapshot). Here you're basically requesting some data from your users collection: '/users/{some unique id}'. When you request the data from firebase, as soon as the data is ready to be used, Firebase triggers the "value" callback and passes the data (snapshot) using this callback.
The firebase docs are very good, I would advise reading through the entire web guide. Firebase web guide
I hope I've been able to clear some things up for you!
I am developing an app using angularjs and this is my first hands on using angular. Although, I have started understanding it and have developed some part of the app but I am stuck at one particular point.
I am trying to implement login functionality, so as the page loads, I am authenticating user and redirecting him to login page. On successful login, I am storing some values of user in one of the config provider.
Now I am using an API which has their own method of authentication and they have expose the ajax method which I can use to authenticate a user.
I have provided a snippet below. What I am primarily doing is using the external API, authenticating the user and once authenticated, I am getting roles associated to that user using another ajax method of the API, called "GetUserDetails".
And inside the response of the "GetUserDetails", I am injecting a provider and setting some values, so I can use this across my app.
The problem here is the app.config method is never called/executded. I mean the ajax request is returning response, and the alert is displayed on my page, but app.config is never executed.
But the same app.config if I call inside the done() of GetUser method, the app.config gets executed and stores values in my provider. But I want the GetuserDetails values also to be stored before I do anything in my app as I want to execute certain functionality based on user.
Below is my function in main.js file
function(angular,angularRoute,app,routes,configService){
var $html = angular.element(document.getElementsByTagName('html')[0]);
angular.element().ready(function() {
$.c.authentication.getUser()
.done(function(response){
if(response.userName!="anonymous"){
$.c.ajax({
method: "GetUserDetails",
parameters: {
User: response.user
}
})
.done(function(res) {
alert("I have reached the destination").
app.config(['configServiceProvider', function(configServiceProvider){
configServiceProvider.setLoginStatus(true);
configServiceProvider.setUserName(response.userName);
configServiceProvider.setUserObject(response);
configServiceProvider.setUserRoleDetails(res);
}]);
})
.fail(function(res) {
alert("Error while getting user roles ."+res);
});
angular.resumeBootstrap([app['name']]);
}
else
{
app.config(['configServiceProvider', function(configServiceProvider){
configServiceProvider.setLoginStatus(false);
configServiceProvider.setUserName(response.userName);
}]);
//Show Login Screen
var url = window.location.href.split("#")[0];
window.location.href = url + "#/Login";
angular.resumeBootstrap([app['name']]);
}
})
.fail(function(response){
$rootScope.isLoggedIn=false;
});
});
Here is my configServiceProvider
define(['../app'],function(app){
return app.provider('configService', function(){
var options={};
this.setLoginStatus = function(status){
//$rootScope.isLoggedIn = status;
options.isLoggedIn=status;
};
this.setPreLoginInfo=function(info){
options.preLoginInfo=info;
};
this.setUserName=function(name){
options.username=name;
}
this.setUserObject = function(userObject) {
options.userObject = userObject;
}
this.setUserRoleDetails = function(userRoleDetails) {
options.userRoleDetails = userRoleDetails;
}
this.$get=[function(){
if(!options){
}
return options;
}];
});
})
Can anyone please explain me what's going wrong here or what I am missing ?
Also, is there any alternative to achieve the same functionality ?
No luck in figuring out why the above scenario was not working. Since I had already spent lot of time behind this, I have found a workaround to achieve the same with the use of services.
I have been trying to get Facebook API to load my photos. I just keep getting array[0].
I am very new to Facebook Developer, so any help would be great.
Thanks
My code:
if(response.status == "connected"){
FB.api("/me/", function(resp2){
console.log(resp2);
$("#userinfo").append("<br/>Welcome "+resp2.name+"!");
// store info in object
userinfo.name = resp2.name;
//userinfo.gender = resp2.name;
//userinfo.id = resp2.id;
//alert(resp2.id)
});
FB.api("/me/picture", function(pic_resp){
console.log(pic_resp);
$("#userinfo").append("<img src='"+pic_resp.data.url+"' />");
// store info in object
userinfo.pic = pic_resp.data.url;
});
FB.api("/me/photos", function(photos_resp){
console.log(photos_resp);
});
} else{
FB.login(function(response){
},{scope: 'user_photos'});
}
If user_photos does not work in the authorization process, you are most likely trying with a user that is not an App Admin/Developer/Tester. Before you can make that permission work for any other user, you have to go through a review process: https://developers.facebook.com/docs/apps/review/login
If that is not the case, if you still don´t get asked for the permission, there´s something wrong with your login process.
According to the FB API Docs there's an "error" property in the response. Please check that out.
Quote:
/* make the API call */
FB.api(
"/me/photos",
function (response) {
if (response && !response.error) {
/* handle the result */
}
}
);
I'm having trouble getting a logged in facebook user in my parse.com application to log out. What is wrong with the code below?
function logOff() {
function thisSuccess(e) {
console.log(1);
}
function thisError(e) {
console.log(0);
}
var u = Parse.User.current();
Parse.FacebookUtils.unlink(u, {success: thisSuccess,error: thisError});
u.logOut();
}
I've searched everywhere, the best response I got was that the facebook account linked to the user needs to be unlinked as well - I'm not entirely sure whether this is so.
All you need is Parse.User.logOut();
Don't unlink the Facebook account, as that use won't be able to log in again. Next time they try to log in with Facebook Parse will create a new user for them.