在支付宝环境开发H5页面
分析:h5 端必须使用钱包环境,通过调用支付宝的全局变量 AlipayJSBridge 来实现云客服与访客的视频通话功能。
搭建支付宝的开发环境:
- 最优方法是基于现有的开发方式,用 Charles 代理 h5 页面,电脑上安装 xcode simulator 模拟支付宝环境的开发方式;
- 让手机和电脑在同一个网络环境下,用手机上的支付宝访问开发页面,用 Charles 代理到本地代码,进行开发;
- 本地开发,每一次开发完,用 basement 部署到预发环境,然后访问聊天窗地址,查看效果。
对比上述 3 中方案,第一种是最方便,也是实时能看到开发效果的方式,缺点是:simulator 与真机环境存在差异,可能会有兼容bug;第二种方案是折中的方案,开发需要每次打开支付宝,访问聊天窗页面来查看开发效果,比较慢,而且页面可能会把支付宝卡死,优点:真机环境,所有的功能都能够兼容;第三种方案也是兜底的方案,实在没辙了就写完,然后部署预发,然后再手机上访问聊天窗地址访问,是最慢的开发方式。
结果:
第一种方式搭建好,开发时才发现虚拟机不能调用支付宝上的视频通话功能,然后使用第二种方法,成功。
同时由于 h5 页面的全局变量,需要注释掉 eslint 检查