非常多的網站需要分享的功能,從 facebook 分享按鈕、line share 按鈕.....等等等,還有整合分享的外掛,分享外掛多不勝數,不妨也可以試試看這一個手機(IOS和Android)原生的分享功能 Navigator.share()。
網站製作開發時,非常多的網站需要分享的功能,從 facebook 分享按鈕、line share 按鈕.....等等等,還有整合分享的外掛,分享外掛多不勝數,不妨也可以試試看這一個。
使用前必須要先知道的是 Web Share API 你的網站必須支援 https,並且它於部分APP內的瀏覽不支援 (EX: line對話開啟的瀏覽器)
我們來看看MDN上面的文獻吧
https://developer.mozilla.org/let shareData = { title: 'MDN', text: 'Learn web development on MDN!', url: 'https://developer.mozilla.org', } const btn = document.querySelector('button'); const resultPara = document.querySelector('.result'); btn.addEventListener('click', () => { navigator.share(shareData) .then(() => resultPara.textContent = 'MDN shared successfully' ) .catch((e) => resultPara.textContent = 'Error: ' + e ) });
title: 網站名稱
text: 分享訊息
url: 網址
Chance Design 網站右下角分享按鈕就是用這個唷! 大家可以體驗看看。