技能：微信电子健康卡对接

描述: 在 UniApp 中集成微信官方电子健康卡插件的完整指南。

1. 前置条件

平台: 仅限微信小程序 (mp-weixin)。不支持 App 或 H5 端直接使用。
账号: 必须先在微信公众平台申请开通插件。
- 路径: 登录微信公众平台 → 小程序 → 插件管理 → 添加插件 → 搜索 "电子健康卡" 并申请。

2. 配置 (Manifest)

文件: manifest.json 操作: 在 mp-weixin 节点下添加插件声明。

"mp-weixin": {
  "appid": "你的小程序appid",
  "plugins": {
    "healthCard": {
      "version": "1.x.x",   // 请以微信后台显示的最新版本号为准
      "provider": "wxe5f52902cf4de896"  // 电子健康卡插件官方原始 ID
    }
  }
}

3. 实现 - 嵌入插件组件 (场景A)

适用场景: 插件提供了一个组件 (Component)，你需要将其嵌入到自己的页面中显示。

步骤 1: 在 pages.json 中注册组件找到你需要引入插件的页面配置，添加 usingComponents 节点：

// pages.json
{
  "pages": [
    {
      "path": "pages/health-card/index",
      "style": {
        "navigationBarTitleText": "健康卡",
        "usingComponents": {
          // 定义组件名: 插件协议://插件名/组件路径
          "health-card-comp": "plugin://healthCard/healthCardQueryComp"
        }
      }
    }
  ]
}

步骤 2: 在页面中直接使用组件

<template>
  <view class="container">
    <!-- 直接使用 pages.json 中注册的标签名 -->
    <health-card-comp
      @success="onSuccess"
      @fail="onFail"
    />
  </view>
</template>

<script setup lang="ts">
const onSuccess = (e: any) => {
  console.log('组件回调成功', e.detail);
};

const onFail = (e: any) => {
  console.error('组件回调失败', e.detail);
};
</script>

4. 实现 - 跳转插件页面 (场景B)

适用场景: 插件提供了一个完整的页面 (Page)，你需要从当前小程序跳转过去。

代码:

// 使用 plugin:// 协议直接跳转
// 格式: plugin://插件名/页面路径
uni.navigateTo({
  url: 'plugin://healthCard/index', 
  success: () => {
    console.log('跳转插件页面成功');
  },
  fail: (err) => {
    console.error('跳转失败', err);
  }
});

提示: 具体的 组件路径 (如 healthCardQueryComp) 和 页面路径 (如 index) 必须查阅该插件的官方文档，不同插件提供商的路径定义不同。

5. 调试与发布

调试: 在 HBuilderX 中运行到「微信开发者工具」，确保控制台无报错。
发布: 体验版测试通过后，提交微信审核并发布。
注意: 确保 manifest.json 中的插件版本号与微信后台可用的版本一致。

6. 注意事项

多端兼容性: 该方案仅适用于微信小程序端。
- App 端: 无法直接嵌入插件。必须通过 SDK (如 launchMiniProgram) 唤起微信 App 打开电子健康卡小程序。
- H5 端: 不支持。
文档更新: 插件的 version (版本号)、provider (插件ID) 和 pluginPage (页面路径) 可能会随官方更新而变化，请始终以微信官方文档为准。

WECHAT_HEALTH_CARD_SKILLS.md 3.2 KB Permalink History Raw