一、背景
近期接到招聘小程序要内嵌商业产品的需求，这里大致记录下一些接入过程中涉及到的要点
二、差异点
先说下小程序中的webview和普通h5页面的差异点
1. cookie的问题
小程序中的cookie和小程序webview中的cookie不共享
2. 小程序webview中只能使用部分微信jssdk的功能
具体参考：微信小程序webview页面
支付功能不在其中，按照微信要求不能在当前页面中直接调用微信支付，需要跳转到一个微信小程序原生页面来进行支付操作
三、接入要点
1. 登录态
在URL中增加登录票据，由前端获取后通过js注入cookie
2. 支付功能的调整
整体方案：在小程序中新增一个专用充值页面，业务页面（小程序webview内嵌页面）需要充值时，携带参数跳转到小程序充值页面，充值完成后再跳回到业务页面
具体流程：
- 用户选择商业产品的套餐
- 业务前端发送用户选择数据和当前场景（微信小程序）等信息给业务后端
- 业务后端获取数据后，处理充值参数，然后调用PMC获取充值参数的接口，获取充值参数返回给业务前端
- 业务前端把参数拼接到小程序路由，跳转到小程序充值页面
- 小程序充值页面充值完成后，跳转回业务页面
3. 在小程序管理后台中配置域名
在小程序的webview中访问页面需要配置两种域名：
- 服务器域名：接口请求、CDN静态资源等的域名，平时的小程序开发就需要配置，这里不再赘述
- 业务域名：在webview中打开需要配置的域名，针对需要再小程序使用webview内嵌的场景，除了在小程序后台配置域名外，还需要进行域名验证，让微信确认此域名是你拥有。
业务域名验证方式：
在业务域名根路径下增加微信提供的文件，里面包含验证的加密串。
方案：
- 可在域名对应集群下增加静态资源托管
- 可在nginx层根据location分流由nginx层托管。
4. 页面路由常见处理逻辑兼容
微信JSSDK：https://res.wx.qq.com/open/js/jweixin-1.6.0.js
页面路由会退：window.wx.navigateBack();
关闭当前页面：window.wx.miniProgram.navigateBack();