iOS link to standalone webapp - javascript

I am making a standalone webapp for a client, and he would be able to access to another website sometimes. So I made a link which open a tab in Safari (quit fullscreen) but then I wish I could return to the standalone app either by a link or by the address bar (without homescreen button which is locked).
Is there any way to make a link that go to a standalone web ? Or using javascript to open in fullscreen app ?
I hope Iwas clear enough, not easy to explain ^^

You can register a custom url scheme that links to your app. Basically, in your app .plist you register a scheme like "myapp", and any link that uses de protocol myapp://xxx would launch your app and pass whatever you add after the // ("xxx" in the previous example).
It's exactly like "mailto:" links, but opening your app instead of the Mail app :)
You can check how to configure your app in XCode looking at this answer: https://stackoverflow.com/a/12784399/201059
As you don't specify what platform you are using for packaging your WebApp, I can't give you further info, but if you were using Cordova/Phonegap you could install a plugin to receive the params after myapp://, so that you could go to a specific page/screen (ex: myapp://customercard?id=1234)
Update, regarding HoffZ's comment below:
When benuuts mentioned that it was a standalone webapp I understood that it was packaged with Cordova or a similar framework. If that it's not the case, unfortunately I'm not aware of any way to return to a fullscreen (pinned to the home screen) webapp.

Related

How do I use universal links with Expo?

We have the server set up and configured to return certain paths under /.well-known/apple-app-site-association. When we publish our app, the "associatedDomains" key in our app.json instructs iOS to give us a chance to open links in app.
That all, more or less, works. What we can't figure out is how to productively test universal links during local development. The expo app won't have our app.json and its a horrendous flow to make an independent build for this purpose (we lose hot reloading and frankly it just doesn't seem to work regardless)
This wouldn't be the end of the world if our product didn't require opening a link in email to log in, but it does and that requirement isn't going anywhere.
Expo does not support Universal links in development. They can only be tested in production and standalone builds. One work around for this is to use something like branch.io to conditionally send the user to a different url depending on the device they are using.

How would I create code to install my app from the url bar?

So, when I went to https://chromestatus.com/features I noticed in the url bar app it said install app. When I clicked it it install a chrome web app with the website in it. How would I be able to implement this in my website?
I tried going through the source code of the website and didn't find anything useful.
When you hover over it says install. It is the button right next to the bookmark. I don't know if this is an experimental feature since I'm on chrome canary. But I still want to implement it into my website. Is it possible to do it with java script?
I believe it is a Progressive Web App and Chrome is testing the plus button UI for the add to homescreen behaviour.
To do this for your website you'd need a web app manifest and a service worker. See here for more info.

Opening a desktop shortcut on IOS (ipad) via JS

thanks in advance for any help.
I am wanting to know if anyone has tried or if it is possible to open a desktop shortcut on an ipad from within another app on the Ipad.
To elaborate I use an app called ServiceM8 of which I can use JS to create an add on. My addon is a webapp and I simply want to open the webapp. I can open it as a url in a new safari window however this doesn't allow me to hide the address bar.
By making the webapp a shortcut on the device I can remove that address bar which is much better for user experience and which is why I want to open the shortcut rather than have serviceM8 open it in safari.
I hope this makes sense and someone can shed some advice.
I have searched the forum and couldn't even find one case that related to the question I am asking.
A web app is essentially just a URL. It isn't a fully-fledged app and can't register a custom URL scheme. This means that it is not possible to launch it from another app or web site; the URL will just be handle directly by the default application that handles http(s) urls, which is Safari.

Detect apple's forced phantom banner in JavaScript

I'm not an iOS developer, and know little less about Safari's configuration by apple.
But Please, hear me out.
I have universal links configured, and I understand that if the App is installed, visiting the website with Safari browser will automatically show a phantom banner to open the page in the app. This seems one of the policies apple included in their Universal Link settings.
Image below shows an example of the Phantom banner
My question is: How can I detect the presence of this Apple's Phantom banner through JavaScript?
To be precise, currently, there is no way to detect the Phantom banner if the universal link is enabled in safari.
You cannot remove it through JS also it has no presence in the DOM.
Try integrating a 3rd party plugin like Firebase or Branch.
I tried firebase hoping it can resolve the issue and below is a summary.
It will create a dynamic link to your webpage which is nothing but a wrapper on your deep link.
But with that you will lose the ability to click on your webpage link and open the App, instead, you will have to use the dynamic link to open the App.
The Dynamic link can be on your domain or on a custom domain.
Here is some more information on domain configuration
https://firebase.google.com/docs/dynamic-links/custom-domains
In my case, the ask was to link directly to the website link so this did not help much. But if the ask is to open the App on a link click then it can help as the Apple App Association file will not be on your domain and you will not see the phantom banner.

Save site as a mobile shortcut android

I spent a lot of time to search for solution but without result.
I check this topics :
Website Bookmark/ Shortcut Icon for Android Help. Cant get passed standard ribbon icon
Whick is very nice ,but here user must click on bookmark.That`s not what i need. May be button,or automatic script that prompt user for this and created automaticaly.For example something like this :
http://socialmedia.biz/2012/02/21/encourage-visitors-to-save-your-site-as-a-mobile-shortcut/
But it`s work only on Apple devices .. What im looking for is a similar solution for android.
Is this possible at all?
May be the only solution is to create simple app that act like a shortcut to my web page?
The page that is talking about has a mobile version ..
Have you looked here [for Chrome]? https://developers.google.com/chrome/mobile/docs/installtohomescreen
May be the only solution is to create simple app that act like a shortcut to my web page? The page that is talking about has a mobile version ..
If this is "allowed" and doesn't go against too many guidelines, this might be your only option. Basically you'd want to create a one Activity application and all it does is call the default Intent for your web page. This should push the user into the default Browser.
You could put the app in the Google Play store and link to it from the site or a script. I'd call the app something like "SITE_NAME Web Shortcut" and make it clear in the description that the only purpose is to launch the browser -- as previously mentioned this doesnt "feel" like something that should be in an app store, and if users think they're getting something extra you'll definitely get bad reviews.
(I'd also make the Activity with #style/Theme.Transparent)
Please be aware that Chrome has changed the way that installs web apps.
Here are the details: https://developers.google.com/web/updates/2018/06/a2hs-updates
There is an install criteria now:
The web app is not already installed
Meets a user engagement heuristic
Be served over HTTPS
Includes a Web App Manifest that includes:
short_name or name
icons - must include a 192px and a 512px icon
start_url
display - must be one of fullscreen, standalone, or minimal-ui
prefer_related_applications must not be present, or be false
-Registers a service worker with a fetch handler

Categories

Resources