I am building simple HTML5 presentations that will be served through an iPad app which pushes these local html5 files through UIWebView. As a developer, I am only limited to my own HTML5 code in each of these presentations. I have no access to the platform or the app these presentations reside in.
I have implemented Google Analytics. Doesn't work. I have implemented Localytics. Doesn't work. I have tried other numerous tracking platforms. They Don't work. The same code works when I upload my files to a web server and then visit it and click through. The same code does not work on the iPad. UIWebView is killing these Javascript libraries included for metrics/tracking.
Anyone ever use any metrics/tracking in a local HTML/HTML5 presentation that is served through an App using UIWebView? I am looking for somekind of solution. Your time is very much appreciated. Thank you.
Can you elaborate on "doesn't work"? I use both Google Analytics and Omniture from within a UIWebView and both work properly.
It sounds like you're tracking events, not just pageviews. That is, you're tracking when people tap on things. One thing that could be happening is the app is "trapping" those events. UIWebViews receive notifications when the apps inside them do certain things, so they can help those apps have a "native" experience. This includes things like link-handling, allowing an app to trap a Twitter intent, for instance, and send it to the actual Twitter app rather than keeping it in HTML.
It's not clear from your description whether this is the problem - but if it is, you would need to work with the app developer(s) if you wanted to keep using link tags. There's no choice - you can't stop the UIWebView from being notified, and if it does something with the event you won't get it back.
If all of this is true, try changing the elements to something other than tags. A DIV or LI, for instance, would not trigger this behavior. You'd have to do more work in your app to simulate "link-following" workflows. Something like this:
$('.tappable-item').click(function(e) {
e.preventDefault();
// Fire the analytics event
// Possibly wait 250ms or so to let the event get recorded
window.location.href = $(this).attr('data-href');
}
Google Analytics only accepts requests from the domain you configured for the campaign. What I did is create a secret page on my domain, and in the html I put an iframe that loads that page.
Related
I implemented universal link to my iOS app. It directs user to application if url has this "www.websiteurl.com/suburl/*.com" pattern.
I want this work only if user click this url from google search result. If user is already in website I want to open url in website either not open the application. How can I prevent it?
edit: I implemented Support Universal Links documentation.
Yes, this is possible, but I don't recommend it. If the user has the app installed, it seems like you should want to open the app as soon as possible since it is a much better experience. Anyways, here's my solution.
Option 1
Short answer: Wrap your website links in javascript
Why? according to the Apple standards of Universal Links, a link must be clicked on by a user to trigger the Universal Link, therefore if you set up all of your links on your website to be handled by javascript, the app will never open from inside your website.
Therefore, change
Link
Into a javascript call
Link
And open the link from javascript
function clickLink(link) {
window.open(link);
}
Option 2 (Better option)
Use a third-party like Branch links for all of your deep linking so that you can pass more context from web to app allowing the user to continue the same experience on mobile that they were just having on the web. Native is a much better experience 99.9% of the time and it converts users at a much higher rate than web.
I need to open my particular UIViewController when the following link is clicked on the Safari browser:
http://my.sampledomain.com/en/customer/account/resetpassword/?id=24&token=8fbf662617d14c10f4a11f716c1b2285
When this link is clicked on the browser, I need to open my application on a particular screen and retrieve the data from this url. For example:
id = 24
token = 8fbf662617d14c10f4a11f716c1b2285
...and pass it to that particular UIViewController.
How can i do that?
What you are describing is called Deep Linking. It's a very common app feature to implement — most apps have it — and conceptually, it seems like an easy thing to build. However, it's complicated to get right, and there are a lot of edge cases.
You basically need to accomplish two things:
If the app is installed: open the app and route users to the correct content inside it.
If the app is NOT installed: forward users to the App Store so they can download it. Ideally, also route users to the correct content inside the app after downloading (this is known as 'deferred deep linking').
While not required, you'll also probably want to track all of this activity so you can see what is working.
If the app is installed
Your existing custom URI scheme fits into this category. However, Apple has decided that custom URI schemes are not a good technology, and deprecated them with iOS 9 in favor of Universal Links.
Apple is right about this. Custom URI schemes have a number of problems, but these are the biggest:
There is no fallback if the app isn't installed. In fact, you get an error.
They often aren't recognized as links the user can click.
To work around these, it used to be possible to use a regular http:// link, and then insert a redirect on the destination page to forward the user to your custom URI scheme, thereby opening the app. If that redirect failed, you could then redirect users to the App Store instead, seamlessly. This is the part Apple broke in iOS 9 to drive adoption of Universal Links.
Universal Links are a better user experience, because they are http:// links by default and avoid nasty errors. However, they are hard to set up and still don't work everywhere.
To ensure your users end up inside the app when they have it installed, you need to support both Universal Links and a custom URI scheme, and even then there are a lot of edge cases like Facebook and Twitter which require special handling.
If the app is NOT installed
In this case, the user will end up on your http:// fallback URL. At this point, you have two options:
Immediately forward the user directly to the App Store.
Send the user to your mobile website (and then use something like a smart banner to give them the option of going to the App Store).
Most large brands prefer the second option. Smaller apps often go with the first approach, especially if they don't have a website.
To forward the user to the App Store, you can use a Javascript redirect like this:
<script type="text/javascript">
window.onload = function() {
window.location = "https://itunes.apple.com/app/id1121012049";
};
</script>
Until recently, it was possible to use a HTTP redirect for better speed, but Apple changed some behavior in Safari with iOS 10.3, so this no longer works as well.
Deferred deep linking
Unfortunately there's no native way to accomplish this last piece on either iOS or Android. To make this work, you need a remote server to close the loop. You can build this yourself, but you really shouldn't for a lot of reasons, not the least of which being you have more important things to do.
Bottom line
Deep linking is very complicated. Most apps today don't attempt to set it up by building an in-house system. Free hosted deep link services like Branch.io (full disclosure: they're so awesome I work with them) and Firebase Dynamic Links can handle all of this for you, and ensure you are always up to date with the latest standards and edge cases.
See here for a video overview an employee at Branch made of everything you need to know about this.
I have a mobile web app designed as a single place for employees of our company to help them locate various online resources. The app has a lot of in-app content, but also provides links to external partner websites. My issue is a common one with a bit of a twist. I like the way the app looks in standalone mode on an iphone, but am struggling to figure out a solution for keeping the app in stand-alone mode, while also providing the ability to open external links in safari. I know how to keep the app in standalone mode when links are clicked, but when an external link is clicked, one of two problems occurs:
1) If I code the external link to keep it in standalone mode, there is no way to navigate back to my app from the external site as the back button is obviously no longer available.
2) If I code the external link to open in safari, when the user is done with the external link, the session for my app is closed and the user has to go back to their homescreen and re-open it again. (I know I can code it so that they will return to where they were in the session, but this is not the solution I want).
My question is this, is there a way to open external links ON TOP OF a standalone web app session? So that when the external link is closed, the standalone web app session appears?
I've read that I can use AJAX to open external links within the active session, but I don't know how to do this and can't find anything online that explains it well. Any help would be MUCH appreciated.
My app functions fine in safari, but looks SO much better in standalone mode; I would be SO appreciative if anyone can provide a solution. I am also willing to discuss paying someone to help with this as well.
Cheers,
SC
Turn your app into an actual app, not just a web site. You should implement your own web browser in your app using UIWebView. It's very simple. You probably only need a back button and a close button, you don't need a full search/address bar, bookmarks, etc. UIWebView and two buttons will do it.
As soon as you switch apps to Safari you will see the behavior you have described - there's no getting around it. Your only choice is not to exit.
https://developer.apple.com/library/ios/documentation/uikit/reference/UIWebView_Class/Reference/Reference.html
my site is responsive, and it's looking good on Safari on iPhone. But when I browse to my website from my Twitter app on my iPhone, it seems to ignore most of my mobile styling and looks very bad. Is there something I can do to detect if the browser is some kind of mobile app (such as Twitter) and cause the page to load in the default mobile browser instead (Safari, Browser, etc.)?
Edit: I strictly used CSS' max-width media query and targeted HTML5 block elements to change widths into percents. On two navs, I changed the display attribute as necessary.
Turns out it was a caching issue. It loads fine in the Twitter app. Oddly, it didn't before, even after several tries.
To the best of my knowledge, you can't force the site to open in the default mobile browser. The decision whether to open your site in the app's UIWebView or the default Safari browser is made by the Twitter app alone. If the Twitter app was gracious enough to provides any interface for you to choose, it might be possible, but they probably don't. Most app publishers try to keep users inside the app for as long as possible, and throwing them outside to a different app usually goes against this.
Your best bet is probably to try to improve your site's responsiveness to also work inside the Twitter app UIWebView as well (or inside other apps for that matter). If you base your responsiveness on screen width for example (CSS max-width and friends), I assume it should also work inside the Twitter app UIWebView.
The problem you are describing is indeed a very serious and annoying one. UIWebViews inside apps don't implement by default all of Apple's special handlers (that work inside the original Safari). The app maker is expected to implement these manually, and 99% of all apps simply don't do this. It's true for many other apps as well, the Google native search app also opens URLs inside a UIWebView - and sites tend to look lousy there too.
You should also consider filing a bug with Twitter and urge them to improve website compatibility when opened inside their app.
You can't force the user to open the link from a browser from your website. Android WebView is restricted and by default does not allow javascript and other extensions.
You can find more information here: Android WebView VS Phone Browser
I will soon be writing a native iPhone app for my web site. The web site is already mobile optimised so could potentially just sit in a UIWebView. How does the Facebook app work? Does it do something similar?
If I did use a UIWebView then how would I store user credentials so they don't have to log in every time and how would they upload photos? These are my two main requirements.
The facebook app is going to be a native app. It is different from the mobile website.
There are two things you can do here. If you're going to make your native app just a UIWebView then don't bother! You can have an apple icon embedded in your website which will show if a user bookmarks your website on their home screen. To use this use the <link rel="apple-itouch-icon" href="/apple-touch-icon.png" /> code to do it.
The second is make a fully native app. I know the benefits of a UIWebView app, but the negatives are plain to see. UIWebView apps are tacky, nonfunctional and terrible to use. A mobile website is not an app (unless done very well). You will have links to click, pinch and zoom, awful bounce effects on the web view, links that may possibly allow users to navigate away from your mobile website but within your app. Again, unless done cleverly, you will have to provide browser controls on your app which will make it look like a tacky web browser.
My suggestion would be either stick with your website, optimise it for touch based input, make it a really good mobile website, or create a fully functional native application. Remember not all websites need to have an app to go with it. If your app isn't necessary then its merely counter productive to make an app for it. I don't know about anyone else, but I spend more time in my web browser than I do in apps.
With regards to uploading and auth then a) auth should be done already in your website. A UIWebView is just an instance of safari working within your app, so it will be able to get and store cookies and all sorts. I believe these degrade at the end of the app session, however its easy to pass to the objective c and store in an stored preference. b) uploads not going to work even if you put your site in a web view. You will have to (at some point) hand off to an upload screen in your app which is running natively.
I would suggest that you start off with a simple native app. Let the users log in, upload stuff and do other basic stuff - whatever they can't currently do on your mobile website. Then move on to other things as people ask for them, or as you have the time to make them. You don't have to launch your app with a fully functioning version of you website (in fact this would be silly because the only thing they cannot do on your mobile website on their phone is upload stuff). I'm sure people will request features as your product evolves.
I would take a look at PhoneGap, you can get access to native device features through javascript http://phonegap.com/