alipay-webview-bridge-miniprogram

H5 WebView 与支付宝小程序双向通信适配器 - 小程序部分

安装

npm install alipay-webview-bridge-miniprogram

使用

// pages/webview/webview.js
const { createBridgeProxy } = require('alipay-webview-bridge-miniprogram');

Page({
  data: { webUrl: 'https://your-h5-page.com' },
  onLoad() {
    this.proxy = createBridgeProxy(this);
  },
  onWebViewMessage(e) {
    this.proxy.handleMessage(e);
  },
});

<!-- pages/webview/webview.axml -->
<web-view id="web-view" src="{{webUrl}}" onMessage="onWebViewMessage" />

自定义扩展

小程序端支持注册自定义 API：

proxy.registerApi('myCustomApi', {
  responseType: 'myCustomApi_response',
  handler: async (data, ctx) => {
    // 处理逻辑
    return { result: 'ok' };
  },
});

H5 端调用：

const res = await sendAsync('myCustomApi', { foo: 'bar' });

License

MIT