支付宝 H5 页面的分享转发的开发

关于支付宝的 H5 分享转发的功能，支付宝开发文档写的非常混乱

Alipay JSAPI 概览：https://opendocs.alipay.com/open/025a4p

Alipay JSAPI 使用说明：https://opendocs.alipay.com/open/024kz4

从以上两篇官方文档里，很难获取到直接有用的信息，甚至找不到下手的点

直到看见这篇：

H5 JSAPI DEMO：https://opendocs.alipay.com/common/02kkv6

通过这里下载后的 DEMO 发现，H5 页面是需要引入：

https://as.alipayobjects.com/g/component/antbridge/1.1.1/antbridge.min.js

在支付宝文档里搜索“antbridge”关键词，根本找不对应的文档

---------------------------------

分析 DEMO 里的案例发现，DEMO 里给出的方案是，点击按钮后，触发 Ali.share 方法，弹出 optionMenu 选项菜单：

可是我的 H5 网页里，不需要这种分享方式，需要的是右上角用户自主分享，不是再增加一个占据页面空间的“分享按钮”来点击，这种方式，DEMO 里没有给出实现方法。

再经过大量的查阅资料，才找到可行方案，就是监听 optionMenu 事件，监听到用户点击右上角导致 optionMenu 事件触发的时候，再触发 Ali.share 方法，通过触发 Ali.share 方法来给分享赋值：标题、图标、描述和链接。

但是这会导致另一个离奇效果出现，就是会弹出两次 optionMenu 选项菜单，用户点右上角弹出一次，Ali.share 方法调用时又弹出一次，体验效果完全不对。

这里又要看另一篇文档

setOptionMenu：https://opendocs.alipay.com/open/02523v

需要用到 preventDefault: true 来实现阻止默认分享功能

以上就是实现方法，具体代码可访问我的项目去体验和查看源码，

网址可在支付宝、微信、PC 内三方平台访问打开，做了三方兼容：

https://www.maxbei.com/vx_mxb/