Свойство "share" не существует в типе "Навигатор"

Мне нужно использовать WebShareAPI в моем приложении Ionic.

Вот мой код, предложенный во введении API веб-ресурса

if (window.navigator && window.navigator.share) {
  window.navigator.share({
    title: 'title',
    text: 'description',
    url: 'https://soch.in//',
  })
    .then(() => console.log('Successful share'))
    .catch((error) => console.log('Error sharing', error));
} else {
  alert('share not supported');
}

Однако компиляция Typescript завершается неудачно со следующей ошибкой:

[11:31:11]  typescript: src/pages/channel_home/channel_home.ts, line: 89
            Property 'share' does not exist on type 'Navigator'.

Существует вероятная причина, объясняемая здесь DOM lib: добавлена поддержка navigator.share

Тем не менее, я хотел бы узнать какой-нибудь обходной путь, чтобы заставить WebShareApi работать в моем приложении Ionic, в частности, и в любом приложении Angular или Typescript в целом.

Ответ 1

На основе этого ответа вы можете попытаться определить переменную типа any и присвоить ей значение Type Navigator. Функция isssue связана с типом типаScript.

let newVariable: any;

newVariable = window.navigator;

if (newVariable && newVariable.share) {
  newVariable.share({
    title: 'title',
    text: 'description',
    url: 'https://soch.in//',
  })
    .then(() => console.log('Successful share'))
    .catch((error) => console.log('Error sharing', error));
} else {
  alert('share not supported');
}

Другим вариантом будет расширение интерфейса Navigator, как это предлагается в ссылке, опубликованной выше.

Ответ 2

Это также работает, и нам не нужно создавать newVariable.

if (window.navigator && window.navigator.share) {
  window.navigator['share']({
    title: 'title',
    text: 'description',
    url: 'https://soch.in//',
  })
    .then(() => console.log('Successful share'))
    .catch((error) => console.log('Error sharing', error));
} else {
  alert('share not supported');
}

Ответ 3

Если вы ищете правильный ответ, просто добавьте его в свой файл global.d.ts:

type ShareData = {
    title? : string;
    text? : string;
    url? : string;
};

interface Navigator
{
    share? : (data? : ShareData) => Promise<void>;
}

Это правильно отражает API уровня 1.

Ответ 4

Это сработало для меня

let newVariable = (window.navigator as any)
if(newVariable.share){
  newVariable.share({
  title: 'title',
  text: 'description',
  url: 'https://soch.in//',
})
  .then(() => console.log('Successful share'))
  .catch((error) => console.log('Error sharing', error));
} else {
  alert('share not supported');
}

Ответ 5

в моем случае: в Angular, на модуле, который я использую:

navigator.getUserMedia = navigator.getUserMedia || navigator.mozGetUserMedia || navigator.webkitGetUserMedia;

и машинопись показывает ошибку, MozGetUserMedia не является свойством.

Я исправил с помощью:

declare const navigator: any;

Может быть, тот же подход будет работать для вас: