Open installed PWA from external url - ios

Is there any method to open website (PWA) urls in the installed PWA in iOS- Safari?
Use case: I'm sending email links to login in my PWA, how can I make this url's open directly with the installed PWA instead of the browser?

If you are using Chrome in Android or any of the desktop OS, that would be the default behavior.
Check on "Android intent filter" in this link.
This feature is not supported in iOS yet for PWA apps(created using Safari- the only option for iOS as of June-2018).See "What PWAs can do on Android and not on iOS" section last point.

For iOS, there is actually a very unknown way which you can install a .mobileconfig profile which installs a web clip (or multiple web clips if you like).
This will run your website in fullscreen and is very similar to how iOS PWAs work. You can also link to it online or send it as an Email attachment for your users to install.
Just make sure you add this for the webpage to open fullscreen:
<key>FullScreen</key>
<true/>
You can read more about creating your own from scratch here:
https://developer.apple.com/library/archive/documentation/NetworkingInternet/Conceptual/iPhoneOTAConfiguration/ConfigurationProfileExamples/ConfigurationProfileExamples.html
or if you have a Mac you can get the "Apple Configurator 2" App:
https://apps.apple.com/us/app/apple-configurator-2/id1037126344
or you can take the easy route and use a generator here if you don't have a Mac:
https://webclip.glitch.me/

It is possible to open PWA if already installed in desktop?
I have installed the PWA applicaiton now I want to trigger the open with prompt from chrome engine

Related

Simulate "IOS add to home screen" on desktop google chrome for debug

Is there any way to simulate the “IOS add to home screen” function in windows with Google Chrome for debugging ?
I want to debug PWAs (progressive web applications) with a browser like Google Chrome.
For example at this link or this link , this two site have a PWA and need to be added to home screen to be shown or debugging.
The only way I can think of so you can do that is if you have a Mac with the XCode iPhone simulator.
Not all PWAs (progressive web applications) are the same, for the second link you can simply use “toggle visibility” option on inspect element sources and use the app, but I doubt you can do that for the first one.

Issue with PWA on iOS 113

I have a PWA that I've been using perfectly till I updated my phone to 11.3 (introduce Service Workers supports, so in my iPhone it was only a bookmark) and all worked like a charm.
After I've updated to iOS 11.3 I wasn't able to enter to my app because I have an external login (in other domain) so each time I try to open my open this will open a safari browser to make the auth. Before PWA in iOS the external URLs were open in the same open (without open safari). Do you know if this is the correct behavior and, if it is ok, how can I fix it?
Thanks!
I managed to fix this by removing the manifest meta tag:
<link rel="manifest" href="/tracker/site.webmanifest">
My project is a simple PWA that uses Google's OAuth for login. I was getting redirected to Safari to login and unable to go back to the app (on my home screen). Hope it works for you too, I wasted 2 days trying to find a solution.
The reply by Anand tells me that offline capable PWAs need to implement service workers, since they are supported in 11.3 (or 11.4, not sure) and NOT manifests.
Anyways, this worked for me, hope it helps others as well.
When PWAs without service works(either your browser don't support it or your app don't have one) are added to home screen, its mere a bookmark. When the browser finds a SW, then it creates a package(like apk).
How to test this - Find a PWA site without service worker in android and add to home screen. When I tried it in one of Samsung device, it showed only "Remove" option and no uninstall option. When I added a PWA which had SW, got uninstall option. I was also able to locate the apk generated by Chrome when service worker is present.
Now on iOS - 3 possibilities I could think of.
1) My theory based on above behavior on PWAs with and without Service worker, your home icon create by iOS 11.2.x is a bookmark and the new version of safari is treating it as a bookmark to open it in browser. I couldn't test this as I've upgraded to 11.3 already and don't have a pre 11.3 PWA icon.
2) If you have reinstalled the icon(by removing and adding again to home screen) and still have the issue, its probably because your manifest file or service worker files have some issue/compatibility with Safari.
Since we don't have something like Lighthouse for safari, you can validate your manifest.json and service workers in Chrome Lighthouse.
3) Check on scope attribute in the manifest file to make sure you cover your entire domain you intent to cover. If you scope covers domain.com/myapp only, domain.com/otherapp will be opened in the browser when tried to open from any source.
It seems that with the last iOS version 11.4 this issue is solved, I think that now safari shares the context between the browser and the PWA and for example from PWA cookies can be accessed throw safari.
But I think there's still an issue when you open the PWA and you are being redirect to login (safari opens) once you're log in you stay in the browser (iOS does not return to the PWA, but this is a first step)

Can you launch **any** phone app from a web link?

Im making a phone automation system with a web interface. As part of this I am looking to replace all remote controls (tv media center etc) with my phone.
I have a Roku media player that has a remote control iOS app, what I am trying to do is to launch the Roku native phone app from my web interface.
I know it is possible to launch apps via href such as this:
Launches native FB app
But I have tried both these which fail
Fails to launch native 'Roku' app
Fails to launch native 'ROKU' app
So I have two main questions:
Is it possible to launch any app from a web link, or does the app developer need to enable that function in some way?
Answer - Yes the app developer will need to set a url schemer
Is there a way to determine the URL you would need to launch an app IE the Facebook app can be launched by fb:// but can you determine that anywhere?
Answer - There is a link to multiple URL schemers for popular apps below but my understanding is that the app developer would need to release them
Thanks
JS Fiddle just in case - https://jsfiddle.net/0znc12bs/
Update - as a point of reference I am not developing an app this is a
web service trying to connect to apps I didn't author.
Update2 - I have been in touch with Roku support and their remote app
currently doesn't support deep linking.
To open the app from the web url the app developer need to set the id (deep linking) setting and URL Schemas in the app
For the famous app you can find the deep linking url from the net,from that you can make your list to open the app
else you can find on it's site if they have written that
List of sites which can provides some list of url schemas which you can use to open app from the web :https://stackoverflow.com/a/11155918/4557505

How to forcefully load desktop site in iFrame in Cordova App?

I want to forcefully load the Desktop View of any website in Cordova App for iPad. I am trying to loading in both iframe and InappBrowser.
By changing User Agent; I tried several methods to change User Agent but no luck. Any idea on this please? If we change user agent will the Apple reject the app while submitting for App Store?
I saw the option in Safari in iPad for 'request desktop site'. Can we do it programmatically in Cordova? or any option in iFrame for this?
Normally the website is redirecting from the Desktop url to mobile site url. So disable redirection is a solution? If so is there any option for that?
Change the iFrame size to pc desktop size and scale to reduce; I tried this but mostly not working.
or is there any other solution.
Thanks
It was working fine before version 4.0.0 of cordova-ios (Different from cordova version).
To be able to do that again a quick fix can be to remove the ios folder created by the new version and adding the old one:
cordova platform rm ios
cordova platform add ios#3
Hope it helps

Embed Developer Tools for a WebView in Chrome Packaged Apps

Is it possible to open Developer Tools for a <webview> in Chrome Packaged Apps inside another <webview> using chrome-devtools:// protocol?
you can open dev tools by right-clicking on content inside webview and choosing inspect element. Unfortunately this works only for the unpacked packaged apps loaded from the file system. Right click is disabled in the app loaded from the Chrome Web store. I placed a question on this to Google engineers but did not get a response yet. Will update when I do.
Update: got an answer from Google: enable the flag "Enable debugging for packed apps" in about:flags. See this answer in this SO issue.

Resources