H5三方支付记录

步骤

1. 获取当前用户环境支持的支付方式

   其中又分为 跳转支付 和 扫码支付。

   参考：

   //  获取支持的列表并展示 UI
   // code 根据业务自定义
   const onlinePay = [
     {
       name: '支付宝支付',
       code: 1,
     },
     {
       name: '微信支付',
       code: 2,
     },
     {
       name: '信用卡支付',
       code: 2,
     },
     {
       name: '扫码支付', // 支付宝、微信等扫码支付统一为一种支付方式,UI 可以具体区分
       code: 20,
     }, 
   ];
   
   
   

2. 选取支付方式后并点击支付

   调用接口进行支付前校验并获取三方支付必要信息

   // 和后端协商传入支付方式,订单id,应用 openId 等等
   const params = {
     payCode,
     orderId,
     openId,
     // ...
   };
   const resp = await apis.orderpayment({ data: params});
   
   

3. 根据不同的支付方式（扫码，跳转）进行处理

   扫码支付：

   // 通过上面接口拿到拼接的url
   // 绘制二维码组件
   // 轮询，调取接口判断是否支付成功
   

   跳转支付：

   // 1.准备一个用于跳转的回调页面
   // 2.调取三方 jssdk
   // 3.假如是微信jssdk，会自动跳转到传入的回调页面
   // 4.如果不是的话，待 jssdk 调取成功后，手动跳转到中转页面给用户反馈