How do I check if a user likes my page via facebook JS SDK nowadays? - facebook-javascript-sdk

I've been trying very hard to solve this issue for the last days, but I really can't get through. I've found this question many times on this forum, but none of the solutions presented here solved my problem because they have been posted some years ago and Facebook is updating the way to solve a given issue very often. My facebook javascript SDK to check if a user likes my page is as follows:
$(document).ready( function () {
try {
FB.init({
appId : '{my_app_id',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
version: 'v5.0'
});
} catch (e) {
alert(e.message);
}
try {
FB.getLoginStatus(function(response) {
if (response['status'] == 'connected') {
try {
FB.api(
"/{my_page_id}/likes", {access_token: 'my_app_token'},
function (response) {
alert(response.error.message);
if (response && !response.error) {
//code to check likes
}
}
);
} catch (e) {alert(e.message);}
}
});
} catch (e) {
alert(e.message);
}
});
The FB.init works and also the FB.getLoginStatus, where response['status'] is really 'connected'. But my FB.api does not work. The alert(response.error.message); line returns the following error: "(#10) This endpoint requires the 'manage_pages' permission or the 'Page Public Content Access' feature. Refer to https://developers.facebook.com/docs/apps/review/login-permissions#manage-pages and https://developers.facebook.com/docs/apps/review/feature#reference-PAGES_ACCESS for details.". I've been checking the manuals from Facebook for developers, but they are very incomplete, at least the ones in Portuguese (I am Brasilian). I'm really sick of trying to get this working by myself, so I'm looking for a help from the users of this forum.
Thanks in advance.

The /page-id/likes endpoint returns likes of a Page (for example, other Pages liked by the Page), NOT users who like your Page. And for getting that data, you need to own the Page, and you need to authorize with the manage_pages permission.
There is no way to get a list of Users who like your Page, the only reliable way to check if a specific User likes a Page is by authorizing that User with the user_likes permission. After that, you can use the /me/likes endpoint to get liked Pages. Although, you would need to get the permission reviewed by Facebook, and you would need a very good reason to use the permission.
Additional Info: How to check if someone is liked my fanpage from my website?

Related

how do i authenticate my vuejs app using azure active directory and get the security groups to which the user belong to

i saw something similar here: How do you authenticate a VueJS app with Azure AD?
but it did not work for me...
my problem is that after authenticating the user at login - i still needed to get the users security groups and that information was not received using the graph-api described in the above mentioned post
thank you for any help
it was something that took me a long time to figure out so im posting my findings here, hopfully this will help someone:
this was a hard one for me so im posting here - hopfully this will save some time to someone:
my problem was that i need not only to authenticate my vuejs app with azure-ad, but i need also to get the security groups to which the user is belonging to.
to achive this, this is what i done:
i used the vue-adal sample app mentioned above( you can find it in: https://github.com/survirtual/vue-adal ) - under sample folder.
but i still had to make some changes to make it behave the way i need. the problam was that after logging in with my user the sample app used windows.net graph api for retrieving user info with the token from the user authentication, so i had to change in main.js this:
const graphApiBase = `https://graph.windows.net`
const graphApiResource = '00000002-0000-0000-c000-000000000000'
to this:
const graphApiBase = `https://graph.microsoft.com/v1.0`
const graphApiResource = '00000003-0000-0000-c000-000000000000'
in addition, inside the return url component i had to change the axios query to get the security groups to which the user belongs to..so i changed this (in the home.vue file):
async getUserInfo () {
let res = await this.$graphApi.get(`me`, {
params: {
'api-version': 1.6
}
})
to this:
async getUserInfo () {
let res = await this.$graphApi.post(`/me/getMemberGroups`, {
securityEnabledOnly: true
})
console.log(res)
return res.data
}
and then the data that i received back from the api contained the security groups to which the user belongs to...

How to stop page content load until authenticated using Firebase and Polymer

I am starting with Polymer and Firebase and have implemented the Google OAuth authentication.
I have notice the page loads before authentication and if you click back you can get to the page without authorization, albeit that you are not able to use the firebase api and therefore the page is not usable.
My issue is that I do not want my javascript loaded until authenticated.
How could this be done.
Many thanks
It depends if your using firebase or their polymer wrapper, polymerfire.
Create a document for all the imports that you want to be conditionally loaded
// user-scripts-lazy.html
<link rel="import" href="user-script-one.html">
<script src="script.js"></script>
// etc
Using Polymerfire
In the element that hosts <firebase-auth> create a observer and you'll expose some variables from firebase-auth.
<firebase-auth
user="{{user}}"
status-known="{{statusKnown}}"></firebase-auth>
In the observer, watch the user element and the status known
statusKnown: When true, login status can be determined by checking user property
user: The currently-authenticated user with user-related metadata. See the firebase.User documentation for the spec.
observers:[
'_userStateKnown(user, statusKnown)'
]
_userStateKnown: function(user, status) {
if(status && user) {
// The status is known and the user has logged in
// so load the files here - using the lazy load method
var resolvedPageUrl = this.resolveUrl('user-scripts-lazy.html.html');
this.importHref(resolvedPageUrl, null, this.onError, true);
}
}
To get the state without using polymerfire you can use onAuthStateChange
properties: {
user: {
type: Object,
value: null // important to initialise to null
}
}
..
ready: function() {
firebase.auth().onAuthStateChagned(function(user) {
if(user)
this.set('user', user); // when a user is logged in set their firebase user variable to ser
else
this.set('user', false); // when no user is logged in set user to false
}.bind(this)); // bind the Polymer scope to the onAuthStateChanged function
}
// set an observer in the element
observers: [
'_userChanged(user)'
],
_userChanged: function(user) {
if(user === null) {
// authStatus is false, the authStateChagned function hasn't returned yet. Do nothing
return;
}
if(user) {
// user has been signed in
// lazy load the same as before
} else {
// no user is signed in
}
}
I haven't tested the code while writing it here, but i've implemented the same thing various times.
There are a couple of options.
Put content you don't want loaded behind a dom-if template with "[[user]]" as its driver. This could include your firebase element, so the database isn't even considered until after log on.
Put a modal dialog box up if the user is not logged on. I do this with a custom session element . Whilst the overlay is showing then the rest of the page is unresponsive to anything.
If it is simply an aesthetic issue of removing the non-logged-in page from view, could you either hide the page (or display some kind of overlay) while the user isn't authenticated?
I currently have this in an current project for some elements: hidden$="{{!user}}"
I have identified the solution for my purpose ...
Add storage role based authorization (see is there a way to authenticate user role in firebase storage rules?)
This does have a limitation currently of hard coded uid's
In the page, request storage resource and if successful include it in the dom (i.e. add script element with src pointing to storage url)
Call javascript as normal

How to authenticate users in FirefoxOS using BrowserID / Persona?

I am trying to write an FirefoxOS app for my portal which uses Mozilla Persona for authentication. How I should proceed if I want to achieve:
Allow users of my app to signup to my portal using Persona
Allow users of my app to login to my portal within the FirefoxOS app and perform some actions with the API
Depends if users is logged or not - giving access to different actions.
I have found this post with info that its integrated already: http://identity.mozilla.com/post/47114516102/persona-on-firefox-os-phones but I can't find any real examples.
What type of application I need to create? webapp or privileged?
I am trying to implement it using regular tutorial: https://developer.mozilla.org/en/Persona/Quick_Setup
But with this code:
signinLink.onclick = function() { navigator.id.request(); };
I am getting only following error:
[17:25:18.089] Error: Permission denied to access object
One thing is to make sure you're calling watch() to setup callbacks before you call request().
For example, something like this in your page:
<script src="https://login.persona.org/include.js"></script>
<script>
window.addEventListener("DOMContentLoaded", function() {
navigator.id.watch({
// Provide a hint to Persona: who do you think is logged in?
loggedInUser: null,
// Called when persona provides you an identity assertion
// after a successful request(). You *must* post the assertion
// to your server for verification. Never verify assertions
// in client code. See Step 3 in this document:
// https://developer.mozilla.org/en/Persona/Quick_Setup
onlogin: function(assertion) {
// do something with assertion ...
// Note that Persona will also call this function automatically
// if a previously-signed-in user visits your page again.
},
onlogout: function() {
// handle logout ...
},
onready: function() {
// Your signal that Persona's state- and callback-management
// business is complete. Enable signin buttons etc.
}
});
// Set up click handlers for your buttons
document.getElementById("signin").addEventListener(
'click', function() {
navigator.id.request({
// optional callback to request so you can respond to
// a user canceling the sign-in flow
oncancel: function() { /* do something */ }
});
}
});
});
</script>
Here's an example that shows this in action:
https://people.mozilla.org/~jparsons/persona_example.html
However, on FirefoxOS, you should be aware that installed apps (not packaged or certified, but generic installed apps) are given a unique origin of the form app://{uuid}, with a different uuid for each device. This is unfortunately useless for sign-in purposes because there's no way for your server to know whether an app requesting sign-in is friend or foe. The way around this problem is to run your persona code in an invisible iframe hosted on your server. Thus the iframe will have the correct origin and your server will know it's your app. The iframe and the app can communicate via postMessage.
In the case of a packaged app (sometimes called a privileged app), your origin will be the origin declared in your webapp manifest. E.g., app://yourapp.yoursite.org. This gives you better assurance that the app is really yours, but the truly paranoid may still wish to deploy the iframe trick.
Hope this helps!
j

How to automatically share some information in google plus wall

I have developed a web application with Google+ Signin. Once user click the sign in with Google+ it authorize the app and register that user. after that process, I want to automatically share some information in google plus wall from my application. For that I go through the Google plus API, "https://developers.google.com/+/" and enables api's related to login, get user information and write access. I'm trying to use Google's API to post on the currently logged in user's stream / wall / whatever. My website uses Facebook and twitter APIs to post notifications automatically on the currently logged in user's wall, but not able to post with Google's wall. I want something like Facebook and Twitter API, with Automatic Posting function and API.
Please help me to troubleshoot this problem.
For your review I am sending my sample code snippet here:
/*
<script type="text/javascript">
function googleAPIOnLoad() {
console.log("Google plus js loaded... calling client.load...");
gapi.client.load('plus','v1', function(e){
console.log("client loaded...");
console.log(e);
});
}
function signIn() {
console.log("signing in...");
gapi.auth.authorize({
client_id: "XXXXXXXXXXX",
immediate: false,
response_type: "token",
scope: ["https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/plus.stream.write"],
requestvisibleactions: "https://schemas.google.com/AddActivity"
}, function(e) {
// callback
console.log("done!", e);
gapi.client.request({
path: "plus/v1/people/me/moments/vault",
method: "POST",
body: JSON.stringify({
type: "http://schemas.google.com/AddActivity",
target: {
type: "http://schema.org/Thing",
name: "Test Name",
description: "Test Description",
image: "http://test.test.com/Deal/Dealphoto/Thumbnail/0160475582922191382013.png"
}
})
}).execute(function(e) {
console.log("did it.", e);
});
});
}
</script>
*/
I will be very thankful to you for this.
Thanks,
Lalit
Basically you can't automatically post to a users Google+ stream. You can either use the share API with your users intentionally posting, or you can use app activities to automatically create posts that won't be visible on the users stream.
There is an open feature request you can star for a full write API method.
There is a write API in the Domains API but that only works for Google Apps users and can only post private content in that company.

Remember login in Sencha 2 app

We dont want the user to log in each time he/she opens our Sencha 2 app. Its not determined yet if we will serve it through a web browser or package it as a native app with the Sencha build tool.
Any advices how to solve it? Should I use some local storage to remember if user has logged in?
I have created a Simple Login project on github to illustrate how I'm using localStorage in credential saving. Feel free to use ideas in your project. Feedback & comment are welcome
Cheers, Oleg
Here i am going to save the username and password values with the id of 'ext-record-2'.
if (values.keepUser) {
var user = Ext.create('MyApp.model.LoginLocalSave', {
id: 'ext-record-2',
uemail: values.uname,
pword: values.pword,
isRemember: values.keepUser
});
user.save();
}
On launching of login screen we need to read the username and password fields from the local storage by using the previously save id 'ext-record-2' and display it on the fields.
launch: function() {
var User = Ext.ModelMgr.getModel('MyApp.model.LoginLocalSave');
User.load('ext-record-2', {
success: function(user) {
Ext.ComponentQuery.query('formpanel #uname')[0].setValue(user.get('uemail'));
Ext.ComponentQuery.query('formpanel #pword')[0].setValue(user.get('pword'));
Ext.ComponentQuery.query('formpanel #keepUser')[0].setValue(user.get('isRemember'));
},
failure: function() {
console.warn('Auto-fill login failed.');
}
});
},
Please visit the below url for full source code by clicking the link. [Solved by solution]
http://saravanakumar.org/blog/2014/04/login-screen-with-username-and-password-remember-in-sencha-touch/