支付宝小程序与H5互相跳转

1. 小程序跳转H5使用（仅限企业账号小程序使用）

<web-view :src="src"></web-view>
//通过src属性设置路径，如果需要携带参数可以拼接在路径上
比如：this.src=`https://xxx/xxx/xxx:xx/?auth_code=${auth_code}`
注意：路径需要在小程序后台配置白名单（开放平台控制台 > 小程序详情页 > 开发设置 > H5 域名配置）

2. H5跳转小程序

1.h5页面需要手动引入`https://appx/web-view.min.js` (此链接仅支持在支付宝客户端内访问)
2.直接调用my.navigate()跳回小程序原生页面

//使用方法：
//H5页面中代码
//引入小程序js
<script type="text/javascript" src="https://appx/web-view.min.js"></script>
<!-- 如该 H5 页面需要同时在非支付宝客户端内使用，为避免该请求404，可参考以下写法 -->
<!-- 请尽量在 html 头部执行以下脚本 -->
<script>
  if (navigator.userAgent.indexOf('AlipayClient') > -1) {
    document.writeln('<script src="https://appx/web-view.min.js"' + '>' + '<' + '/' + 'script>');
  }
</script>

<script>
  my.navigateTo({url: '../get-user-info/get-user-info'});
  // H5向小程序 postMessage 消息
  my.postMessage({name:"测试web-view"});
  // 接收来自小程序的消息。
  my.onMessage = function(e) {
    console.log(e); // {'sendToWebView': '1'}
  }
  // 判断是否运行在小程序环境里
  my.getEnv(function(res) {
    console.log(res.miniprogram) // true
  });
  my.startShare();
</script>
----------------------------------------------------------------
//小程序中代码

<template>
  <web-view id="web-view-1" src="..." onMessage="test"></web-view>
</template>

<script>
    onLoad(e){
    //在H5调用my.postMessage发消息给小程序，小程序在onMessage方法中可以接收
    //在小程序中调用 `this.webViewContext.postMessage` 可以向对应的 web-view 组件发送消息，在 web-view 中的 H5 上可以通过定义一个 `my.onMessage` 函数接收到消息。
      this.webViewContext = my.createWebViewContext('web-view-1');    
    },
    test(e){
      my.alert({
        content:JSON.stringify(e.detail),
      });  
      this.webViewContext.postMessage({'sendToWebView': '1'});
    },
  });
 
 
 //方法二：
 //跳转地址：appId:小程序的appid page：页面路径
 window.location.href = `alipays://platformapi/startapp?appId=2021003xxxxxx8&page=pages/index/index`;