创建共享按钮的最佳选项是什么？ （反应）

Question

我看到了很多选项来创建与用户的共享交互：

• 网络共享API：https://www.w3.org/TR/web-share/#sharedata-dictionary 它似乎与 Progressive-Web-App 兼容，但 Firefox 并没有很好地支持它（https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share#browser_compatibility）
• 简单分享器：https://reactjsexample.com/a-javascript-framework-to-share-url-to-social-media-sites-like-facebook-twitter-reddit-whastapp/ 如果我理解得很好，它不适用于移动设备，对吗？
• 反应分享：https://reactjsexample.com/social-media-share-buttons-and-share-counts-for-react/ 似乎适用于所有浏览器，但我不知道它是否对 PWA 友好。似乎是最好的选择，但我不确定......最后一次更新是在一年前（https://www.npmjs.com/package/react-share）所以也许它不会通过维护次...

您的应用程序使用什么？你有什么推荐？ 你知道更好的选择吗？

我对该应用程序的需求是通过社交媒体或邮件/文本或 ??? 分享 URL等等。理论上没有文件。当用户分享某些内容时，我希望在社交媒体上调整预览。

Answer 1

我个人使用过react-share，但无法打开手机中的一些应用程序，例如whatsapp等

解决方法是深层链接。

如果用户使用智能手机或平板电脑（我们可以使用

navigator.userAgent

轻松获得此信息），那么您可以使用基于应用程序的深层链接，否则可以使用传统方式将用户重定向到新网页。 一些例子：

• Whatsapp：https://faq.whatsapp.com/563219570998715/?locale=en_US
• Instagram：答案已经给出了这里

注意：如果用户也在桌面上安装了该应用程序，深层链接就可以工作（从未在 macOS 上尝试过，但对于 Windows 和 ubuntu 来说它可以工作）

编辑后：

您可以在书写

mailto:

时在

href

中使用

<a .../>

。 示例：

<a href="mailto:[email protected]?subject=sharing%20link&body=I%20am%20sharing%20a%20link:%20https://google.com">Share this link</a>

有关 mailto 的更多参考，请访问此 MDN 文档：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-href