Skip to content

GitLab

T
tangled
Commit 21f2a773 authored by Margaret Mary Kearney's avatar Margaret Mary Kearney Committed by Anthony LaForge
Browse files
Options

Updating the Chrome Apps migration guide 

The new version has information about progressive web apps.
It also has details about migrating specific APIs.

Change-Id: I8ee02283cd8fcc859bce221a53c408aac0596e52
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1935235Reviewed-by: default avatarMeggin Kearney <mkearney@chromium.org>
Reviewed-by: default avatarAnthony LaForge <laforge@chromium.org>
Auto-Submit: Meggin Kearney <mkearney@chromium.org>
Commit-Queue: Anthony LaForge <laforge@chromium.org>
Cr-Commit-Position: refs/heads/master@{#720639}
parent 7b934485
Hide whitespace changes
Inline Side-by-side
Showing with 640 additions and 231 deletions
chrome/common/extensions/docs/templates/articles/migration.html
View file @ 21f2a773
<h1>Transitioning from Chrome apps on Windows, Mac, and Linux</h1>
<p>Chrome packaged and hosted apps will be discontinued on Windows, Mac,
and Linux over the course of now and early 2018.
For more information, refer to the August 2016
<a href="https://blog.chromium.org/2016/08/from-chrome-apps-to-web.html">Chromium blog post</a>.
This transition does not apply to Chrome OS,
where Chrome packaged and hosted apps will remain supported and maintained for the foreseeable future.</p>
<p>To transition away from a Chrome packaged or hosted app on Windows, Mac, and Linux,
the following options are available. <p>
<h2 id="apps">Chrome packaged apps</h2>
<p>Recommended migration options for packaged apps are listed
in order from simplest to most complicated.</p>
<h3 id="build-app">Build a web app</h3>
<p>Building a web app on top of the web platform is the ideal way
to reach users across platforms.</p>
<p>We are investigating ways to improve the migration path to the web for developers that depend on exclusive Chrome App APIs
- in particular the Sockets, HID, fileSystem and Serial APIs.
If there are web platform features you need that are only available in select browsers,
you can use feature detection to gracefully degrade or include explanatory text
when your app is run in a browser that doesn’t support a particular API.
If there are gaps in the web platform for your application, please
<a href="https://docs.google.com/a/google.com/forms/d/e/1FAIpQLSenHdpA8_eqKiVOrWDjWe_KTfJmoSBEqFIh6SMwQ-NRDJnx1Q/viewform?c=0&w=1">let us know</a>.<p/>
<p>An experimental tool that can help migrate simple Chrome Apps to
<a href="https://developers.google.com/web/progressive-web-apps/">Progressive Web Apps</a>
is <a href="https://github.com/chromium/caterpillar">Caterpillar</a>.
This tool can insert JavaScript to substitute Chrome Apps APIs you might be using.
It is currently limited to handling only certain types of apps.
In particular,
apps that contain processing in background pages will not be converted.</p>
<p>In the future,
Progressive Web Apps (PWAs) will become installable on desktop platforms.
Users will be able to install web apps to the desktop
and launch them via icons and shortcuts,
similar to the way that Chrome Apps can be installed today.
This functionality is expected to launch sometime during 2018.</p>
<h3 id="extension-web-page">Build an extension-enhanced web page</h3>
<p>If there is a capability that your Chrome App has
that the regular web platform can’t provide, it might be available as an
<a href="https://developer.chrome.com/extensions/api_index">extension API</a>.
In this case, you can continue using a
<a href="https://developer.chrome.com/extensions/messaging#external-webpage">regular web app together with an externally connectable extension your web app can send messages to</a>.
Building a web app is typically preferable to this,
because this approach forces users to install an extension
that is only useful on your site and can cause increased friction.</p>
<p>As Chrome extensions can’t be run on other browsers,
you should detect when required functionality isn’t available and
provide explanatory text for users on these other browsers.</p>
<h3 id="extension">Build an extension</h3>
<p>Depending on the user experience you want to provide,
it might make sense to convert your app over to an extension.
For example you could provide a
<a href="https://developer.chrome.com/extensions/browserAction">browser action</a>
button which shows a small popup window for your user interface,
or navigates to a page your extension provides.
For some apps,
this might be a good enough user experience to be a viable solution.</p>
<p>Note there are significant costs to this approach.
Users that do not use Chrome will not be supported,
and there will be significant friction for your users to install your extension.</p>
<h2 id="app-faqs">FAQs</h2>
<h3 id="users"><strong>Q: My Chrome App has many users.
What’s the best way to migrate them to my new web app and
deprecate my Chrome App?</strong></h3>
<p>You will still be able to publish updates to your Chrome App
until the runtime is removed in early 2018.
We recommend updating your app to include a message indicating
that your app has been discontinued,
and that users should visit your website going forward (see example below).
You can also include an “uninstall” button that calls the
<a href="https://developer.chrome.com/extensions/management#method-uninstallSelf">uninstallSelf function</a>.</p>
<img src="{{static}}/images/photo.png" width="598" height="468" alt="Uninstall message."/>
<h3 id="launcher"><strong>Q: I want to continue to have a UI affordance
that enables users to launch my app from the taskbar/dock/app shelf.
What should I do?</strong></h3>
<p>This is still possible with web apps, but it is up to the user.
On all desktop platforms except Mac, users can
<a href="https://support.google.com/chrome_webstore/answer/3060053?hl=en">add ‘bookmark apps’ to their shelf / desktop</a>,
which optionally run your web app in its own window.</p>
<p>In the future,
Progressive Web Apps (PWAs) will become installable on desktop platforms.
Users will be able to install web apps to the desktop and launch them via icons and shortcuts, similar to the way that Chrome Apps can be installed today.
This functionality is expected to launch sometime during 2018.</p>
<h3 id="window"><strong>Q: I want my app to run in its own window, not in a tab.
Is this something I can do with a web app?</strong></h3>
<p>Yes, but it is up to the user. On desktop platforms other than OS X,
users can add ‘bookmark apps’ to their shelf / desktop,
which optionally run your web app in its own window.</p>
<h3 id="shortcuts"><strong>Q: My app supports keyboard shortcuts.
Can the web support this also?</strong></h3>
<p>Web apps can support keyboard shortcuts by listening to the various key events
(e.g. <a href="https://developer.mozilla.org/en-US/docs/Web/Events/keydown">keydown</a>),
but the shortcuts you can support are limited. For example,
you cannot intercept Ctrl+N, Ctrl+T etc. as these are used by the browser.
Or, these might be shortcuts that are handled by the operating system
(e.g. Alt+Tab on Windows).</p>
<p>Work <a href="https://github.com/jondahlke/system-keyboard-lock/">has begun</a>
to allow developers to intercept these additional shortcuts on the web,
but this is not yet ready for use.</p>
<p>The <a href="https://developer.chrome.com/extensions/commands">Extension Commands API</a>
supports richer keyboard shortcuts which operate across the entire browser,
which may enable new capabilities if transitioning to an extension is possible.</p>
<h3 id="offline"><strong>Q: My app needs to run when the user is offline.
Can I do that with a web app?</strong></h3>
<p>Yes,
you can <a href="https://developers.google.com/web/fundamentals/getting-started/your-first-offline-web-app/">use service workers to make your site run offline</a>.</p>
<h3 id="gcm"><strong>Q: My app uses the chrome.gcm API to receive push messages
from the cloud. Can the open web do that?</strong></h3>
<p>Yes, the
<a href="https://developers.google.com/web/fundamentals/engage-and-retain/push-notifications/">Push API and Notifications API</a>
provide the ability to show your user push notifications even when the page is closed.</p>
<h3 id="show"><strong>Q: My app needs to be able to show notifications
to the user even when it has no windows open. Can I do that with the open web?</strong></h3>
<h1>Transitioning from Chrome Apps</h1>
<p>To transition away from a Chrome packaged or hosted app, the following
options are available.</p>
<h2 id="chrome-packaged-apps">Chrome packaged apps</h2>
<p>Recommended migration options for packaged apps are listed in order from
simplest to most complicated.</p>
<h3 id="build-pwa">Build a Progressive Web App</h3>
<p>Building a <a
href="https://developers.google.com/web/progressive-web-apps/">Progressive Web
App</a> (PWA) is the ideal way to reach users across all operating systems.<br>
As part of our <a
href="https://developers.google.com/web/updates/capabilities">Web
Capabilities</a> (codename: <a
href="https://www.chromium.org/teams/web-capabilities-fugu">Fugu</a>)
efforts, we are investigating ways to improve the migration path to the web for
developers that depend on exclusive Chrome App APIs—in particular the Sockets,
HID, File System, and Serial APIs. If there are web platform features you need
that are <a href="https://caniuse.com/">only available in select
browsers</a>, you can use feature detection to gracefully degrade or include
explanatory text when your app is run in a browser that doesn't support a
particular API. If there are gaps in the web platform for your application,
please <strong><a
href="https://bugs.chromium.org/p/chromium/issues/entry?summary=Fugu+Request:++Add+your+feature+title&comment&labels=Type-Feature,Pri-3,Proj-Fugu">let
us know</strong></a>.
</p>
<p>
PWAs are installable on both <a
href="https://developers.google.com/web/progressive-web-apps/desktop">desktop</a>
and <a
href="https://developers.google.com/web/fundamentals/app-install-banners/">mobile</a>
platforms. Users who choose to install your PWA can launch it via icons and
shortcuts, similar to the way that Chrome Apps can be installed today.</p>
</p>
<h3 id="build-extension-web-page">Build an extension-enhanced web page</h3>
<p>If there is a capability that your Chrome App has that the regular web
platform can't provide, it might be available as an <strong><a
href="https://developer.chrome.com/extensions/api_index">extension
API</strong></a>. In this case, you use a <strong><a
href="https://developer.chrome.com/extensions/messaging#external-webpage">progressive
web app together with an externally connectable extension your web app can send
messages to</strong></a>. Building a web app is typically preferable to
this, because this approach forces users to install an extension that is only
useful on your site and can cause increased friction.
</p>
<p>
As Chrome extensions can't be run on other browsers, you should detect when
required functionality isn't available and provide explanatory text for users on
these other browsers.
</p>
<h3 id="build-extension">Build an extension</h3>
<p>Depending on the user experience you want to provide, it might make sense to
convert your entire app into an extension. For example you could provide a
<strong><a
href="https://developer.chrome.com/extensions/browserAction">browser
action</strong></a> button which shows a small popup window for your user
interface, or navigates to a page your extension provides. For some apps, this
might be a good enough user experience to be a viable solution.
</p>
<p>
Note there are significant costs to this approach. <a
href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension">While
some browsers</a> support the same extensions API as Chrome, this support is
not universal. This can significant friction for your users who would prefer a
cross-browser alternative.</p>
<h3 id="build-chromeos-android">Build for Chrome OS via Android</h3>
<p>If you are an Android developer interested in building for Chrome OS, you can
optimize your Android application for a better experience.</p>
<p>Chrome App API/Capability migration recommendations (current as of Nov.
2019):</p>
<table>
<thead>
<tr>
<th><strong>Chrome App feature/functionality</strong></th>
<th><strong>Web platform migration recommendations</strong></th>
<th><strong>Android migration recommendations</strong></th>
<th><strong>Extension migration recommendations</strong></th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://developer.chrome.com/apps/accessibilityFeatures">chrome.accessibilityFeatures</a></td>
<td></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/accessibilityFeatures">chrome.accessibilityFeatures</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/alarms">chrome.alarms</a></td>
<td><a href="http://crbug.com/891339">Notification Triggers</a></td>
<td><a href="https://developer.android.com/topic/libraries/architecture/workmanager">WorkManager</a></td>
<td><a href="https://developer.chrome.com/extensions/alarms">chrome.alarms</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/app_runtime">chrome.app.runtime</a></td>
<td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=844279">Launch
Event</a></td>
<td><a href="https://developer.android.com/guide/components/activities/activity-lifecycle">Activity
Lifecycle</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/app_runtime#event-onRestarted">chrome.app.runtime.onRestarted</a></td>
<td><a href="https://developers.google.com/web/updates/2018/07/page-lifecycle-api">Page Life Cycle</a></td>
<td><a href="https://developer.android.com/guide/components/activities/activity-lifecycle#onresume">Activity.onResume</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/app_window">chrome.app.window</a></td>
<td><a href="https://crbug.com/897300">Window Placement / Screen Enumeration</a></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/windows">chrome.windows</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/audio">chrome.audio</a></td>
<td><a href="http://crbug.com/897326">Audio Device Client</a></td>
<td><a href="https://developer.android.com/guide/topics/media/mediaplayer">Some
Audio APIs</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/app_bluetooth">chrome.bluetooth</a></td>
<td><a href="https://www.chromestatus.com/feature/5264933985976320">Web Bluetooth API</a></td>
<td><a href="https://developer.android.com/guide/topics/connectivity/bluetooth">Bluetooth API</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/bluetoothLowEnergy">chrome.bluetoothLowEnergy</a></td>
<td><a href="https://www.chromestatus.com/feature/5264933985976320">Web Bluetooth API</a></td>
<td><a href="https://developer.android.com/guide/topics/connectivity/bluetooth-le">BTLE</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/bluetoothSocket">chrome.bluetoothSocket</a></td>
<td><a href="https://www.chromestatus.com/feature/5264933985976320">Web Bluetooth API</a></td>
<td><a href="https://developer.android.com/reference/android/bluetooth/BluetoothSocket">Bluetooth Socket</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/browser">chrome.browser</a></td>
<td><a href="https://developer.mozilla.org/en-US/docs/Web/API/Window/open">window.open</a></td>
<td><a href="https://developer.android.com/reference/android/content/Intent">Intent
system</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/commands">chrome.commands</a></td>
<td><a href="https://w3c.github.io/uievents/">UI Events</a></td>
<td><a href="https://developer.android.com/training/keyboard-input/commands">Hard-code
keyboard commands</a></td>
<td><a href="https://developer.chrome.com/extensions/commands">chrome.commands</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/contextMenus">chrome.contextMenus</a></td>
<td>(HTML/script)</td>
<td><a href="https://developer.android.com/reference/android/view/ContextMenu">Native,
Android has its own contextmenus</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/documentScan">chrome.documentScan</a></td>
<td></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/documentScan">chrome.documentScan</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/events">chrome.events</a></td>
<td><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=891339">Alarms</a></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/events">chrome.events</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/extensionTypes">chrome.extensionTypes</a></td>
<td></td>
<td>N/A</td>
<td><a href="https://developer.chrome.com/extensions/extensionTypes">chrome.extensionTypes</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/fileSystem">chrome.fileSystem</a></td>
<td><a href="http://crbug.com/853326">Native FileSystem API</a></td>
<td></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/fileSystemProvider">chrome.fileSystemProvider</a></td>
<td></td>
<td><a href="https://developer.android.com/reference/java/nio/file/spi/FileSystemProvider.html">FileSystemProvider</a></td>
<td><a href="https://developer.chrome.com/extensions/fileSystemProvider">chrome.fileSystemProvider</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/gcm">chrome.gcm</a></td>
<td><a href="https://developers.google.com/web/fundamentals/push-notifications/">Web
Push Notifications</a></td>
<td>N/A</td>
<td><a href="https://developer.chrome.com/extensions/gcm">chrome.gcm</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/hid">chrome.hid</a></td>
<td><a href="https://www.chromestatus.com/feature/5172464636133376">Web HID API</a></td>
<td></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/i18n">chrome.i18n</a></td>
<td>(HTML/script)</td>
<td><a href="https://developer.android.com/guide/topics/resources/localization">Localization</a></td>
<td><a href="https://developer.chrome.com/extensions/i18n">chrome.i18n</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/identity">chrome.identity</a></td>
<td>OAuth API or <a href="https://www.chromestatus.com/feature/5669923372138496">Credential Management API</a></td>
<td><a href="https://developer.android.com/training/id-auth/authenticate">Native</a></td>
<td><a href="https://developer.chrome.com/extensions/identity">chrome.identity</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/idle">chrome.idle</a></td>
<td><a href="http://crbug.com/878979">User Idle Detection API</a></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/idle">chrome.idle</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/instanceID">chrome.instanceID</a></td>
<td><a href="https://developers.google.com/web/fundamentals/push-notifications/">Web
push</a></td>
<td>Per-App ID needs to be self-generated</td>
<td><a href="https://developer.chrome.com/extensions/instanceID">chrome.instanceID</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/mdns">chrome.mdns</a></td>
<td></td>
<td><a href="https://developer.android.com/training/connect-devices-wirelessly/nsd">NDS
discovery</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/mediaGalleries">chrome.mediaGalleries</a></td>
<td><a href="http://crbug.com/853326">Native FileSystem API</a></td>
<td></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/networking_onc">chrome.networking.onc</a></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/notifications">chrome.notifications</a></td>
<td><a href="https://www.chromestatus.com/feature/5064350557536256">Notifications API</a></td>
<td>Notifications show in lower right of CrOS as system level notifications</td>
<td><a href="https://developer.chrome.com/extensions/notifications">chrome.notifications</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/permissions">chrome.permissions</a></td>
<td><a href="https://developer.mozilla.org/en-US/docs/Web/API/Permissions_API">Web
Permissions API</a></td>
<td>N/A</td>
<td><a href="https://developer.chrome.com/extensions/permissions">chrome.permissions</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/power">chrome.power</a></td>
<td><a href="https://www.chromestatus.com/feature/4636879949398016">WakeLock API</a></td>
<td><a href="http://b/133417350">In discussion</a></td>
<td><a href="https://developer.chrome.com/extensions/power">chrome.power</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/printerProvider">chrome.printerProvider</a></td>
<td><a href="https://developer.chrome.com/extensions/printerProvider">Transition to Extension</a></td>
<td><a href="https://developer.android.com/reference/android/printservice/package-summary">android.printservice</a></td>
<td><a href="https://developer.chrome.com/extensions/printerProvider">chrome.printerProvider</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/runtime">chrome.runtime</a></td>
<td><a href="https://developers.google.com/web/updates/2018/07/page-lifecycle-api">Service Workers + Page Lifecycle API</a></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/runtime">chrome.runtime</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/messaging#connect">chrome.runtime.connect</a></td>
<td><a href="https://www.chromestatus.com/feature/6710044586409984">Channel Messaging API</a></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/runtime#method-connect">chrome.runtime.connect</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/messaging#simple">chrome.runtime.sendMessage</a></td>
<td></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/runtime#method-sendMessage">chrome.runtime.sendMessage</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/app_serial">chrome.serial</a></td>
<td><a href="https://www.chromestatus.com/feature/6577673212002304">Web Serial API</a></td>
<td></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/app_network">chrome.sockets.tcp</a></td>
<td><a href="https://w3c.github.io/webrtc-quic/cs.html">QuicTransport C/S (or WebSockets)</a></td>
<td><a href="https://developer.android.com/reference/java/net/Socket">android.net.ConnectivityManager and Java standard socket API</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/sockets_tcpServer">chrome.sockets.tcpServer</a></td>
<td></td>
<td><a href="https://developer.android.com/reference/java/net/Socket">android.net.ConnectivityManager and Java standard socket API</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/sockets_udp">chrome.sockets.udp</a></td>
<td><a href="https://w3c.github.io/webrtc-quic/cs.html">QuicTransport C/S</a></td>
<td><a href="https://developer.android.com/reference/java/net/DatagramSocket">DatagramSocket API for UDP</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/storage">chrome.storage</a></td>
<td>Cache API:<a href="https://www.chromestatus.com/feature/5072127703121920" >https://www.chromestatus.com/feature/5072127703121920</a></a><br>
IndexedDB:<a href="https://www.chromestatus.com/feature/6507459568992256">https://www.chromestatus.com/feature/6507459568992256</a></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/storage">chrome.storage</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/extensions/manifest/storage">chrome.storage.managed</a></td>
<td></td>
<td><a href="https://developer.android.com/work/managed-configurations">Managed
Configurations</a></td>
<td><a href="https://developer.chrome.com/extensions/storage#property-managed">chrome.storage.managed</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/syncFileSystem">chrome.syncFileSystem</a></td>
<td></td>
<td><a href="https://developers.google.com/drive/api/v3/quickstart/java">Java - Drive REST API</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developers.chrome.com/apps/system.cpu">chrome.system.cpu</a></td>
<td><a href="https://www.chromestatus.com/feature/6248386202173440">navigator.hardwareConcurrency</a></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/system_cpu">chrome.system.cpu</a></td>
</tr>
<tr>
<td><a href="https://developers.chrome.com/apps/system.display">chrome.system.display</a></td>
<td><a href="https://drafts.csswg.org/cssom-view/#the-screen-interface">window.screen</a></td>
<td><a href="https://developer.android.com/reference/android/util/DisplayMetrics">DisplayMetrics, but high density displays are wonky</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developers.chrome.com/apps/system.memory">chrome.system.memory</a></td>
<td><a href="https://www.chromestatus.com/feature/5119701235531776">navigator.deviceMemory</a></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/system_memory">chrome.system.memory</a></td>
</tr>
<tr>
<td><a href="https://developers.chrome.com/apps/system.network">chrome.system.network</a></td>
<td><a href="https://www.chromestatus.com/feature/6338383617982464">Network Information API</a></td>
<td></td>
<td></td>
</tr>
<tr>
<td><a href="https://developers.chrome.com/apps/system.storage">chrome.system.storage</a></td>
<td><a href="https://www.chromestatus.com/feature/5630353511284736">navigator.storage</a></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/system_storage">chrome.system.storage</a></td>
</tr>
<tr>
<td><a href="https://developers.chrome.com/apps/tts">chrome.tts</a></td>
<td><a href="https://www.chromestatus.com/feature/4782875580825600">Web
Speech API (Synthesis)</a></td>
<td><a href="https://android-developers.googleblog.com/2009/09/introduction-to-text-to-speech-in.html">Android TTS 2009</a></td>
<td><a href="https://developer.chrome.com/extensions/tts">chrome.tts</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/types">chrome.types</a></td>
<td></td>
<td></td>
<td><a href="https://developer.chrome.com/extensions/types">chrome.types</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/app_usb">chrome.usb</a></td>
<td><a href="https://www.chromestatus.com/feature/5651917954875392">Web USB API</a></td>
<td><a href="http://go/arc++usb">Temporary* private USB host API</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/virtualKeyboard">chrome.virtualKeyboard</a></td>
<td></td>
<td><a href="https://developer.android.com/training/keyboard-input">Soft Input Method</a></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/vpnProvider">chrome.vpnProvider</a></td>
<td></td>
<td><a href="https://developer.android.com/reference/android/net/VpnService">VpnService</a></td>
<td><a href="https://developer.chrome.com/extensions/vpnProvider">chrome.vpnProvider</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/wallpaper">chrome.wallpaper</a></td>
<td></td>
<td><a href="https://developer.android.com/reference/android/app/WallpaperManager">WallpaperManager</a></td>
<td><a href="https://developer.chrome.com/extensions/wallpaper">chrome.wallpaper</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/manifest/externally_connectable">externally_connectable</a></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/manifest/kiosk_enabled">kiosk_enabled</a></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/manifest/minimum_chrome_version">minimum_chrome_version</a></td>
<td></td>
<td>Target Android version</td>
<td><a href="https://developer.chrome.com/apps/manifest/minimum_chrome_version">minimum_chrome_version</a></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/offline_apps">offline_enabled</a></td>
<td><a href="https://developers.google.com/web/fundamentals/codelabs/offline/">Offline
via Service Workers</a></td>
<td>Native</td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/native-client">NaCl</a></td>
<td><a href="https://developer.chrome.com/native-client/migration">Migration Guide</a></td>
<td></td>
<td></td>
</tr>
<tr>
<td><a href="https://developer.chrome.com/apps/tags/webview">&lt;webview&gt; tag</a></td>
<td>Native</td>
<td><a href="https://developer.android.com/reference/android/webkit/WebView">WebView</a></td>
<td></td>
</tr>
</tbody>
</table>
<h2 id="faqs">FAQs</h2>
<h3 id="use-case-requirements">Q: What if the Chrome App migration recommendations do not meet my use case requirements?</h3>
<p>We'd like your feedback! Please fill out
<a href="https://forms.gle/cNiZJbSutFbnFUdv8">this form</a> with as much detail as possible.</p>
<h3 id="best-migration-path">Q: My Chrome App has many users. What's the best way to migrate them to my new web app and deprecate my Chrome App?</h3>
<p>You will still be able to publish updates to your Chrome App until the
runtime is removed. We recommend updating your app to include a message
indicating that your app has been discontinued, and that users should visit your
website going forward (see example below). You can also include an "uninstall"
button that calls the
<code><a href="https://developer.chrome.com/extensions/management#method-uninstallSelf">uninstallSelf()</code></a>
method.
</p>
<p>
Starting with Chrome 75,
the
<code><a href="https://developer.chrome.com/extensions/management#method-installReplacementWebApp">installReplacementWebApp()</code></a>
method can be used inside of a Chrome App, in response to a button click or
other user gesture, to automatically trigger the installation flow for your
replacement PWA.
</p>
<p><img src="{{static}}/images/photo.png" width="598" height="468" alt="Shows button that can link to install PWA" /></p>
<h3 id="app-launcher">Q: I want to continue to have a UI affordance that enables users to launch my app from the taskbar/dock/homescreen. What should I do?</h3>
<p>
<a href="https://developers.google.com/web/progressive-web-apps/">Progressive Web
Apps</a>
are installable on both
<a href="https://developers.google.com/web/progressive-web-apps/desktop">desktop</a>
and
<a href="https://developers.google.com/web/fundamentals/app-install-banners/">mobile</a>
platforms. Users who choose to install your PWA can launch it via icons and
shortcuts, similar to the way that Chrome Apps can be installed today.</p>
<h3 id="run-in-window">Q: I want my app to run in its own window, not in a tab. Is this something I can do with a web app?</h3>
<p>You can provide
<a href="https://developers.google.com/web/fundamentals/web-app-manifest/#display">metadata</a>
in your Progressive Web App's
<a href="https://developers.google.com/web/fundamentals/web-app-manifest/">manifest
file</a>
indicating that, when launched after installation, it will open in
its own window.</p>
<h3 id="keyboard-shortcuts">Q: My app supports keyboard shortcuts. Can the web support this also?</h3>
<p>Web apps can support keyboard shortcuts by listening to the various key events (e.g.
<strong><a href="https://developer.mozilla.org/en-US/docs/Web/Events/keydown">keydown</strong></a>),
but the shortcuts you can support are limited. For example, you cannot intercept
Ctrl+N, Ctrl+T etc. as these are used by the browser. Or, these might be
shortcuts that are handled by the operating system (e.g. Alt+Tab on Windows).</p>
<p>
When your web app is used in
<a href="https://developers.google.com/web/fundamentals/web-app-manifest/#display">fullscreen</a>
mode, you are able to
<a href="https://chromestatus.com/feature/5642959835889664">intercept</a>
these system shortcuts.</p>
<p>
The
<strong><a href="https://developer.chrome.com/extensions/commands">Extension Commands
API</strong></a>
supports richer keyboard shortcuts which operate across the
entire browser, which may enable new capabilities if transitioning to an
extension is possible.</p>
<h3 id="offline-app">Q: My app needs to run when the user is offline. Can I do that with a web app?</h3>
<p>Yes, you can
<strong><a href="https://developers.google.com/web/ilt/pwa/introduction-to-service-worker">use service workers to make your site run offline</strong></a>.
The
<a href="https://developers.google.com/web/tools/workbox/">Workbox</a>
project can simplify developing a full-featured caching strategy for your service
worker.</p>
<h3 id="push-messages">Q: My app uses the chrome.gcm API to receive push messages from the cloud. Can the open web do that?</h3>
<p>Yes, assuming the user has granted permission, the
<strong><a href="https://developers.google.com/web/fundamentals/engage-and-retain/push-notifications/">Push
API and Notifications API</strong></a>
can allow your web app to show your user push notifications.</p>
<h3 id="show-notifications">Q: My app needs to be able to show notifications to the user even when it has no windows open. Can I do that with the open web?</h3>
<p>Yes, the
<a href="https://developers.google.com/web/fundamentals/engage-and-retain/push-notifications/">Push API and Notifications API</a> provide this functionality.</p>
<strong><a href="https://developers.google.com/web/fundamentals/engage-and-retain/push-notifications/">Push API and Notifications API</strong></a>
can allow your web app to show your user push notifications
even when your web app is closed,
as long as an instance of the browser is running.</p>
<h3 id="bluetooth"><strong>Q: My app uses chrome.bluetooth/chrome.usb
to talk to a Bluetooth/USB device. Can this be done on the open web?</strong></h3>
<h3 id="bluetooth">Q: My app uses chrome.bluetooth/chrome.usb to talk to a Bluetooth/USB device. Can this be done on the open web?</h3>
<p>There are now proposals for new
<p>Both
<a href="https://developers.google.com/web/updates/2015/07/interact-with-ble-devices-on-the-web">Web Bluetooth</a>
and
<a href="https://wicg.github.io/webusb/">WebUSB</a> standards,
designed to allow this functionality.
A subset of the Web Bluetooth API is now enabled in Chrome on Android, Chrome OS, and Mac.</p>
<a href="https://developers.google.com/web/updates/2016/03/access-usb-devices-on-the-web">Web USB</a>
are available in certain browsers,
and can be used (along with feature detection) in a Progressive Web App.</p>
<h3 id="filesystem"><strong>Q: My app uses the chrome.fileSystem API to read
and write user-specified files and / or directories.
Can this be done on the open web?</strong></h3>
<h3 id="fileSystem">Q: My app uses the chrome.fileSystem API to read and write user-specified files and / or directories. Can this be done on the open web?</h3>
<p>In general, no.
The open web can read single files that the user opens,
but cannot retain access to those files, write to those files,
or have any access to directories.</p>
<p>The open web can read single files that the user opens, but cannot retain
access to those files, write to those files, or have any access to directories.</p>
<p>If it is critical for your app to read and write directories
(e.g. it is a text editor with a folder view),
you will need to either have a
<a href="https://developer.chrome.com/extensions/nativeMessaging">native helper app and extension combo</a>,
or create a native app.</p>
<p>
There are plans to
<a href="https://developers.google.com/web/updates/2018/11/writable-files">implement direct filesystem access</a>,
and an experimental implementation is available in Chrome,
but that functionality has not yet been fully standardized.</p>
<h3 id="sockets"><strong>Q: My app uses the chrome sockets API to do networking.
Can this be done with the open web?</strong></h3>
<h3 id="sockets">Q: My app uses the chrome sockets API to do networking. Can this be done with the open web?</h3>
<p>You might be able to do what you need with
<a href="https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API">WebSockets</a>.
However, to use this, you will likely need to change the remote end of your connection.
If that isn’t possible
(e.g. you’re connecting over an established protocol like IRC or SSH),
you’ll need some sort of native component.</p>
<strong><a href="https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API">WebSockets</strong></a>.
However, to use this, you will likely need to change the remote end of your
connection.</p>
<p>
If that isn't possible, we'd like to hear more about your use case—please
let us know about what you're trying to accomplish
<a href="https://bit.ly/new-fugu-request">via the Chromium issue
tracker</a>.</p>
<h3 id="migration-resources">Q: What resources are available to help with a Progressive Web App migration?</h3>
<p>The Chrome team maintains the following sites and tools with information that
can help during your migration:</p>
<ul>
<li><a href="https://developers.google.com/web/updates/capabilities">Web Capabilities</a> overview</li>
<li><a href="https://developers.google.com/web/ilt/pwa/">Progressive Web Apps Training</a></li>
<li><a href="https://developers.google.com/web/tools/workbox/">Workbox</a>, for generating a service worker</li>
</ul>
<p>If you have a specific question not addressed via those resources,
we recommend asking a question on
<a href="https://stackoverflow.com/">Stack
Overflow</a>.
This
<a href="https://stackoverflow.com/questions/ask?tags=progressive-web-apps,google-chrome-app">template</a>
can be used to create a question tagged with both
<code><a href="https://stackoverflow.com/questions/tagged/google-chrome-app">google-chrome-app</code></a>
and
<code><a href="https://stackoverflow.com/questions/tagged/progressive-web-apps">progressive-web-apps</code></a>,
to ensure maximum visibility.</p>
<h3 id="missing-capability">Q: I'd like to use a capability not mentioned already that lacks a web alternative. How do I make a feature request?</h3>
<p>We'd like to hear more about what you're trying to accomplish— let us know
<a href="https://bit.ly/new-fugu-request">via the Chromium issue tracker</a>.</p>
<h2 id="hosted-apps">Chrome hosted apps</h2>
<h2 id="hosted-faqs">FAQs</h2>
<h2 id="hosted-apps-faqs">FAQs</h2>
<h3 id="notifications"><strong>Q: My hosted app uses the notifications permission.
How do I do that on the web?</strong></h3>
<h3 id="hosted-apps-notifications-permission">Q: My hosted app uses the notifications permission. How do I do that on the web?</h3>
<p>As of Chrome 42, you can send
<a href="https://developers.google.com/web/fundamentals/engage-and-retain/push-notifications/?hl=en">push notifications via your web application</a>.
Check out this
<a href="https://developers.google.com/web/fundamentals/getting-started/push-notifications/">codelab</a>
to get started.</p>
<p>Yes, assuming the user has granted permission,
the
<strong><a href="https://developers.google.com/web/fundamentals/engage-and-retain/push-notifications/">Push API and Notifications API</strong></a>
can allow your web app to show your user push notifications.</p>
<h3 id="persistent"><strong>Q: My hosted app uses the unlimitedStorage permission.
How do I do that on the web? </strong></h3>
<h3 id="unlimitedStorage">Q: My hosted app uses the unlimitedStorage permission. How do I do that on the web?</h3>
<p>The unlimitedStorage permission ensured that data you store was ‘Persistent’,
<p>The unlimitedStorage permission ensured that data you store was ‘Persistent',
which means it can only be cleared manually by the user.</p>
<p>The recommended alternative is to use
<a href="https://developers.google.com/web/updates/2016/06/persistent-storage?hl=en">Persistent Storage</a>
in your web app.
As of Chrome 52, Persistent Storage is available as an
<a href="https://github.com/jpchase/OriginTrials/blob/gh-pages/developer-guide.md#how-do-i-enable-an-experimental-feature-on-my-origin">Origin Trial</a>.
To use this API in Chrome Stable,
you will need to request a token and insert it in your web application.</p>
<h3 id="geolocation"><strong>Q: My hosted app uses the geolocation permission.
How do I do that on the web? </strong></h3>
<p>
The recommended alternative is to request
<strong><a href="https://developers.google.com/web/updates/2016/06/persistent-storage?hl=en">Persistent Storage</strong></a>
permission within your web app.</p>
<p>The <a href="https://dev.w3.org/geo/api/spec-source.html">HTML5 geolocation API</a>
can be used in web apps to locate a user’s position.</p>
<h3 id="geolocation">Q: My hosted app uses the geolocation permission. How do I do that on the web?</h3>
<p>Note: As of Chrome 50,
the Geolocation API will only work on secure contexts such as HTTPS.
If your site is hosted on an non-secure origin (such as HTTP),
the requests to get the user’s location will no longer function.</p>
<p>The
<strong><a href="https://developer.mozilla.org/en-US/docs/Web/API/Geolocation_API">Geolocation API</strong></a>
can be used in web apps to locate a user's position.</p>
<h3 id="background"><strong>Q: My hosted app uses the background permission.
How do I do that on the web? </strong></h3>
<h3 id="background">Q: My hosted app uses the background permission. How do I do that on the web?</h3>
<p>To ensure minimal power consumption we have been careful
about introducing a generic method for sites to run in the background
on user’s devices.</p>
<p>To ensure minimal power consumption we have been careful about introducing a
generic method for sites to run in the background on user's devices.</p>
<p>As of Chrome 49,
sites can ensure actions taken by the user are synced to the server using the
<a href="https://developers.google.com/web/updates/2015/12/background-sync?hl=en">Background Sync API</a>.
<p>
Sites that have deployed a
<a href="https://developers.google.com/web/ilt/pwa/introduction-to-service-worker">service
worker</a>
can ensure actions taken by the user while offline are synced to the server using the
<strong><a href="https://developers.google.com/web/updates/2015/12/background-sync?hl=en">Background Sync API</strong></a>.
This API allows sites to run some limited code in the background
when the device re-connects to the internet,
even if the tab has since been closed.
Note that this API doesn’t allow for the service worker
Note that this API doesn't allow for the service worker
to be woken up periodically.</p>
<p>In the future,
we hope to introduce a quota-limited ability for sites to wake up their service worker
by sending a push message but without being required to show the user a notification.
You can follow the progress of this work by starring
<a href="https://bugs.chromium.org/p/chromium/issues/detail?id=617971&desc=2">this issue</a>
in the Chromium Issues Tracker.</p>
<h3 id="clipboard-write"><strong>Q: My hosted app uses the clipboardWrite permission.
How do I do that on the web? </strong></h3>
<p>As of Chrome 43,
websites are now able to programmatically
<a href="https://developers.google.com/web/updates/2015/04/cut-and-copy-commands">trigger cut and copy</a>.</p>
<h3 id="clipboard-read"><strong>Q: My hosted app uses the clipboardRead permission.
How do I do that on the web? </strong></h3>
<p>We are currently working on bringing the ability to read the clipboard
to the web and you can star
<a href="https://bugs.chromium.org/p/chromium/issues/detail?id=593475">this issue</a>
to be kept up to date.
Until then you may consider building an extension with the clipboardRead permission
to provide the functionality to your web app.</p>
<p>
A separate feature,
<a href="https://developers.google.com/web/updates/2019/08/periodic-background-sync">Periodic Background Sync</a>,
is being implemented as an experimental feature in Chrome.
It allows developers to request periodic updates
via a special event exposed on the service worker,
with controls over the frequency of those updates.</p>
<h3 id="clipboard">Q: My hosted app uses the clipboardRead and/or clipboardWrite permission. How do I do that on the web?</h3>
<p>Web apps can use a standard platform API to copy and paste both
<a href="https://developers.google.com/web/updates/2018/03/clipboardapi">text</a>
and
<a href="https://developers.google.com/web/updates/2019/07/image-support-for-async-clipboard">images </u>programmatically.</a></p>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment