iphone-standalone-web-app

Making a website for the iPad, removing the browser after adding to homescreen?

阅读更多关于 Making a website for the iPad, removing the browser after adding to homescreen?

问题 I noticed that if you go on google chat, and "add to home screen", once you open it from home screen, the browser disappears and all you see is the website itself... I'm wondering how google managed to do that? this is for a website I am making that is supposedly compatible for the iPad. 回答1: Add the following meta tag to the page's header: <meta name="apple-mobile-web-app-capable" content="yes"> The window.navigator.standalone boolean JavaScript property will indicate whether the page is

OIDC and PWA (add to home screen)

阅读更多关于 OIDC and PWA (add to home screen)

问题 Update: Basically the same issue as Standalone PWA breaks login but on iOS. If you add a web app to the home screen, Chrome on android shares the local storage with the same domain in the browser. You can test this by going to https://wilfrem.github.io/add_to_homescreen_test/ then adding to home screen and see you have the same id when opened from home screen. (I did Nexus 5x) If you do the same in iOS Safari you get a new id. (i did iPod iOS 12.1.1) The oidc-client-js library sets a session

iPhone window.open(url, '_blank') does not open links in mobile Safari

阅读更多关于 iPhone window.open(url, '_blank') does not open links in mobile Safari

问题 I'm sending users to some .pdfs in a standalone web app (saved to home page, no PhoneGap) on iPhone/iPad. With window.open(url, '_blank'); these documents open on top of the web app and since there is no back button there is no way to get back. Can I open these in a new window in JavaScript, or do I just need to use a real a href ? 回答1: I'm sure you can do it using JavaScript, but doing it with an anchor tag would be much easier. All you have to do is add a "target="_blank" attribute to the

iOS WebApp not showing startup image

阅读更多关于 iOS WebApp not showing startup image

I added <link rel="apple-touch-icon" href="favicon.png" /> <link rel="apple-touch-startup-image" href="splash-screen.png"/> <meta name="apple-mobile-web-app-status-bar-style" content="black"> between the head tags of my website but it doesn't work for the startup image is this normal? Are you trying to view the startup image in your desktop browser? If so then I would visit your website on an IOS mobile device and add the app to your homescreen. When you open it you should see the splash screen. Splash screen are also tricky with different screen sizes. You can use the following code to ensure

OIDC and PWA (add to home screen)

阅读更多关于 OIDC and PWA (add to home screen)

Update: Basically the same issue as Standalone PWA breaks login but on iOS. If you add a web app to the home screen, Chrome on android shares the local storage with the same domain in the browser. You can test this by going to https://wilfrem.github.io/add_to_homescreen_test/ then adding to home screen and see you have the same id when opened from home screen. (I did Nexus 5x) If you do the same in iOS Safari you get a new id. (i did iPod iOS 12.1.1) The oidc-client-js library sets a session reference in local storage and then recalls that on the web app s signin callback. So if you try to log

iPhone window.open(url, '_blank') does not open links in mobile Safari

阅读更多关于 iPhone window.open(url, '_blank') does not open links in mobile Safari

I'm sending users to some .pdfs in a standalone web app (saved to home page, no PhoneGap) on iPhone/iPad. With window.open(url, '_blank'); these documents open on top of the web app and since there is no back button there is no way to get back. Can I open these in a new window in JavaScript, or do I just need to use a real a href ? I'm sure you can do it using JavaScript, but doing it with an anchor tag would be much easier. All you have to do is add a "target="_blank" attribute to the anchor tag and it should work: <a href="https://www.pdflink.com" rel="PDF link" target="_blank">Link Text</a>

Background behavior for iOS Web App (so app doesn't restart)

阅读更多关于 Background behavior for iOS Web App (so app doesn't restart)

问题 I'm trying to build a mobile web app and am intrigued by the "apple-mobile-web-app-capable" option, making the app feel a lot more native. The issue I'm having is that it's an app that lets a user browse through a bunch of content, some of which opens a new browser window outside the web app (on purpose). The problem is, when a user goes back to the web app, it re-launches and starts them from the home page. Has anyone found a way to avoid this complete reloading process? 回答1: ive got it

Safari Mobile full screen

阅读更多关于 Safari Mobile full screen

问题 I'm trying to set the full screen mode on my iPhone Web App, I have read the Apple's documentation on apple-mobile-web-app-capable meta tag, but it doesn't work, can you help me? Thanks 回答1: You can also add a javascript function : <body onload="setTimeout(function() { window.scrollTo(0, 1) }, 100);"> 回答2: <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple

iPad Home Screen App refreshes on every open

阅读更多关于 iPad Home Screen App refreshes on every open

问题 I'm writing a web app for the iPad using HTML5 and SenchaTouch. The app uses cache manifest to function offline. Once it has been added in the home screen and opened without Safari, it will refresh itself every time it is opened, even if just navigating to the home screen and back. The desired behavior is to leave the app, do something else, and then come back to the app with everything untouched. An example of a similar app that displays the same (undesired) behavior can be found here: http:

iOS Full Screen Web App drops cookies?

阅读更多关于 iOS Full Screen Web App drops cookies?

问题 I have experienced that iOS4 drops cookies when you start/exits a web app saved to the dashboard (full screen mode). Is it true and is there a workaround? 回答1: It's not a bug, it's a feature. Session cookies (i.e. cookies with a lifetime of 0) are dropped at the end of the browser session — which, in the case of a full screen web app, happens as soon as you leave the web app. If you want them to persist, just set your cookie lifetime to something larger than the default 0 (I use 1 year). Now