Facebook API plugin question

[Tom6106181]

Hi.
As you probably know by now, I am building an IOS app (also planning to release to android when IOS is done), and I am invoking facebook login for my app.

Facebook login is mainly only to retrieve a users ID to identify items created by the user (I decided on using facebook login, and not appery backend user login due to reset password functionality, and so forth, simpler, I hope).

So just to explain a little about the app to clearify my question:
-Startscreen - DeviceGeolocation service

• Loginscreen - Connect with facebook - save userId to localstorage

  I have tried the tutorial (Build an app with the Facebook API), and I found a plugin called "Facebook API" (in Plug-ins), witch I added to my project just to try another approach.

  So now to my questions:

  1)
  I am not quite sure what will be the best approach for me, for a native IOS/ANDROID app. I noticed the tutorial are using:
  codecb = window.plugins.childBrowser;/code

  and the plugin is not. I have tried both approaches on device (IPA installed and tested), but if you could help me out, explaining what approach I should use to invoke the facebook login, I would appreciate it.

  2)
  I noticed I needed to set the app to "public" in appery builder. Does this mean that after user is logged in, he is returnAdressed to the website, and not the native app?

  3)
  On app init, App ask to use location service, but after facebook login is complete, it asks again!?!

  Please clarify a bit round this, and I will be really grateful

  Thanks!
  -Tom

[Maryna Brodina]

Hello! childBrowser is no longer used (starting 1.2 libraries version). Please use this approach https://getsatisfaction.com/apperyio/..., it's the same but with inAppBrowser

[Tom6106181]

aha.. That clarified some

one more question, notice that the Facebook API plugin uses this approach to get and store access_token right away;

Button click:
code
var callbackUrl = "http://appery.io/app/view/APP-ID/Facebook_Me.html&quot
var url="https://www.facebook.com/dialog/oauth?client_id="+Facebook_Settings.app_id+"&redirect_uri="+callbackUrl+"&scope=&response_type=token&quot

window.open(url);

/code

Facebook_UrlUtils.js
code
if (window.location.href.indexOf("access_token") != -1) {
// save the hash
var hashFromFb = window.location.hash;
// clear the hash or jQuery Mobile will fail to load
window.location.hash = '';
// save the params into an array
var paramsFromFb = hashFromFb.substring(1).split("&");
// get the access_token
var access_token = paramsFromFb[0].split("=")[1];
// save the token into local storage
localStorage.setItem("access_token", access_token);
// get expired_in value
//var access_token = paramsFromFb[1].split("=")[1];
}
/code

and the tutorial, retrieve "code" and then get access_token. Is it not possible to retrieve the access_token on first go, using a similar approach like the plugin?

code
var callbackUrl = "http://appery.io/app/view/APP-ID/Facebook_Me.html&quot
var url="https://www.facebook.com/dialog/oauth?client_id="+Facebook_Settings.app_id+"&redirect_uri="+callbackUrl+"&scope=&response_type=token&quot

var ref = window.open(url, '_blank', 'location=no');
ref.addEventListener('loadstart', function(event) {
if(event.url.indexOf(redirectUrl) === 0) {
/* if user successfully logged in /
ref.close();
var vars = parseUrlVars(event.url);
localStorage.setItem('access_token', vars.access_token); / store secret code /
Appery.navigateTo('Facebook_Me', {reverse: false}); / Navigate to page 'result' */
}
});

function parseUrlVars(url) {
var vars = [];
var params = url.slice(url.indexOf('?'));
if(params.indexOf('#')>=0) {
/Remove all symbols after '#'/
params = params.slice(0, params.indexOf('#'));
}

Code: Select all

 params = params.slice(1).split('&'); 
 for (var i in params) { 
    var item = params[i].split('='); 
    vars.push(item[0]); 
    vars[item[0]] = item[1]; 
 } 

 return vars; 

}
/code

Suggestions on how this can be done?

[Maryna Brodina]

Hello!
When you add callbackUrl to URL try to encode it preencodeURIComponent(callbackUrl)/pre

[Tom6106181]

Not sure what you meen here?

[Maryna Brodina]

Instead prevar url="https://www.facebook.com/dialog/oauth?client_id="+Facebook_Settings.app_id+"&redirect_uri="+callbackUrl+"&scope=&response_type=token";/pre should be prevar url="https://www.facebook.com/dialog/oauth?client_id="+Facebook_Settings.app_id+"&redirect_uri="+encodeURIComponent(callbackUrl)+"&scope=&response_type=token";/pre