Example: Google Maps as a Progressive Web App (PWA) on IGEL OS 12

This article describes setting up a generic Progressive Web App (PWA) on IGEL OS 12. We will use Google Maps as an example; for other web apps, the procedure is similar.

Basically, a PWA is a Chromium window with a specific profile in the so-called app mode. All policies that are defined for Chromium are also valid for the PWAs. However, most PWAs have the Clear data setting. But note that the Clear browsing data options configured for Chromium under Chromium Browser > Global Settings > Privacy still overrule every Chromium browser window, including PWAs (exception: MS Teams PWA).

Prerequisites

• Device with IGEL OS 12.

• The app “Progressive Web App” is imported to your UMS. For details on app import, see How to Import IGEL OS Apps from the IGEL App Portal.
  

  

• You know the manifest_id of your Progressive Web App. You can retrieve it by installing the PWA on any device, no matter which OS, by entering chrome://web-app-internals in the browser and scrolling to the entry manifest_id of the app in question. For this purpose, you can use Chrome, Chromium, Edge, or any other Chrome-based web browser; you may have to replace chrome with the actual browser name, e.g.edge://web-app-internals. Please note that Progressive Web Apps on IGEL OS always use Chromium.
  

Click for examples of the manifest_id...

Limitations

• Avoid configuring any installed standalone PWA as generic PWA because it can lead to unwanted behavior.

• If you have already apps installed as generic PWA, they will be shortly unavailable during the installation of a new generic PWA.

Global Setting for All Progressive Web Apps: Clear Data

You can define whether all profile-related data of a Progressive Web App (e.g. login credentials, cookies) should be removed each time the app is closed or the user logs out from the device or restarts it. This will influence all apps installed as a generic PWA.

→ In the profile configurator, go to Apps > Progressive Web App > Global and enable Clear data.

If you need to activate Clear data setting for the PWA app and/or for Chromium browser, it is recommended to enable it only after the app installation is complete (see the below instructions “Completing the Installation”). Otherwise, the app icon can be displayed incorrectly even after performing the required user actions and the device reboot. This is because the PWA requires user data (resulting from login, consent, accepting cookies etc.) to fully complete the installation and to correctly display the app icon.

Creating a Session

1. In the IGEL UMS, create a profile configuring the app. For details on profile creation, see How to Create and Assign Profiles in the IGEL UMS Web App.
   

2. In the profile configurator, go to Apps > Progressive Web App > Sessions and add a new session.
   

   

   
   

3. Enter a Session name, for instance, “Google Maps”.
   

   

4. Go to Settings and enter the Progressive Web App Url. This is the manifest_id you discovered via chrome://web-app-internals. For Google Maps, the correct value is https://www.google.com/maps?force=tt&source=ttpwa
   

   

5. Optional: If you want to use an alternative icon, enter the path to the image file under Progressive Web App Icon (optional). This will override any auto-detected icons coming from the PWA itself.
   For how to add files, see Upload and Assign Files in the IGEL UMS Web App.
   

   

   
   

6. Save the profile and assign it to the required devices / device directories. For details on profile assignment, see How to Create and Assign Profiles in the IGEL UMS Web App.
   
   On the device, a message window informs the user that the Progressive Web App is being installed. Note that the user has to be logged in to the device for this step.
   

   

   
   

Completing the Installation

1. After the app download is complete, reboot the device.
   

   

   
   

2. To complete the installation so that the app icon is displayed correctly, some user action is required: Open the app and resolve the cookie consent dialog / accept the terms of use / log in / etc.
   For Google Maps app, resolving the cookie consent dialog is usually enough for completing the installation.

   

3. Reboot the device.

   The app icon is now displayed correctly. The app installation process is completed, and the app can be used.

   

   
   

If not all PWAs have been properly installed (e.g. required user actions have not yet been performed), the installation process of Progressive Web App will automatically start in the background after each reboot.

The installation process is finished as soon as no icon is grey.

Troubleshooting: Reinstalling the App if Something Went Wrong

If the Progressive Web App does not work as expected, e.g. the starter icon does not appear, it is recommended to reinstall it.

To reinstall a PWA:

1. Start the PWA (or any other PWA).
   

2. While the PWA window is open, remove the session.

   

3. Wait for about 1 minute.
   

4. Install the PWA again as described above under “Creating a Session” and “Completing the Installation”.