Home / Snippets / How to Implement Web Share API
How to Implement Web Share API cover

How to Implement Web Share API

266

2 years ago

0 comments

In this short snippet, you will learn how to implement Web Share API. This is a new browser API to allow the share dialog on mobile devices.
To get started let's prepare the data below. It can be from your online page/blog.
const data = {
	title: "Hello World",
	text: "Hello world is just an intro text",
	url: "https://postsrc.com"
}
Once you have it ready then you can check if the navigator is present and check whether the canShare method is present. Once you have done so you can share the data. Otherwise, the browser doesn't support this new Web Share API.
if (navigator.canShare && navigator.canShare(data)) {
	navigator.share(data);
}
This Web Share API is supported for the Chrome-based browser Version 61+, Firefox version 79+ and Safari 12.2+
notion avatar

Alaz

Week-end developer currently experimenting with web, mobile, and all things programming.

Topics:

Frontend

Resource

Average

Average

Support Us

If you like our tutorial, support us by being our Patreon or buy us some coffee ☕️

Welcome to PostSrc V3

PostSrc Dark Logo

You have to login to favorite this