Posted 10 months ago. Visible to the public. Repeats. Linked content.

Native share dialog on mobile Chrome

Mobile Chrome (and the Safari Technology Preview) support the "web share API" which allow you to use the native share functionality of an Android phone. When clicking a share button using this API, the browser will automatically show all installed applications that support content sharing, such as Whatsapp, Facebook, Twitter, e-mail etc.

The API is extremely simple to use:

Copy
if ( typeof(navigator.share) === 'function' ) { let data = { url: '<url to share>', title: '<title to share>', text: '<text to share>', } $element.on('click', (event) => { navigator.share(data) return false }) }

If you require feedback, navigator.share will return a promise that resolves or rejects, depending on whether the sharing was completed.

Note that this will only work on https pages, so to test it in development, you will have to start your development server with SSL.

Once an application no longer requires constant development, it needs periodic maintenance for stable and secure operation. makandra offers monthly maintenance contracts that let you focus on your business while we make sure the lights stay on.

Owner of this card:

Avatar
Tobias Kraze
Last edit:
10 months ago
by Besprechungs-PC
About this deck:
We are makandra and do test-driven, agile Ruby on Rails software development.
License for source code
Posted by Tobias Kraze to makandra dev
This website uses cookies to improve usability and analyze traffic.
Accept or learn more