React JS移动端应用实现跨APP分享及Web Share API适配问题咨询

问题1：应用内启动内置浏览器打开对应页面，Web Share API方案是否可以正常运行 #

该方案的生效依赖两个前置条件：

• 你使用的内置浏览器/WebView没有主动限制Web Share API的调用权限，绝大多数主流系统默认的内置浏览器、未做定制化权限限制的WebView都支持该API，支持程度和系统自带浏览器保持一致
• 承载分享逻辑的页面必须部署在HTTPS环境下，这是Web Share API的官方强制要求，本地HTTP调试环境会默认禁用该API
  同时满足以上两个条件时，你现有代码可以在内置浏览器中正常唤起原生分享面板。

问题2：React JS应用添加原生分享能力的其他可行方案 #

根据你的应用形态不同，可以选择对应的适配方案：

• 纯网页应用场景
  可以做两级适配：优先检测Web Share API是否可用，不可用时降级弹出自定义分享面板：
  • 针对微信、QQ等国内社交平台，接入对应平台的官方JS-SDK，调用平台提供的专属分享接口实现原生分享效果
  • 针对其他平台，可以直接拼接对应平台的公开分享跳转参数，用户点击后跳转至对应App完成分享操作
• 套壳App/ WebView混合开发场景
  可以通过JSBridge桥接实现原生分享：由原生端提前实现系统原生分享能力，向WebView暴露可调用的全局方法，React端只需按约定传入分享标题、内容、链接等参数调用该方法即可，兼容性远高于Web Share API，不受浏览器类型限制
• React Native开发场景
  直接使用react-native-share等封装好的原生能力模块，无需依赖Web API即可实现全平台原生分享唤起。

现有代码小优化提示 #

你现有代码中的成功日志拼写有误，可以将console.log("Sharing successfull")修改为console.log("Sharing successful")。

内容的提问来源于stack exchange，提问作者Ndango