Web Share API: معرفی API اختصاصی گوگل برای اشتراک‌گذاری در شبکه‌های اجتماعی

Web Share API: معرفی API اختصاصی گوگل برای اشتراک‌گذاری در شبکه‌های اجتماعی

Web Share API که توسط دولوپری به نام Matt Giuca در تیم کروم نوشته شده است، این امکان را در اختیار برنامه‌نویسان اندروید قرار می‌دهد تا با کمک این API بتوانند قابلیت Share (اشتراک‌گذاری) را در اپ‌های اندرویدی فعال کنند.

در نسخهٔ 61 مرورگر کروم در پلتفرم اندروید، متد جدیدی به نام ()navigator.share که قسمتی از Web Share API است اضافه شده که به وب‌سایت‌ها اجازه می‌دهد تا به امکانات به اشتراک‌گذاری در دستگاه اندرویدی کاربر بازدید‌کننده دسترسی یابند.

روش استفاده از Web Share API
در این API آبجکتی که فرستاده می‌شود باید دست کم یکی از پراپرتی‌های text یا url را داشته باشد:

if (navigator.share) {
  navigator.share({
      title: 'Web Fundamentals',
      text: 'Check out Web Fundamentals — it rocks!',
      url: 'https://developers.google.com/web',
  })
    .then(() => console.log('Successful share'))
    .catch((error) => console.log('Error sharing', error));
}

یک بار که این کد اجرا شود، منوی انتخاب در اندروید باز شده و به وب‌سایت اجازه می‌دهد تا داده‌ها را با اپلیکیشن مورد نظر کاربر به اشتراک بگذارد.

شرایط استفاده از Web Sahre API
- سایت باید در بستر پروتکل امن HTTPS باشد.
- تنها در مرحلهٔ ریسپانس به سمت کاربر می‌توان این API را فراخوانی کرد. مثلاً وقتی که جایی در وب‌سایت را کلیک کرد.
- متد ()navigator.share را نمی‌توان در حین Load شدن صفحه فراخوانی کرد.
- نه تنها می‌توان URL را به اشتراک گذاشت، بلکه متون خارج از چهارچوب وب‌سایت نیز قابل اشتراک‌گذاری است.
- قبل از استفاده از این API، باید مطمئن شوید که این قابلیت در سمت کاربر قابل دسترس است (مثلاً ممکن است نسخهٔ کروم وی قدیمی باشد). در این‌ صورت با فراخوانی متد ()navigate.share، کد به خطا خواهد خورد و حتی ممکن است سایت شما بالا نیاید! بنابراین باید این موضوع را با دستور navigator.share !== undefined بررسی کنید.

برای شروع، شما به عنوان برنامه‌نویس می‌توانید هر نوع URL را با کمک Web Share API به اشتراک بگذارید، اما برای اینکه کاربر تجربهٔ خوشایندی از بازدید سایت شما داشته باشد، باید از Canoncial URL در وب‌سایت خود استفاده کنید (Canonical URL یک روش استاندارد برای معرفی آدرس صحیح یک صفحه به موتور جستجوی گوگل است). کد زیر نشان می‌دهد که چه‌طور این کار را انجام دهید:

let url = document.location.href;
const canonicalElement = document.querySelector('link[rel=canonical]');
if (canonicalElement !== null) {
    url = canonicalElement.href;
}
navigator.share({url: url});