I have implemented deeplink for my ionic v1 application and also implemented universal link for same. I also checked so many links to implement App store redirection functionality.
Most of the link suggest to implement javascript code which first check device and based on ios/adnroid/window it will redirect to particular store but let say I will create that javascript code look like below
const iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);
if (iOS) {
window.location.href = "temp://itunes.apple.com/us/app/...";
}
but where should I put this file so when user click on deeplink it should redirect to particular this file and redirect to App Store/Play Store?
Let say I want to give my deeplink to some other server for which i don't have any access then what?
is there any other param or attribute we can set like fallback url by which when app is not installed it will automatically going to that particular link?
Any answer would be great help.
Thanks.
Usually it works that way:
You place a link on the website where you want to advertise your app. That link has a click tracking domain that points to your server. e.g. click.example.com/....
Upon clicking, if the app is installed, Universal Links would ensure that the app is opened. This is done by iOS (only if you configured Universal Links correctly, see https://developer.apple.com/ios/universal-links/). If the app is not installed, a redirect is done to your click tracking domain. This is where your Javascript logics should apply, so basically you need to reply to the request with a 302 redirect to an HTML file that contains the redirection logics (as in the example above). In that server response you can handle any fallback URL you want to use.
By the way, to make Universal Links work, anyway you had to host the AASA file, so you probably already created a server, so you can use it for the case where the app is not installed.
I am using Unity 5.3.4f1 and Facebook SDK for unity 7.4
The problem is poor documentation and not having step by step guide to facebook SDK FB.Mobile.AppInvite in:
https://developers.facebook.com/docs/unity/reference/current/FB.Mobile.AppInvite
FB.Mobile.AppInvite(
new Uri("www.HereGoesTheAppLinkUrl.com"),
new Uri("https://www.dropbox.com/s/vzl519vvf4hfe3j/3DTank1200X628.png?dl=0"),
AppInviteCallback };
The issue is what is AppLink? how to create it?any Csharp code for that?
where is the documentation regarding this subject? any guide example? anyone anything? am I even asking the right questions?
In a few newbie words - AppLink is a webpage full of meta headers. These meta headers redirect the client to appropriate application or store on their device.
E.g. if you create an AppLink page for MyXYZapp, which is an app for both iOS and Android, than probably you'll have a pseudo code in your AppLink page header like this:
//client is visiting the applink:
if the client is on Android:
try:
open app with bundle id `com.AndroidCompany.MyXYZapp`
else if MyXYZapp is not present on the device:
redirect client to Play Store page of MyXYZapp
else if the client is iOS:
try:
open `com.iOSCompany.MyXYZapp`
else:
redirect to AppStore page of MyXYZapp
else if client is visiting from any other OS:
redirect to AppStore / PlayStore via browser (or create your own behaviour)
EDIT:
Facebook itself now provides applinks, as described here:
https://developers.facebook.com/docs/applinks/index-api/
EDIT, THIS NO LONGER WORKS:
Now most people do not own servers to host these kinds of pages so facebook offers free hosting and very easy tool to generate AppLinks for your apps:
https://developers.facebook.com/quickstarts/?platform=app-links-host
read more here:
https://developers.facebook.com/docs/applinks/hosting-api
p.s. hope the URLs don't decay and dissolve through the coming centuries
p.p.s the URLs have decayed under 2 years. Crazy
I am struggling a little bit. I have a common url like www.domain.com/test.html
and i want Android users to get my app open if "test" is included, otherwise if they don't have the app their should be directed to the play store. I got everything implemented and it works with mozilla browser. But using chrome on Android it should be forbidden to automatically open the app if it is available!?. Now if the user enters www.domain.com/test.html and i recognize he is using Android and Chrome i tried the intent stuff in a script in a redirected www.domain.com/android_chrome.html:
<script> window.open("intent://scan/#Intent;scheme=zxing;package=com.google.zxing.client.android;S.browser_fallback_url=http%3A%2F%2Fzxing.org;end","_self")
</script>
But the App won't open automatically. If i use a regular Link:
Take a QR code
it works. But i want to let it open automatically!
Google restricted starting intents from javascript apps, that's why it isn't working. Security reasons I guess. You should just display nice big link to let user switch to your app instead of website - or let him continue if he doesn't want to launch the app.
Forcing users into using app is bad, IMO. Splash screen suggesting to use it is okay, but don't push it.
I'm developing website with a lot of HTML5 and CSS3 features. I'm also using iframe to embed several content on my website. It works fine if I open it using Chrome/Firefox/Safari mobile browser. However, if I share on facebook (post/page) and I opened it up with Facebook application with Facebook Internal Browser, my website is messed up.
Is there any tools or way to debug on Facebook Browser? Thanks.
This is how you can do the debugging yourself. It's painful, but the only way I've come across so far.
tl;dr Get the Facebook App loading a page on your local server so you can iterate quickly. Then print debug statements directly to the page until you figure out what is going on.
Get a link to a page on your local server that you can access on your mobile device (test in mobile safari that it works). See this to find out your local IP address How do you access a website running on localhost from iPhone browser. It will look something like this
http://192.xxx.1.127:3000/facebook-test
Post that link on your Facebook page (you can make it private so your friends aren't all like WTF?)
Click the posted link in the Facebook mobile App and it will open up in Facebook's mobile browser
Since you don't have a console, you basically need to print debug statements directly to the page so it is visible. Put debug statements all over your code. If your problems are primarily related to CSS, then you can iteratively comment out stuff until you've found the issue(s) or print the relevant CSS attributes using JavaScript. Eg something like (using JQuery)
function debug(str){$('body').append("<br>"+str);}
Quite possibly the most painful part. The Facebook browser caches very aggressively. If you are making changes and nothing has happened, it's because the content is cached. You can sometimes resolve this by updating the URLs, eg /facebook-test-1, /facebook-test-2, or adding dummy parameters eg /facebook-test?dummy=1. But if the changes are in external css or js sheets it sometimes will still cache. To 100% clear the cache, delete the Facebook App from your mobile device and reinstall.
The internal browser the Facebook app uses is essentially a uiWebView. Paul Irish has made a simple iOS app that lets you load any URL into a uiWebView which you then can debug using Safari's Developer Tools.
https://github.com/paulirish/iOS-WebView-App
I found a way how to debug it easier. You will need to install the Ghostlab app (You have a 7-day free trial there, however it's totally worth paying for).
In Ghostlab, add the website address (or a localhost address) you want to debug and start the session.
Ghostlab will generate a link for access.
Copy that link and post it on Facebook (as a private post)
Open the link on mobile and that's it! Ghostlab will identify you once you open that link, and will allow you to debug the page.
For debugging, you will have all the same tools as in the Chrome devtools (how cool is that!). For example, you can tweak CSS and see the changes applied live.
If you want to debug a possible error, you can try to catch it and display it.
Put this at the very top of your code:
window.onerror = function (msg, url, lineNo, columnNo, error) {
var string = msg.toLowerCase();
var substring = "script error";
if (string.indexOf(substring) > -1){
alert('Script Error: See Browser Console for Detail');
} else {
var message = [
'Message: ' + msg,
'URL: ' + url,
'Line: ' + lineNo,
'Column: ' + columnNo,
'Error object: ' + JSON.stringify(error)
].join(' - ');
alert(message);
}
}
(Source: MDN)
This will catch and alert your errors.
Share a link on Facebook (privately), or send yourself a message on Facebook Messenger (easier). To break the cache, create a new URL every time, e.g. by appending a random string to the URL.
Follow the link and see if you can find any errors.
With help of ngrok create temporary http & https adress instead of your ordinary localhost:3000(or other port) and you could run your app on any devices. It is super easy to use.
and as it was written above all other useful information you should write somewhere inside div element (in case of React I recommend to put onClick on that div with force update or other function for getting info, sometimes it helps because JS in FB could be executed erlier than your information appears). Keep in mind that alerts are not reliable, sometimes they are blocked
bonus from ngrok that in console you will see which files was
requested and response code (it will replace lack of network tab)
and about iFrame.If you use it on other domain and you rely on cookies - you should know that facebook in-app browser blocks 3rd party cookies
test on Android and iOS separately because technicaly they use different browsers
I was interested in developing my app on Azure Mobile Services and notice the authentication flow uses iFrame pattern which does not work on Internet Explorer mobile. However, the authentication works fine on Safari mobile. It seems silly to develop an app using a Microsoft service that isn't supported by Microsoft browser. I assume there is a work around but I just can't find it. Can someone point me to a link or explain the solution? I could always fall back to building my own ASP.Net website with true page redirects instead of iframes, but I would rather leverage what Mobile Services offers. Any help is appreciated.
Edit (Response to phillipv):
Version:
I was using the starter project that is generated by the Mobile Services portal. It comes with a script reference in the index.html page seen here:
<script src='http://ajax.aspnetcdn.com/ajax/mobileservices/MobileServices.Web-1.2.5.min.js'></script>
I modified the project slightly by adding a login button at the top, which when clicked calls the login function in the SDK, which was taken directly from the sample code as seen below:
client.login("facebook").done(function (results) {
alert("You are now logged in as: " + results.userId);
}, function (err) {
alert("Error: " + err);
});
Perhaps there is some flags i need to pass to the function to force it to use full redirects instead of iframe transport.
Browser Version: I'm not sure where to find this, but I'm on Windows Phone 8.1 which has auto updating apps so I assume whichever IE Mobile that is latest.