Force PWA notification to show only in Chrome for Mobile? - service-worker

I have PWA notification that asks user to "Add to homescreen". However, it shows up in Chrome for both Desktop and Mobile. I would like to show this notification only if user view my website from mobile. Is this possible?

Yes, you can achieve this programmatically. You can listen for beforeinstallprompt event and only show the install prompt for whatever users you would like to target.
https://developers.google.com/web/fundamentals/app-install-banners/

Related

How does iphone Notifications on Websites works? Is need to install Application?

I have problem with understand how "Push Notifications on Websites" works on Iphone, Ipad, etc.
Default Browser Notifications don't work on mobile, but this: https://developer.apple.com/library/content/documentation/NetworkingInternet/Conceptual/NotificationProgrammingGuideForWebsites/Introduction/Introduction.html
should be work fine!
There is good documentation how to install it, but how it works on user?
As i see, it`s 2 variants:
1) Modal Window to allow using notifications in browser like it`s working with default JS Notifications.
or:
2) Link to install application in AppStore. So, user install to device application.
So, if user download application, does this application add to desktop on device as other applications? What happing when user click on icon? Does click on application on desktop activate safari and open web-site? Or is it hidden application without icons on desktop?
I try to find some sites to check examples how it will work with my iphone, but i didnt find any sites. All popular sites say: "download application and active notifications THERE and use application for website".
So, i don't need special application for my site, adaptive design is awesome for me, but i want to use notifications on iphone!
Please, help me :) Thank you!
As you noticed the document states that this feature is available on OSX not on iPad, iPhone.
We see this notifications when we open a website on Safari. For instance,
As soon as we click the allow button, our Macbook communicates with Apple Push Notification Service to establish a persistent IP connection (along with a token exchange). When the website servers send notifications to the Apple Push Notification Service it forwards that notification to our Macbook/iMac.

SignIn / Consent Window does not close on mobile

I have a web app eg www.webapp.com that uses Hello.js to sign in users. It works from the desktop and mobile devices as long as I use the browser to navigate to the site.
PROBLEM: I can install it to the device (eg "Add to Homescreen" on Android or iOS). But when I run it from the homescreen, the authentication/consent screen gets stuck on a blank page and a "connecting" message. My manifest.json file has display: standalone
I have to manually close the popup, and use the "Back" button on the phone to get back to the login screen. The response token etc. are there as expected. Why is the popup screen not closing? How can it be forced to close without user intervention?
Is there anything that can be done to make it work with HTML5 "installed" apps?

Phonegap how to come back to app screen and exit from app iOS

I am creating a phonegap application that posts the login information to my website. When user signs off I want to come back to my app. Do I just send the url location along with the post data so that I can come back? or there is another elegant way?
Also when user clicks on the iphone home button, I want the application to exit. Currently it just saves the session and the page and goes back directly to the page if I start the application again.
I am using adobe phonegap site to build and test the application
From your description, I assume that you are navigating the Phonegap WebView (which is running your app) to the URL of your website?
If so, at this point you no longer have an app to navigate back to - the WebView has lost its handle on your app. In order to "navigate back" to your app, you should use the InAppBrowser plugin to navigate to your website. This will allow you to return to your app after the user logs out from your website. You'll need to somehow communicate the logout from your website in the InAppBrowser WebView to your app in its WebView. You may be able to achieve this with cross window messaging.
You can't "exit" an app in iOS - the OS does not allow you to do this. The best you can do is use the resume event to detect when your app has been restored from the background, then manually reset your app to its initial state.

From the iOS chrome app to my app and back chrome on the same tab

The flow I am trying to do here is as follows:
user visits a page in my webapp with the chrome iOS app
user clicks a login link which starts a session and shows a link with an url scheme my iOS app can handle
user clicks that link and my iOS app opens up
my iOS app does it thing ( it authenticates the user )
when finished, I would like to be able to get the user back to the chrome iOS app on the same tab he started from. This tab is polling my server every x seconds to see if my iOS app has finished.
Is this possible? I can open up the chrome app easily just by using the googlechromes url scheme but this opens up a new tab. I need the user to land on the same tab
Similary for the safari app, I can get the same behaviour by using the https url scheme to open up safari.
Ok it seems it is not possible as explained here: Open safari in same tab from iPhone application
I guess it makes sense not allowing this, so other apps cannot manipulate your current open tabs.

Tracking HTML5 Web App installs on iOS devices

We recently launched an HTML5 Web App (using JQuery Mobile), which has a slide down box encouraging users to bookmark the Web App on their home screens. Users can do this from Safari by clicking Bookmark and then "Add to Home Screen". Any thoughts on how we might be able to track the number of "installs". I don't believe we can add any tracking to the native iOS bookmarking behavior from within the HTML5 Web app.
Thanks
I'm not sure you can get an event whenever the user installs the web app on their homescreen. However, you can know if the user is in 'full screen' / 'web app' mode by checking the window.navigator.standalone property in Javascript. So you might be able to do a call to your statistics provider and provide them the standalone property as well.
You can at least detect whether the app is launched from the homescreen or via browser via the window.navigator.standalone flag. You could use it in combination with cookies or localstorage to ensure you count unique installs in your backend.
You can also try to store the result of window.navigator.standalone into Google Analytics

Resources