更新记录

1.0.0（2026-03-27） 下载此版本

• 初始版本发布
• 实现了身份证相机引导界面。
• 支持身份证正反面（人像面/国徽面）模式。
• 实现了拍照后自动基于 Canvas 的图片裁剪功能。
• 支持 uni_modules 规范，一键安装。
• 提供简单的 uni.$on 回调接口，方便集成。

平台兼容性

uni-app(4.55)

其他

camera-idcard 身份证相机插件

一个专为 uniapp 开发的身份证拍摄插件，支持小程序端。插件提供一个专门的相机页面，带有身份证轮廓引导，并支持拍照后自动根据引导框进行图片裁剪。

功能特点

• 双重调用：支持作为“组件”嵌入页面，或直接作为“页面”跳转使用。
• 轮廓引导：提供身份证大小的引导框，支持“人像面”和“国徽面”两种模式。
• 自动裁剪：拍照后自动根据引导框位置进行裁剪，减少后端处理压力。
• 简单易用：通过 uni.$on 监听或组件事件回调，集成简单。

安装方式

本插件符合 uni_modules 规范。在 HBuilderX 中，直接将 camera-idcard 目录复制到项目的 uni_modules 目录下即可。

使用说明

方式一：作为页面跳转 (推荐)

在项目的 pages.json 中注册插件页面：

{
  "pages": [
    {
      "path": "uni_modules/camera-idcard/pages/camera",
      "style": {
        "navigationBarTitleText": "身份证相机",
        "navigationStyle": "custom"
      }
    }
  ]
}

跳转并监听结果：

// 跳转
uni.navigateTo({
  url: '/uni_modules/camera-idcard/pages/camera?type=idFront'
});

// 监听
onLoad() {
  uni.$on('camera-finished', (data) => {
    console.log('图片路径:', data.tempImagePath);
  });
}

方式二：作为组件嵌入

直接在页面中使用 <camera-idcard> 组件：

<template>
  <view>
    <camera-idcard 
      type="idFront" 
      @finish="handleFinish" 
      @back="handleBack"
    ></camera-idcard>
  </view>
</template>

<script>
export default {
  methods: {
    handleFinish(data) {
      console.log('拍照完成:', data.tempImagePath);
    },
    handleBack() {
      console.log('用户取消');
    }
  }
}
</script>

注意事项

1. 权限请求：本插件依赖相机权限，请确保在 manifest.json 中配置了相应的相机权限声明。
2. 压缩包根目录说明：如果您手动打包上传插件市场，请确保压缩包的根目录直接包含 package.json、components/ 和 pages/。不要包含多层文件夹。建议在 HBuilderX 中右键插件目录选择“发布到插件市场”以自动处理打包。

联系作者

如有问题，请在插件市场留言。