一、实现思路

小程序通知h5：url加上参数即可。

h5通知小程序：h5里使用 location.href （需要不同域名）后，web-view组件的load事件会重新执行，并且返回新链接的url，即可实现通信。

二、效果

三、示例代码

<web-view src="{{webSrc}}" bindload="load" />

Page({
  data: {
    webSrc: 'https://static.yipintemian.com/pdf/pdf-page-message.html?from=mini',
  },
  load(e) {
    const { src } = e.detail;
    if (src.includes('?from=h5')) {
      const query = this.parseUrl(src);
      console.log(query);
      wx.showModal({
        title: 'h5参数',
        content: query.content,
        showCancel: false,
      });
    }
  },
  // url 转 query
  parseUrl(url) {
    return url
      .split('?')[1]
      .split('&')
      .reduce((acc, cur) => {
        const [key, value] = cur.split('=');
        acc[key] = decodeURIComponent(value);
        return acc;
      }, {});
  },
});

（注意：在你的小程序里需要开启不校验合法域名）

四、注意点

1. 在你的小程序里需要开启不校验合法域名
2. h5里使用 location.href 需要不同域名
3. 若想查看h5源代码，浏览器打开网址后，查看页面源码

五、相关文章

1. 在小程序里初步获取pdf页数
2. 在小程序里预览pdf文件
3. 小程序与h5接近实时的双向通信
4. 小程序页面通过webview获取pdf页数(改为：小程序页面实时计算pdf页数)
5. 小程序pdf、word、excel、ppt等文件页数与预览