
Благодаря API веб-ресурса веб-приложения могут использовать те же возможности системного ресурса, что и native apps.. Использование нативного API с помощью веб-доступа позволяет веб-приложениям обмениваться ссылками, текстом и файлами с другими приложениями, установленными на устройстве, так же, как и с native apps..

Концепции и использование
Возможности и ограничения
Веб-ресурс имеет следующие возможности и ограничения:
- Он может использоваться только на сайте, который поддерживает HTTPS.
- Он должен быть вызван в ответ на действие пользователя, такое как щелчок. Вызвать его через обработчик
onload
невозможно. - Он может поделиться, URL-адреса, текст или файлы.
Обмен ссылками и текстом
Чтобы поделиться ссылками и текстом, используйте метод share()
, который является базовым методом. Чтобы браузер не выдавал ошибку TypeError
, объект должен содержать хотя бы одно из следующих свойств: title
, text
, url
или files
.
Вы можете, например, обмениваться текстом без URL или наоборот. Разрешение всем трем тегам расширяет гибкость вариантов использования. Представьте, что после запуска приведенного ниже кода пользователь выбрал приложение электронной почты в качестве цели. Параметр title
может стать темой письма, code>text - телом сообщения и files
- вложением.
if (navigator.share) { navigator.share({ title: 'web.dev', text: 'Check out web.dev.', url: 'https://web.dev/', }) .then(() => console.log('Successful share')) .catch((error) => console.log('Error sharing', error)); } else { // display an alternative function or script to share }
Если на вашем сайте несколько URL-адресов для одного и того же содержимого, предоставьте общий канонический URL-адрес страницы вместо текущего URL-адреса. Вместо того, чтобы делиться document.location.href
, вы должны проверить канонический URL-тег в
страницы и поделиться им:
let url = document.location.href; const canonicalElement = document.querySelector('link[rel=canonical]'); if (canonicalElement !== null) { url = canonicalElement.href; } navigator.share({url: url});
Обмен файлами
Чтобы поделиться файлами, сначала проверьте и вызовите navigator.canShare()
. Затем включите массив файлов в вызов navigator.share()
:
if (navigator.canShare && navigator.canShare({ files: filesArray })) { navigator.share({ files: filesArray, title: 'Artdevue WebDev', text: 'This is a test line to share.', }) .then(() => console.log('Share was successful.')) .catch((error) => console.log('Sharing failed', error)); } else { console.log(`Your system doesn't support sharing files.`); }
Обратите внимание, что пример выше обрабатывает обнаружение функций, проверяя naviagator.canShare()
, а не navigator.share()
. Объект данных, переданный в canShare()
, поддерживает только свойство files
. Изображения, видео, аудио и текстовые файлы могут быть общими. (См. Разрешенные расширения файлов в Chromium.)
Комментариев нет