We Keep Coding

Using branch.io to redirect to app in javascript

So, we have a mobile download site that we want to bypass if the user already has our app installed, and open our app. We are using the branch javascript code to try to accomplish this task. We have our branch key where I have 'my_branch_key', and we copied the rest of the code below directly out of the branch instructions. And, of course, it is failing to redirect our mobile users. I imagine the problem is the lack of some sort of app identifier in the code, but we could not find any instructions on where to add that. Anyone know what we're missing and where we need to add it. Any advice would be greatly appreciated.
// load the Branch SDK file
(function(b,r,a,n,c,h,_,s,d,k){if(!b[n]||!b[n]._q){for(;s<_.length;)c(h,_[s++]);d=r.createElement(a);d.async=1;d.src="https://cdn.branch.io/branch-latest.min.js";k=r.getElementsByTagName(a)[0];k.parentNode.insertBefore(d,k);b[n]=h}})(window,document,"script","branch",function(b,r){b[r]=function(){b._q.push([r,arguments])}},{_q:[],_v:1},"addListener applyCode banner closeBanner creditHistory credits data deepview deepviewCta first getCode init link logout redeem referrals removeListener sendSMS setIdentity track validateCode".split(" "), 0);
branch.init('my_branch_key');
// define the deepview structure
branch.deepview(
{
'channel': 'mobile_web',
'feature': 'deepview',
data : {
'source': 'website'
}
},
{
'open_app': true
}
);
Additional info: We noticed an oddity when trying to test this, for a couple of our iPhone users, it seems to work perfectly, but for the rest of the iPhone users and all the android users it still fails to redirect.

Alex with Branch.io here: the automatic open_app: true setting actually doesn't work in iOS 9 with Safari, due to some changes Apple made to Universal Links in iOS 9.3. This is a fairly recent change, so our docs haven't been updated quite yet. It's annoying, I agree...
The best workaround is to put a button on the page with deepviewCta(). Visitors will have to click it to open the app. We realise this is not ideal, but it's the best option for Apple's current system.
The other option you can try is enabling your own domain for Universal Link. That way whenever a URL at your domain is clicked, your app will launch immediately and the site will never even be loaded.

Facebook Openfb cordova

Really struggling with facebook at the moment
I am trying to auth a user using openfb and facebook on an ios app being built with cordova (ionic). I have tried all the solutions I could find online.
My configuration is standard, and an almost copy and past of the openfb example. Without a callback url and with the following callback urls () I am getting the image you see on this facebook Security Warning while user has enabled secure login - iPhone
When I specify the callback url of http://localhost/oauthcallback.html. I get a Facebook mobile looking page with title, Error and message "Given URL is not permitted by the application configuration.: One of more of the given URLs is not allowed by the App's settings. It must watch the Website URL or canvas URL, or the domain must be a subdomain of one of the App's domains.
Note: works perfectly on web!
Can someone eplse point me in the direction to set this up once and for all on both Facebook and in openfb?
Please help!!!! :)

user1132726,
I struggled with that for days as well, looked over lots of forums, tried everything. Then I turned away to Javascript only.
We must have the right Javascript libraries in the right order. Some you can download, some you won't find easily.
<script src="js/jquery.mobile-1.4.5.min.js"></script>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="https://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript" src="js/cdv-plugin-fb-connect.js"></script>
<script src="js/openfb.js"></script>
Then you use regular Javascript logic to select your elements and use openfb API like:
openFB.login(
function(response) {
if (response.status === 'connected') {
alert('Facebook login succeeded, got access token: ' + response.authResponse.token);
// DO YOUR LOGIC HERE, I use perception: $.FacebookPerception.submit(response.authResponse.token);
} else {
alert('Facebook login failed: ' + response.error);
}
}, { scope:'email,public_profile,user_likes,user_friends'});
You must as well register your application at Facebook using Developers Console: http://developers.facebook.com . I used the website configuration with my main url: http://www.texugo.com.br/
I don't think you need other configurations. I tested only on Android. I don't know if you need to configure your App for Android at Facebook Console. I think it is not really used but haven't tested yet.
IMPORTANT: you need version 0.4 for openfb.js
Then you run Apache Cordova and deploy it to your mobile.
Further steps:
When you call Facebook it opens on a popop that Cordova applies
InAppBrowser, but I want to hide that ugly header that looks weird.
Integrate with Google+, LinkedIn and Twitter
Create OpenSocialAuth plugin
OBSERVATION: this is only working with Android, it does not work in web browsers. Gotta check it as well.
Hope it helps. Anything question me. I'm pretty sure I missed something.
See you.

FB.ui permissions.request does not work properly

It became really annoying when discovered new bugs today.
Basicly what i'm trying to do is; showing a Facebook dialog box and getting needed permissions to app and run callback js function. But can not achieve this simple and the most important part of the app.
First, lets initialize it:
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function()
{
FB.init({appId: '135814169854494', status: true, cookie: true, xfbml: true, oauth: true });
FB.ui({method: "permissions.request", "perms": 'publish_stream,user_about_me,email,user_birthday,user_likes'} , function(response) { console.log(response); });
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/<?=$__FBLocal?>/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
Now Javascript popup displays but if you click Okay, Go to App button, it does not grant permissions or even popup does not go away. Nothing changes! weird
If you disable Enhanced Auth Dialog from Advanced Application Settings in Facebook Developers section,
PopUp Style changes:
When you click Allow button, a javascript error throws: FB.Auth.setSession incompatible with OAuth2.
It is really common bug. There are some tips to not to get this bug i could find but all of them is not working. ( Such as; remove any extensions to all.js url -which i don't have- or change oauth parameter in FB.init -does not solve anything anymore- )
So , the only workaround is -unfortunately- embeding the permissions dialog in to page by redirecting. If someone can achieve JS SDK permission dialog , please let me know. Really stuck with lack of documentation in Graph API pages.

First I would suggest creating another facebook application to get a new facebook ID and test with it. If it works, then something was corrupt within facebook's storagea of the original facebook application's data. If it doesn't work, then you have a reproducible bug which you can report to facebook via their bug tracking tool.

I'm pretty sure permissions.request is deprecated. Can you try using method: oauth instead of permissions.request? Also, the perms param needs to change to scope. See https://developers.facebook.com/docs/reference/dialogs/oauth/

Why is Facebook connect button on click throwing a JavaScript error?

We're having a really odd problem. Basically the Facebook Connect button we put up on our local testing site worked fine until yesterday, now whenever we click on it,
it seems to go the xd_receiver.htm page which just shows a blank page rather than the app login and throws an error on this javascript file:
http://static.ak.connect.facebook.com/js/api_lib/v0.4/XdCommReceiver.js
The error is 403 forbidden, is this facebook blocking us? If so why could it be?
This is in our javascript tags:
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php"
type="text/javascript"></script>
function OnRequestPermission() {
var myPermissions = "publish_stream";
FB.Connect.showPermissionDialog(myPermissions, function(perms) {
window.location.reload()
if (!perms) {
// handles if the user rejects the request for permissions.
// This is a good place to log off from Facebook connect
} else {
// finish up here if the user has accepted permission request
};
});
}
FB.init("OUR_ID", "xd_receiver.htm");
This is in our HTML code:
<fb:login-button onlogin="OnRequestPermission();"></fb:login-button>
It all worked fine with the permissions etc. till yesterday and brought up the login page before but now just shows a blank page with 403 on the XdCommReceiver.js file. No changes were made to our app. It's stopping us from progressing with our company's app and any help would be appreciated. Thanks!

The old featureloader.js SDK is deprecated - see https://developers.facebook.com/docs/oauth2-https-migration/ for more information - I'm surprised it was working as recently as last week - it was due to be shut off in October as far as I know

Debugging Javascript (and Facebook Login)

I am not good with JS :) I am messing around with adding the Facebook Login to my site here at http://www.comehike.com and on top right you can see that the FB login button renders, but if you click it, it doesn't work.
I tried putting the button into the body of the page and it actually worked. So my sense is that its some JS issue that caused the problem. How do I debug it in Firebug or another tool? I am just not fluent maneuvering in these technologies.
Any help would be appreciated. All I really want to do is make the FB login button click-able in the header :)
Thanks,
Alex

Use a console (Firebug, for instance) and the problem is pretty clear.
Uncaught ReferenceError: FB is not defined www.comehike.com:94
FB.login() called before calling FB.init(). all.js:3
My guess is that you're trying to call FB.init() before the Facebook script actually loads.
Line 94 contains this code:
window.onload=FB.init();cycleBan();
If you're trying to execute FB.init() (and also cycleBan()?) on the window's onload event, that's not going to work. What the above code does is set the value returned by FB.init() to the window.onload handler, and then calls cycleBan(). Try this instead:
window.onload = function () {
FB.init();
cycleBan();
};
Edit after reading a bit of the Facebook API docs, it looks like you're not passing an appId to FB.init(), which I think is necessary:
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId:'YOUR_APP_ID', cookie:true,
status:true, xfbml:true
});
</script>
<fb:login-button>Login with Facebook</fb:login-button>
So you should change your code to use the same structure.
Edit 2 okay, so I've never used the Facebook API before - just took another look at your page and it looks like you're already using the right basic template, and I guess you're passing the appId as a URL parameter. Oh well, shows how much I know.

On Firefox you can use the Firebug add-on (I'm guessing you know about it as you used the name in your question). Just go to the page, click the Firebug icon in the status bar at the bottom, and use the Scripts tab to go to your script code, set breakpoints, and single-step through.
You can also do this with the dev tools built into Chrome, Safari, Opera, and even IE from IE8 onward. (In earlier versions of IE you can use the free edition of VS.Net for debugging.)
One nice thing about all of these is that you can right-click an element (like your button) and choose "Inspect element" to go straight to information about it. On Chrome at least (and probably others) that includes event handlers assigned to it, which makes it easy to find things.

Make sure the script connecting to the js is secure
http://connect.facebook.net/en_US/all.js
should be
https://connect.facebook.net/en_US/all.js

If you pass the non existing FB app key to init() then only you get the error of 'FB.login() called before calling FB.init()'
Make sure, you haven't been doing the same.