Chrome Extension: Facebook OAuth with manually retrieved access token? - facebook

As stated in the Facebook Oauth Documentation, in order to use the Client Side Flow with a Desktop App, the special return_uri https://www.facebook.com/connect/login_success.html is required.
Opening a new tab from Chrome to the url
https://www.facebook.com/dialog/oauth?client_id=MYAPPID&redirect_uri=https://www.facebook.com/connect/login_success.html&response_type=token
works as expected, I am redirected to the login_success page with an access_token parameter containing the token. I can request data from the Graph API using simple GET requests (e.g., with jQuery):
$.getJSON("https://graph.facebook.com/me", {access_token : token}, function (d)
{
.. process returned data
});
My question is, can I continue to use the Javascript SDK without using the SDK's internal authorization methods.
FB.getLoginStatus returns an error that my Connect/Canvas URI isn't correct. How am I supposed to check the token status without that method [apart from a manual GET and response matching]?
FB.login obviously fails with the following error:
API Error Code: 191
API Error Description: The specified URL is not owned by the application
Error Message: Invalid redirect_uri
(url does not match domain url in the app's config), as there seems to be no way to internally specify the return_uri above.
Is there a way to still rely on the Javascript SDK (especially events) while accessing a token externally? Am I supposed to override the access token?

Yes, you can use it for the normal events (i.e. someone clicked a like button) like so:
<div id="fb-root"></div>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js#xfbml=1" id="facebook-jssdk"></script>
<script type="text/javascript">
FB.Event.subscribe('edge.create',
function(response) {
console.log(response);
}
);
</script>
Unfortunately for regular API calls you can't use the Facebook JS SDK from within your extensions. You'll have to roll your own API wrapper for that.
An easy way to see if the access token is valid, is to make a graph API call to /me?fields=id with the access token you have saved. That will be fast and you can use the response to see if the access token is still valid. Best practice for extensions is to request the permission offline_access.
Also, I would recommend having the redirect URI be on a domain you own. That way if other extensions are doing the same, your scripts won't interfere. Accessing the token will be the same.

Related

How to track URL in flutter with website platform

I want to do oAuth2 verification in my website login page and after that I want to get token from url with same page but issue is i can`t able to get URL.
below URL is OAuth2 url using this url I am doing authentication steps with website using flutter.
1st this website will open in browser after that login page will open and after login i will get access_token. But i facing difficulties how i can get access_code with html.window.location function.
I have tried with this code
WidgetsBinding.instance!.addPostFrameCallback((_) {
html.window.location.assign(
'https://example/connect/authorize?response_type=token&client_id=$clientId&redirect_uri=https://example.app/silentRenew&scope=getinfo');
});
Anyone have better solution than please give suggestion.
Pinal! I did an oAuth2 flux recently consuming Gitlab API. I suggest you to use
the oauth2 plugin: oauth2. You just need to have the authorization endpoint, access token endpoint and the redirect url.
After this, you just need to call 3 methods.
Getting your AuthorizationCodeGrant.
var grant = oauth2.AuthorizationCodeGrant(identifier, authorizationEndpoint, tokenEndpoint,secret: secret)
Get Authorization Url.
var authorizationUrl = grant.getAuthorizationUrl(redirectUrl);
Get the returned Code.
await grant.handleAuthorizationResponse(responseUrl.queryParameters);
The method return your code automatically.
In my case, I used a webview instead opening the browser to listen the redirected url's. WebView
You just have to pass the authorizationUrl as the initial page flag inside webview, and listen to the url's with onPageStarted flag. So what you wanna do is: when the redirectUrl ,which gives you the code to authorize your access token, is accessed you call the method 3, only in this moment. I hope this help you, let me know if you struggle with something.

how to integrate facebook js login and laravel socialite?

i'm facebook js sdk for users login,
at the server side i want to get the user data
i'm trying to use
Socialite::with('facebook')->user()
to make it work it need 2 query string code and status
in my JavaScript i'm using the following
var auth_status_change = function(response) {
console.log(response);
if(response.status == "connected")
{
window.location = "{{URL::to(App::getLocale()."/fb_login")}}?code="+??+"&state="+???;
}
}
FB.Event.subscribe('auth.statusChange', auth_status_change);
how to get the state and code values to create a valid callback URL for socialite
You're trying to combine 2 things that do the same thing, but one on the server side and one on the client side, that won't work.
Laravel Socialite uses your app token to redirect your user to Facebook, authorize your app to use Facebook on their behalf (token) and provides you with user data. With the token you can do API calls from Laravel.
The Facebook JS SDK does the same thing, but in the browser. It fetches a token which it uses to do API calls.
Check out https://laracasts.com/series/whats-new-in-laravel-5/episodes/9 on how Socialite works.
Unless you are using the JS SDK functionality, you can leave it out and just add a link to a socialite route which redirects it to Facebook. That call will provide you with the code and state required to fetch the user.

Facebook PHP SDK usage stand alone - how do the Facebook sessions/cookies work?

I'm utilizing the Facebook PHP SDK on its own. I do not want to use the JS SDK at all.
Because getUser(); from the SDK can return a user id even if the user is not logged in, I have opted for using a try/catch statement to check if the user is logged in.
try
{
$me = $CI->facebook->api('/me');
$CI->our_fb['is_fb']='YES';
echo "hello";
}
catch(FacebookApiException $e)
{
echo "catch";
}
This statement is included in the global include file of all of my files (for simplicity).
So, depending on the situation, I generate a Facebook login URL. The expected functionality is that the user logins to Facebook, authorises the app, is returned to the redirect URI set in the login URL at which point the try statement will execute, and $CI->our_fb['is_fb'] will be set.
This is however not happening.
If the user is already logged into Facebook and the app is authorised, it works perfectly. SUCCESS
If the user is not logged into Facebook, once redirected the variable is not set. FAILURE
If the user is logged in but the app is NOT authorised after redirect the variable is not set. FAILURE.
In the latter two cases if you simply refresh the page, the variable is set - SUCCESS. Refreshing the page is however unnecessary/pointless extra effort.
My problem is that if you need to login to FB/or authorise the app e.g the first time you login with FB, you have an additional unneeded refresh, and I don't know why.
I suspect it is something to do with the cookie/session? Which saves the access token that I assume is returned/passed to the SDK automatically not being set at the same time?
Anyone got any ideas?
If you're having an app on facebook (tab or canvas). PHP SDK only get the User ID on initial loading of a page because a signed_request is sent with the request to your app.
But, when the app refreshes, the signed_request is lost (as it's facebook who send it).
So, in this case, you can append the signed_request to every URLs your use in your app - but that's really not optimal as the signed_request won't be regenarated - neither refreshed.
Your only real option is to rely on the JS SDK to set cookie correctly and allow getUser to work as expected. This is required because you're considered as a third-party app in Facebook (being in an iframe) and most browser will block you from setting cookies - so you need a work around handled by the JS SDK for you. You can search for cross-domain cookies or third-party cookie for explanation about the workarounds, but these workaround only work via JS scripting and iframe management.
Also, be sure to setup the JS SDK correctly: channel file, cookie allowed, and send P3P headers (for IE).
You can also check this related question: A proper approach to FB auth
About website, the same mostly stays (but you have no signed_request). At this point, seriously consider using the JS SDK as it's way easier. Or else, you can make sure your app flow follow these guidelines: https://developers.facebook.com/docs/concepts/login/login-architecture/
The way I am seeing this is, you are trying to avoid that refresh if the user is not logged in and precedes to log in after the page has initially loaded.
So what you can do is make an ajax request to another page on your site, say for example id.php, which just loads the php sdk and echo $userid; and then you can grab the user id after login without the refresh.
Basically the cookie is used to save the signed request and session is used to save 'state', 'code', 'access_token', 'user_id'. If the above are present PHP SDK uses them, no matter if they are valid or not.
I think your problem lies in the CODE sent by facebook. Specifically these lines in base_facebook.php:
if ($code && $code != $this->getPersistentData('code')) {
$access_token = $this->getAccessTokenFromCode($code);
...
protected function getAccessTokenFromCode($code, $redirect_uri = null) {
if (empty($code)) {
return false;
}
if ($redirect_uri === null) {
$redirect_uri = $this->getCurrentUrl();
}
...
Because CODE is issued for specific url sometimes there is such situation: Visitor arrives on www.example.com. He givies permissions and is redirected to example.com/login. But the code is not valid there, so the getUserAccessToken returns false. When you refresh the page you get same urls and everything's fine.
You're on the right track of not using getUser() because as I wrote above it's taken from the session if available.

Facebook JS SDK throwing 104 error when attempting to delete a app request

I have setup the facebook javascript sdk to initialize a friend invite dialog to send requests to friends. Clicking on the invite in Facebook, brings the user back to the site.
The query string has any and all request_ids that have not been handled (deleted).
I am following the documenation listed at the FB developers site here which states:
JavaScript SDK:
FB.api(requestId, 'delete', function(response) {
When they are returned to my site, the querystring has a request_ids parameter:
example: www.mysite.com/somepage?request_ids=0493834050
my Javascript code looks like this:
FB.api(requestIds[i], 'delete', function (response) {
console.log(response);
});
But the error I get is:
ERROR
code: 104
message: "An access token is required to request this resource."
type: "OAuthException"
All I want to do is delete the request ID. before I was even running the above code, the querystring was building up with every submitted request. It does appear they have been removed, because the querystring is reduced down to a single request id. But I am still uncertain it has been handled properly.
NOTE I am not using the Graph version - as I have not setup Graph on the app settings in Facebook.
I have the Facebook C# sdk - if someone has an easy way to do this here. I have tried the following with the same results.
var fbClient = new FacebookClient(accessToken)
fbClient.Delete(requestId);
I don’t see what’s possibly unclear about the error message – you need a valid access token to be able to delete requests, but by the looks of it you don’t have one.
So you’ll either have to have the user connect to your app in order to get an active access token for him; or you have to do it using your own app access token (but that’d have to be done server-side then, because you don’t want to transfer your app access token to the client side).

How to authenticate external web app to post to facebook app's page?

Has anyone been able to figure out how to authenticate an external web site to post to a facebook app's page (wall)?
We have an external rails site, and all I'm looking to do is post to our facebook app's page whenever a new resource is created. I'm so confused right now with all these tokens and expirations!!!
Ex. I can manually visit:
https://www.facebook.com/dialog/oauth?client_id=(our client id)&redirect_uri=(our redirect uri)&scope=manges_pages,publish_stream&response_type=token
(no parenthesis)
to get the account access token, but this approach is manual and it it works only if I go through my browser and I'm signed into FB (so it's using cookies). How can I automate the authenthientication process for my external web app?
I would try to use a Cross-Domain AJAX GET request to the URL (with parameters). This will allow the request to utilize the current user's cookies. jQuery is fairly reasonable for this type of situation. $.ajax(); using JSONP should do it.
Something like this:
$.ajax({
type: 'GET',
url: 'https://www.facebook.com/dialog/oauth',
data: {
client_id: '(our client id)',
redirect_uri: '(our redirect uri)',
scope: 'manges_pages',
publish_stream: '',
response_type: 'token',
format: 'jsonp'
},
dataType: 'jsonp',
success: function(data)
{
// Do stuff.
}
});
EDIT:
Should be noted that I haven't ever done this with Facebook's API specifically. In doing a little digging, I don't know if this is possible to do with just a GET request:
https://developers.facebook.com/docs/reference/api/
Seems you need some kind of authentication to happen on the server-side before you can publish to their API.