Why is one metarefresh to YouTube failing while another is succeeding? And why does it have anything to do with whether Youtube as an app is installed?
We have two metarefresh links that take users to videos from an iOS app.
(1) This page refers properly to Youtube whether the Youtube iOS app is on your device or not:
The invoking link is: http://ourURL/videos/ourpage.html
The receiving HTML page is this:
<!doctype html>
<html>
<head>
<meta http-equiv="Refresh" content="0; url=http://youtu.be/tJ08IHetnbU" />
</head>
<body>
</body>
</html>
(2) The referral page that breaks is designed the same way but works only if the Youtube app is NOT on your iOS device. If the Youtube app is on your device, we see "Playback error. Tap to retry." "Error loading Tap to retry"
The invoking link is: http://ourURL.com/videos/ourpage2.html
<!doctype html>
<html>
<head>
<meta http-equiv="Refresh" content="0; url=http://youtu.be/0FZbh-Cqfg4" />
</head>
<body>
</body>
</html>
The answer turned out to be a caching issue in the YouTube app.
It appears the Youtube app relies on the Safari cache. The Meta-refresh had referred to different video links before - so the new updated links failed.
Interestingly, for whatever reason, Safari is not using its cache and showed the proper video.
After going to Settings, Safari and "Clear cookies and data" - the YouTube App started showing the referral pages properly again.
Related
I have published my app on iOS Appstore. To show smart banner I use following code on my webpage.
<html>
<head>
<title>Kinjal's Games</title>
<meta name="apple-itunes-app" content="app-id=6444216110, app-clip-bundle-id=com.kinjal.brainbooster"/>
</head>
<body>
Yo
</body>
</html>
When I load webpage, it shows banner for 1 sec and then disappears immediately.
To verify, I tried by using other app's Appstore id. If I try using facebook's app id, it works.
<meta name="apple-itunes-app" content="app-id=284882215, app-clip-bundle-id=com.kinjal.brainbooster"/>
But it doesn't work only with my app id
<meta name="apple-itunes-app" content="app-id=6444216110, app-clip-bundle-id=com.kinjal.brainbooster"/>
Quite often when joining a public wifi you need to go through a confirmation screen before getting access to the broad Internet. Most of the time after connecting through Settings, you'd open Safari just to do that confirmation before using your apps.
How can I detect this state from my app and show a web view to let the user do that form the app?
You can use this URL: https://captive.apple.com/hotspot-detect.html
If you get HTTP statuscode 200, and something other than 'Success' in response, then you're probably talking to a captive portal.
Or you can of course create your own hotspot-detect page:
<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>Success</TITLE>
</HEAD>
<BODY>
Success
</BODY>
</HTML>
My question is what can I do to convert the custom URL scheme to a QR code that can open an app.
Let's say I have a custom URL (myScheme://). It works if I type it on my phone's browser.
But if I just convert it through some online qr code generator, the qr code reader is not going to open the url in browser and just return me a plain text.
Does it mean I need to build an own QR code reader to handle it?
I think it depends on QR Code Reader apps. In my situation I have a custom URL (itms-services://?action=download-manifest&url=xxx) QR Reader for iPhone works. But some customers said: "I can't install the app. QR just opens Safari.". There are so many QR Reader apps and we don't know which one is used.
But you can use your own web-site something like this:
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width,minimum-scale=1.0, maximum-scale=1.0" />
<title>Site Name</title>
<style>#media screen and (max-device-width:480px){body{-webkit-text-size-adjust:none}}</style>
<!-- implement javascript on web page that first first tries to open the deep link
1. if user has app installed, then they would be redirected to open the app to specified screen
2. if user doesn't have app installed, then their browser wouldn't recognize the URL scheme
and app wouldn't open since it's not installed. In 1 second (1000 milliseconds) user is redirected
to download app from app store.
-->
<script>
window.onload = function() {
<!-- Deep link URL for existing users with app already installed on their device -->
window.location = 'yourapp://app.com/?screen=xxxxx';
<!-- Download URL (MAT link) for new users to download the app -->
setTimeout("window.location = 'http://hastrk.com/serve?action=click&publisher_id=1&site_id=2';", 1000);
}
</script>
</head>
<body>
<!-- button to Download App for new app users -->
<form action="http://hastrk.com/serve?action=click&publisher_id=1&site_id=2" target="_blank">
<input type="submit" value="Download" />
</form>
<!-- button to Open App to specific screen for existing app users -->
<form action="yourapp://app.com/?screen=xxxxx" target="_blank">
<input type="submit" value="Open App" />
</form>
</body>
</html>
Then you should generate QR with website url. It will open in Safari and will redirect your app. (I hope so.)
Should the stream action via SC API / Javascript SDK 2.0.0 work on iOS/Safari?
I'm finding that it doesn't with the trivial example below.
It seems like SoundManager is capable of knowing how & when to use html5. Am I mistaken?
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h1>Sound Cloud iOS test</h1>
<script src="//connect.soundcloud.com/sdk-2.0.0.js"></script>
<script type="text/javascript">
SC.initialize({
client_id: "YOUR_CLIENT_ID"
});
SC.stream(
'/tracks/293',
function(sound) {
sound.play()
}
);
</script>
</body>
</html>
You cannot force play or download any audio/video files in Safari on iOS devices without user initiation.
In Safari on iOS (for all devices, including iPad), where the user may
be on a cellular network and be charged per data unit, preload and
autoplay are disabled. No data is loaded until the user initiates it.
This means the JavaScript play() and load() methods are also inactive
until the user initiates playback, unless the play() or load() method
is triggered by user action. In other words, a user-initiated Play
button works, but an onLoad="play()" event does not.
This plays the movie: <input type="button" value="Play" onclick="document.myMovie.play()">
This does nothing on iOS: <body onload="document.myMovie.play()">
You will need to wrap your play action into a button, so that the audio stream is opt-in rather than automatic.
Check this article in the Safari docs for reference.
I'm trying my hand at building an HTML5 driven offline app for my iPad 2 which has iOS 4.3.4. I followed instructions I've seen on several websites to a tee, and was even able to verify using Chrome's Developer Tools that the cache is working:
Creating Application Cache with manifest http://localhost/experiments/test.manifest
Application Cache Checking event
Application Cache Downloading event
Application Cache Progress event (0 of 2) http://localhost/experiments/offlineApp.js
Application Cache Progress event (1 of 2) http://localhost/experiments/offlineApp.css
Application Cache Progress event (2 of 2)
Application Cache Cached event
I have a home screen icon as well as a "startup screen" image in play. I can download the app to the home screen just fine, and I see the icon there. However, when I have the Wi-Fi off and I try to open the app I get the dreaded " could not be opened because it is not connected to the Internet" alert.
Does anyone know if something changed in iOS 4.3.4 (or an earlier version of the OS) that changed the requirements to get this feature of HTML5 working?
Thanks!
Edit
I tried this again outside of a "localhost" setting. This is my HTML:
<!DOCTYPE html>
<html lang="en" manifest="/experiments/cache.manifest">
<head>
<meta charset="utf-8"/>
<title>cache.manifest test</title>
<link rel="stylesheet" href="cache-manifest-test.css"/>
<link rel="apple-touch-icon" href="icon.png"/>
</head>
<body>
<h1>cache.manifest</h1>
<p>Let's see if this thing works...</p>
<script src="cache-manifest-test.js"></script>
</body>
</html>
And this is my cache.manifest file's contents:
CACHE MANIFEST
cache-manifest-test.css
cache-manifest-test.js
I see the proper results in Chrome's developer tools. I get the "Application Cache Cached event." It just doesn't work offline. I'm really stumped here...
Does anyone know of any pages that have full blown code I could just copy to my server and try?
Thanks...
The messages you posted from Chrome are when the page is served from localhost.
Check that it works on Chrome using the server rather than localhost.
If it doesn't, check that you are serving the correct type (text/cache-manifest) for an appcache on the server.
If you're serving the correct type on localhost but not on the server, that would explain the different behavior.
Also, I've read that the file must be named "cache.manifest" on the iPad. If you have named it something else, try that.