How to create Progressive web app apk/any type of file that can be distributed in a enterprise devices - google-chrome

Understandably, PWAs (Progressive Web Apps) are added to home screen after the user visits the web app in a supported browser and clicks on "Add to Home Screen". This works fine for publicly available PWAs.
Thinking of Enterprise Android applications, which needs to be installed to thousands of devices via some app push tools like Airwatch, its practically not possible to have someone open the browser, put the URL and then add to home screen in all thousands of devices.
Is there any other way to automate this deploy/add icon to home screen of a Progressive Web App, not needing the user to visit the web app in a browser, and clicking on "Add to Home Screen" ?
One option we thought about is wrapping in Cordova, but we're trying to find a solution without such wrapper.

Chrome for Android generates and signs .apk file on the fly using WebPack, when the user clicks on "Add to Home screen" (from menu or install banner) option and if the site has a valid manifest.json and service worker.
Extracting and distributing APK: This .apk can be located and exported to desktop using file explorer tools. For some reason, some of default file explorer tools couldn't locate this .apk file. Once exported, this .apk can be used to distribute in controlled environment..like in enterprise devices, where you can enforce the deceive to have Chrome Browser. If this .apk is installed to devices which don't have Chrome browser, user will get a message saying "Chrome" is required to open this app. Once installed, installed PWA apk can be used.
For distributing PWA apps through Play store, google is streamlining the process. A google engineers repose on building APKs (March-2018), when we reached out to them for our enterprise needs.
"Well done extracting the APK and deploying it, it should give a good experience to end users, but I agree it shouldn't be that complicated to deploy web apps on Android.
We are currently working on a streamlined web apps feature, with which you wouldn't need to manipulate or build APKs. This feature will be available on managed devices using Play to deliver apps"
Alternate options: If you think your user base may not have Chrome or don't want to rely on that dependency, wrapping with Cordova kind of hybrid solution is the only way to build your PWA apps for distribution in app stores. With this option, if the "webpack" in the device has the version 40+, user will get PWA benefits. Otherwise, it will still work as a regular hosted web app.
Update on TWA - Trusted web activity is the official way to pack PWA for Android and its available in Chrome 72 and it also supports private/enterprise web apps as the digital assets validation happens in browser now(it use to happen in cloud, making this solution not possible for private web apps).

You can upload the PWA to Playstore using tools like PWA2APK. Just need to share the play store URL to the users, from which they can download PWA app like normal Android App.

Trusted Web activities are a new way to integrate your web-app content such as your PWA with your Android app using a similar protocol to Chrome Custom Tabs.
Trusted Web activities

Related

Facebook mbasic site, mobile safari, home screen shortcuts and local storage

I have a question about the mbasic.facebook.com page and how they manage to do what they do on iPhone with iOS 12.3.1. This is not about the facebook app. I don't have it installed at all.
I went to mbasic.facebook.com in mobile safari on iOS and created a shortcut for it on my homescreen. When I use the shortcut, the page behaves like what Apple calls a web application, i.e. it does not have the usual mobile safari UI.
Here's the weird part:
After using the shortcut and logging in, I switch to the settings app and under "Safari", I delete the browser history and website data.
I then use the shortcut again to launch the mbasic facebook site.
I am greeted with a screen where I still appear to be logged in. If i interact with the page it will make me login again, however.
This makes me wonder about two things:
How does the web application maintain its state (i.e. still know who am i) despite me trying to delete the Safari data?
How do I delete the data in a way that also affects a "web app" launched via a home screen shortcut?
I am not sure exactly. But I think it was done by PWA(Progressive Web App) technology. It helps you to use a website as an app that are installed from app store. And it also has the ability of state maintaining, giving push notification, maintain own storage in your device. When you installed it, all your login information was saved in your device as its own storage and this storage has no relation with your web browser. That;s why when you delete data from Safari, it made no effects on the installed one. And when you installed it, it installed its own manifest file in your device. That's why it runs on your device with it's own UI not with the safari UI. You can delete its data by deleting its storage folder that is created at the time of installation. I am not sure where you got the file in your device. Make a research on it. Here are some useful link about PWA. MDN web docs - PWA 4 important points to know about Progressive Web Apps (PWA) PWA Tutorial Hope it will help you. You are requested to share any new thing that should be known as I am new in this technology.

Trusted web activity - Digital assets link validation for intranet/private web app seem to be failing

I've followed this doc to
Create a wrapper Android app based on this sample project for my UI application which runs in non-public domain in our corporate servers.
Add assetlinks.json in my Angular 6 PWA application, with SHA256 fingerprints of my release key.
Deployed the signed apk to a Android 4.4.3 device running Chrome Dev 69 and Google play services - 12.8.74.
When I run the application, everything works fine except hiding the address bar, which makes it as a regular custom tab and not the "Trusted web" content.
I don't see any error in the log and not sure how to debug this scenario. Any help on this is appreciated.
Got confirmation from Chrome team that they are using TWA assets link validation in server side using an API call and so this solution wont work for Private web apps. Said that, they are also considering to move that logic to browser to support this use case. Will update here when I have any update on this.
Update: As of Chrome Version 72, TWA(Trusted web activity) if available in Chrome stable version and the web asset validation(to make sure the web page is yours/same as the app its loaded to) happens in browser. So this solution can be implemented for private web apps for hosting inside enterprise environment.
Also, now PWAs can be packed as regular app using TWA solution and uploaded to Play store as an apk file. Documentation on this is still being updated as per one of Chrome developer. But the solution as such is ready for use.

Full Website Within Chrome Application Window

Was wondering if I had a web-application on www.mydomain.com/userportal etc but didn't want this accessable via the browser, but as a chrome application similar to how Google's Hangouts is a seperate window / popup - How easy is it to implement an already built application into one of these windows?
If I understand you correctly, you would like to display your www site as a Chrome App. Chrome apps are all HTML/CSS/JS files hosted on the computer but they can display a webview into a site online. However, Chrome Apps must be 'offline' first. So you must ask for permissions to all online activity.
Ideally you would make separate app hosted as a Chrome App (not link/embedded to a www site) that uses an API to talk to a web-app.
Keep in mind that Google is phasing out Chrome Apps for all platforms except Chrome OS in the near future.

Chome Bluetooth API in Extension (not app!)

I am trying to build an extension that interacts with certain webpages. While browsing on those webpages i need to connect to a smartphone app via Bluetooth if the user wants to run a certain function of the extension.
AFAIK Chrome extension can interact with websites while Chrome apps are like stand alone programs. But the Bluetooth API is only available to apps?
So is there any way to do this? Can I for example have a hybrid of an extension and an app? (e.g. by using the same background script to communicate)
You can use an extension AND an app that talk to each other with external messages. A message from an extension will wake up the app's event page even if it's unloaded. It will be up to the user to install both at the same time, though.
Alternatively, you can embed a browser page in your app via the <webview> tag. In this case you can communicate with the embedded page, but you can't do it while user browses normally.

Assign tray icon to Google Chrome web application

I need to create a web application which will be stored in the traybar of Windows, this to prevent users from accidentally close my application (without the need of a pre-close alert message).
I thought that Google Chrome's background apps could be the right way to go, mostly because I don't need cross-browser compatibility and I have to choose which browser my users will use to run this web application.
The only problem is that I don't understand if I can achieve what I need with this feature.
I've found only this example of background app in Chrome countdown app
But this app uses the "background page" feature, that is different from what I'm looking for.
How can I let a Chrome app be minimized in the traybar (or even in the taskbar would be ok) instead of be closed?
Try to use node-webkit (chromium + node.js) for it: https://github.com/rogerwang/node-webkit
It allow to create any web-app and it support tray icons: https://github.com/rogerwang/node-webkit/wiki/Tray
You can download my windows example app here: https://mega.co.nz/#!xQMzgbxD!S58G-V23QLNRDFC10xso41-T2V8OZQVsQEH-lr46R3s
If you want exactly chrome, try this NPAPI plugin example: http://minimizetotray.googlecode.com/files/SourceCode.zip from http://habrahabr.ru/post/73003/
Unfortunately, I don't think you will be able to achieve exactly what you're after. You might be able to combine the two solutions below to nearly achieve your requirements. However, I don't think the type of control you are after is available via Google Apps.
Google App Launcher
The Google App Launcher would fulfill the "stored in the traybar of Windows" requirement.
The Chrome App Launcher is the hub of all your Chrome apps and with it
you have quick access to all of your apps from the desktop. When you
install an app from the "For Your Desktop" collection of the Chrome
Web Store, you get the App Launcher. The App Launcher requires you to
sign in to Chrome to enable apps that need access to your Google
account.
Manage apps
When you download a new app that enables App Launcher, the apps from
your Apps bookmark on Chrome New Tab page will also appear in the App
Launcher. Managing apps in the App Launcher is simple.
Add more apps: Click the Chrome Web Store button in your apps list and explore the apps in the store.
...
Background: Extending Your App's Life
You mentioned background apps in your question but I would recommend you explore it further. It essentially provides the "prevent users from accidentally close my application" requirement that you stated. This isn't foolproof (see bold sentence below) but it is about as close to the requirement I think you will be able to achieve.
As of Google Chrome 10, the background feature lets a hosted app run
as soon as the user logs into their computer—before the user launches
Chrome or the app—and to continue running even when Chrome or the app
has no visible windows. However, if the user explicitly quits Chrome,
the browser and app both exit.