Using Web Share Target API to Receive Shared Content on Websites

With the rise of mobile internet, user traffic has shifted from PCs to smartphones, prompting the W3C to define new web standards that let front‑end engineers simulate native functionality. One such capability is sharing, which allows users to exchange webpages, articles, or data across apps.

The Web Share Target API enables a website to register itself as a share target. Once registered, the site appears as an icon in the system share panel, and any data shared to it is delivered to a specified handler page.

To register a site, you need to add a share_target entry to the web app’s manifest.json . The manifest tells the browser which page to open and which parameters (title, text, url) to expect.

{ "share_target": { "action": "share.html", "params": { "title": "title", "text": "text", "url": "url" } } }

When another app shares content, the browser opens the share.html page with a query string such as ?title=hello&text=world&url=https://example.com . You can parse these parameters with JavaScript and act on them.

window.addEventListener('DOMContentLoaded', () => { const parsedUrl = new URL(window.location); console.log('Title shared: ' + parsedUrl.searchParams.get('title')); console.log('Text shared: ' + parsedUrl.searchParams.get('text')); console.log('URL shared: ' + parsedUrl.searchParams.get('url')); });

Typical handling strategies include creating an email draft (using title as subject), generating a new social‑media post (title as heading, text as body, url as link), or composing a chat message in apps like WeChat.

Because other apps may not always provide all parameters, you should validate the received data. On Android, the url field is often empty and may appear in the text or title fields.

Browser support is currently limited to Chrome 71+ on Android. Microsoft Edge and Mozilla Firefox have announced plans to support the API but have not yet implemented it.

An interactive example can be viewed at https://web-share.glitch.me/ .

In summary, combining the Web Share API (to send data) with the Web Share Target API (to receive data) provides a simple bridge for data exchange between websites and mobile apps, enabling effective content distribution and user acquisition.

For further reading see the explainer documentation and the official WICG specifications:

Web Share Target Explainer Web Share Level 2