{"_id":"@cordova-ohos/cordova-plugin-camera-preview","_rev":"5-40a37643702a1e53abe67fb32b8035ca","name":"@cordova-ohos/cordova-plugin-camera-preview","dist-tags":{"latest":"0.14.1"},"versions":{"0.14.0":{"name":"@cordova-ohos/cordova-plugin-camera-preview","version":"0.14.0","keywords":["cordova","camera","ecosystem:cordova","cordova-openharmony"],"author":{"name":"Huawei Device, Inc. Ltd. and","email":"马弓手"},"license":"Apache-2.0","_id":"@cordova-ohos/cordova-plugin-camera-preview@0.14.0","maintainers":[{"name":"luqi_tan","email":"295099422@qq.com"}],"bugs":{"url":"https://gitcode.com/OpenHarmony-Cordova/cordova-plugin-camera-preview/issues"},"dist":{"shasum":"e121be1d3cb19fdd7d571f5873a6fc91bbba10b3","tarball":"https://registry.npmjs.org/@cordova-ohos/cordova-plugin-camera-preview/-/cordova-plugin-camera-preview-0.14.0.tgz","fileCount":10,"integrity":"sha512-Q/VhCq96OZaP3E2jsx11P/bSL/cBjtL+flHQFc/KVyPMnRYXwigVUUy+slX675dmZPLDs2B8XvyYb56/X/D6sQ==","signatures":[{"sig":"MEQCIBT61GvjyxUqidPtezB30UJbgaof09v1nm5r0fOyFzKSAiAA94KMXuau48UIXaf8Wl2M2NBpP9qHIAl+qr7yzo0lsg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":55636},"cordova":{"id":"cordova-plugin-camera-preview","platforms":["ohos"]},"engines":{"cordovaDependencies":{"0.14.0":{"hcordova":">=1.0.0","@cordova-ohos/ohos":">=2.0.0"}}},"gitHead":"a0017f521536907687d5091d6348b867c00095f6","_npmUser":{"name":"luqi_tan","email":"295099422@qq.com"},"repository":{"url":"gitcode:OpenHarmony-Cordova/cordova-plugin-camera-preview","type":"git"},"_npmVersion":"10.5.1","description":"Cordova camera Plugin","directories":{},"_nodeVersion":"22.0.0","_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/cordova-plugin-camera-preview_0.14.0_1773928607599_0.5878992802551908","host":"s3://npm-registry-packages-npm-production"}},"0.14.1":{"name":"@cordova-ohos/cordova-plugin-camera-preview","version":"0.14.1","description":"Cordova camera Plugin","cordova":{"id":"cordova-plugin-camera-preview","platforms":["ohos"]},"repository":{"type":"git","url":"gitcode:CPF-Cordova/cordova-plugin-camera-preview"},"bugs":{"url":"https://gitcode.com/CPF-Cordova/cordova-plugin-camera-preview/issues"},"keywords":["cordova","camera","ecosystem:cordova","cordova-openharmony"],"engines":{"cordovaDependencies":{"0.14.1":{"@cordova-ohos/ohos":">=2.0.0","hcordova":">=1.0.0"}}},"author":{"name":"Huawei Device, Inc. Ltd. and","email":"马弓手"},"license":"Apache-2.0","_id":"@cordova-ohos/cordova-plugin-camera-preview@0.14.1","gitHead":"21c875f6e7f555956c8321ba1b26457c5d4f18cd","_nodeVersion":"22.0.0","_npmVersion":"10.5.1","dist":{"integrity":"sha512-FeajtxWeaTJZpCJPFhqLtnzsV2X2TTRcxhui2gUcymSDrl11B+Fwl2v+tra08cZnn5QBLkCkwvduOxbzhtyi5A==","shasum":"99def7a3afac3acd9a8bc1497a67caad6b0c4cd0","tarball":"https://registry.npmjs.org/@cordova-ohos/cordova-plugin-camera-preview/-/cordova-plugin-camera-preview-0.14.1.tgz","fileCount":11,"unpackedSize":79317,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIBCoSXyaMcCXZL5uXolDY/XOgE97jrz8+mpQPpv0C3riAiAO72+UywzMeLU6RLhvh14Ts9+0ZRynO+w8IxfiBDxr5Q=="}]},"_npmUser":{"name":"luqi_tan","email":"295099422@qq.com"},"directories":{},"maintainers":[{"name":"luqi_tan","email":"295099422@qq.com"},{"name":"wanpengsz","email":"wanpengsz@163.com"},{"name":"xkh111","email":"xukaihui11@163.com"},{"name":"hcordova","email":"chenlihuiabc@163.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/cordova-plugin-camera-preview_0.14.1_1785157423678_0.3336960648594338"},"_hasShrinkwrap":false}},"time":{"created":"2026-03-19T13:56:47.442Z","modified":"2026-07-27T13:03:44.030Z","0.14.0":"2026-03-19T13:56:47.770Z","0.14.1":"2026-07-27T13:03:43.845Z"},"bugs":{"url":"https://gitcode.com/CPF-Cordova/cordova-plugin-camera-preview/issues"},"author":{"name":"Huawei Device, Inc. Ltd. and","email":"马弓手"},"license":"Apache-2.0","keywords":["cordova","camera","ecosystem:cordova","cordova-openharmony"],"repository":{"type":"git","url":"gitcode:CPF-Cordova/cordova-plugin-camera-preview"},"description":"Cordova camera Plugin","maintainers":[{"name":"luqi_tan","email":"295099422@qq.com"},{"name":"wanpengsz","email":"wanpengsz@163.com"},{"name":"xkh111","email":"xukaihui11@163.com"},{"name":"hcordova","email":"chenlihuiabc@163.com"}],"readme":"# <center>cordova-plugin-camera-preview</center>\r\n\r\n[![zh-CN](https://img.shields.io/badge/lang-中文-blue.svg)](README.md)\r\n[![en](https://img.shields.io/badge/lang-English-blue.svg)](README.en.md)\r\n\r\n本项目基于 [cordova-plugin-camera-preview@0.14.0](https://www.npmjs.com/package/cordova-plugin-camera-preview/v/0.14.0) 开发，本文档重点阐述其在 OpenHarmony（OHOS）系统中的具体应用。\r\n\r\n- [cordova-plugin-camera-preview](#cordova-plugin-camera-preview)\r\n  - [插件简介](#插件简介)\r\n  - [核心优势](#核心优势)\r\n  - [支持平台](#支持平台)\r\n  - [安装与卸载](#安装与卸载)\r\n    - [安装步骤](#安装步骤)\r\n    - [从 npm 安装（推荐）](#从-npm-安装推荐)\r\n    - [指定平台安装 ohos](#指定平台安装-ohos)\r\n    - [从 GitCode 仓库安装](#从-gitcode-仓库安装)\r\n    - [安装指定版本](#安装指定版本)\r\n    - [离线安装（本地包）](#离线安装本地包)\r\n    - [安装后验证](#安装后验证)\r\n    - [卸载](#卸载)\r\n  - [约束与限制](#约束与限制)\r\n    - [兼容性](#兼容性)\r\n  - [使用示例](#使用示例)\r\n    - [示例 1：调用相机拍照返回 URL](#示例-1调用相机拍照返回-url)\r\n    - [示例 2：调用相机拍照返回 base64 照片数据](#示例-2调用相机拍照返回-base64-照片数据)\r\n    - [示例 3：压缩图片获取缩略图](#示例-3压缩图片获取缩略图)\r\n    - [示例 4：打开相机录视频](#示例-4打开相机录视频)\r\n  - [使用说明](#使用说明)\r\n  - [新增特性](#新增特性)\r\n  - [目录结构](#目录结构)\r\n  - [贡献代码](#贡献代码)\r\n  - [许可证](#许可证)\r\n  - [官方资源](#官方资源)\r\n\r\n## 插件简介\r\n\r\n`cordova-plugin-camera-preview` 是一款功能强大的 Cordova 相机预览插件，提供**实时相机预览、拍照/录像/压缩**等核心能力，在 OHOS 系统中，调用原生相机，原生相机支持闪光灯、前后摄像头切换，焦距调整、美颜、保存到相册功能原生已实现，JS 侧无需手动调用，当前版本 JS 侧主要兼容启动相机、获取照片路径、Uri、压缩功能。\r\n\r\n## 核心优势\r\n\r\n- **全功能相机控制**：支持拍照（静态图片）、录像（短视频）、闪光灯开关、焦距调节、曝光补偿\r\n\r\n- **高度可定制**：自定义预览区域、裁剪比例、拍照质量、视频分辨率，支持前后摄像头切换\r\n\r\n- **跨平台一致性**：统一 Android、iOS 和 OHOS 相机 API 调用，适配不同设备的相机硬件特性\r\n\r\n- **轻量高效**：基于原生相机 API 封装，无冗余依赖，预览帧率稳定\r\n\r\n- **灵活交互**：支持触摸对焦、双击放大、手势缩放，支持相机预览与页面元素交互\r\n\r\n- **安全可靠**：自动处理相机权限申请，提供完善的错误回调和资源释放机制\r\n\r\n## 支持平台\r\n\r\n- **Android**：API 19 及以上（Android 4.4+）\r\n\r\n- **iOS**：10.0 及以上\r\n\r\n- **OHOS**：5.0+\r\n\r\n## 安装与卸载\r\n\r\n### 安装步骤\r\n\r\n通过 hcordova CLI 即可快速安装插件，支持从 npm 仓库或 GitCode 仓库获取。\r\n\r\n### 从 npm 安装（推荐）\r\n\r\n```bash\r\n# 使用 hcordova CLI 安装\r\n# 安装 hcordova 命令化工具\r\nnpm install -g hcordova\r\n\r\n# 全平台安装插件\r\nhcordova plugin add cordova-plugin-camera-preview\r\n```\r\n\r\n### 指定平台安装 ohos\r\n\r\n仅为 OHOS 平台安装插件：\r\n\r\n```bash\r\n# 仅安装到 OHOS 平台\r\nhcordova plugin add cordova-plugin-camera-preview --platform ohos\r\n```\r\n\r\n### 从 GitCode 仓库安装\r\n\r\n仅为 OHOS 平台安装插件：\r\n\r\n```bash\r\n# 仅安装到 OHOS 平台\r\nhcordova plugin add https://gitcode.com/CPF-Cordova/cordova-plugin-camera-preview.git --platform ohos\r\n\r\n# 指定标签/分支安装\r\nhcordova plugin add https://gitcode.com/CPF-Cordova/cordova-plugin-camera-preview.git@develop --platform ohos\r\n```\r\n\r\n### 安装指定版本\r\n\r\n```bash\r\n# 仅安装到 OHOS 平台指定版本\r\nhcordova plugin add cordova-plugin-camera-preview@0.14.0 --platform ohos\r\n```\r\n\r\n### 离线安装（本地包）\r\n\r\n适用于无网络环境，先下载插件包到本地，再执行离线安装：\r\n\r\n```bash\r\n# 下载插件包到本地（示例路径：~/Downloads/cordova-plugin-camera-preview）\r\n# 执行离线安装\r\nhcordova plugin add ~/Downloads/cordova-plugin-camera-preview --platform ohos\r\n```\r\n\r\n### 安装后验证\r\n\r\n安装完成后，可通过以下命令验证插件是否成功添加到项目中：\r\n\r\n```bash\r\n# 查看已安装的插件列表，若包含本插件 ID 则表示插件已成功安装\r\nhcordova plugin list\r\n```\r\n\r\n### 卸载\r\n\r\n```bash\r\n# Cordova CLI 全平台卸载\r\nhcordova plugin remove cordova-plugin-camera-preview\r\n\r\n# 指定平台卸载\r\nhcordova plugin remove cordova-plugin-camera-preview --platform ohos\r\n```\r\n\r\n## 约束与限制\r\n### 兼容性\r\n\r\n支持：\r\n\r\n| 项目 | 版本/信息 |\r\n|-----|--------|\r\n| SDK | API12+ |\r\n| IDE | DevEco Studio: 5.0+ |\r\n| ROM | 5.1+ |\r\n| Emulator | OpenHarmony 6.0+ |\r\n\r\n在以下版本中已测试通过：\r\n\r\n| 项目 | 版本/信息 |\r\n|-----|--------|\r\n| @cordova-ohos/ohos | 14.0.1-ohos-14.0.1 |\r\n| SDK | 5.0.0(12) |\r\n| IDE | DevEco Studio: 6.0.13.200 |\r\n| ROM | 5.1.0.120 SP3 |\r\n| Emulator | OpenHarmony 6.0.1(21) |\r\n\r\n## 使用示例\r\n\r\n以下示例涵盖插件核心功能的完整调用流程，可直接复制到项目中适配使用，需根据实际页面元素 ID 调整相关代码。\r\n\r\n### 示例 1：调用相机拍照返回 URL\r\n\r\n配置相机将拍摄的照片存储为文件，拍摄完成后获取文件 URL，可直接用于页面图片展示。\r\n\r\n```javascript\r\nfunction startCamera1() {\r\n    let options = {\r\n        storeToFile: true, // 设置存储文件\r\n    };\r\n\r\n    CameraPreview.startCamera(options, function(){\r\n        CameraPreview.takePicture({quality:80},function(filePath){\r\n            // 获取文件 url，可以直接在 img 中引用\r\n            document.getElementById(\"imgInfo1\").src = filePath;\r\n        });\r\n    },function(){\r\n        document.getElementById(\"startCamera\").innerHTML = \"初始化失败\";\r\n    });\r\n}\r\n```\r\n\r\n### 示例 2：调用相机拍照返回 base64 照片数据\r\n\r\n配置相机不存储文件，拍摄完成后直接返回 base64 格式照片数据，可直接用于图片渲染。\r\n\r\n```javascript\r\nfunction startCamera2() {\r\n    let options = {\r\n        storeToFile: false,// 设置返回 base64 数据\r\n    };\r\n\r\n    CameraPreview.startCamera(options, function(){\r\n        CameraPreview.takePicture({quality:50}, function(base64PictureData){\r\n            // 直接引用 base64 显示照片\r\n            document.getElementById(\"imgInfo2\").src = 'data:image/jpeg;base64,' +base64PictureData;\r\n        });\r\n    },function(){\r\n        document.getElementById(\"startCamera\").innerHTML = \"初始化失败\";\r\n    });\r\n}\r\n```\r\n\r\n### 示例 3：压缩图片获取缩略图\r\n\r\n拍摄照片并进行压缩处理，获取低质量缩略图的文件 URL，适用于预览、列表展示等场景。\r\n\r\n```javascript\r\nfunction startCamera3() {\r\n    let options = {\r\n        storeToFile: true,// 设置存储文件\r\n    };\r\n\r\n    CameraPreview.startCamera(options, function(){\r\n        // 设置图片质量参数，获取压缩后的图片\r\n        CameraPreview.takeSnapshot({quality:30}, function(filePath){\r\n            // 获取文件 url，可以直接在 img 中引用\r\n            document.getElementById(\"imgInfo3\").src = filePath;\r\n        });\r\n    },function(){\r\n        document.getElementById(\"startCamera\").innerHTML = \"初始化失败\";\r\n    });\r\n}\r\n```\r\n\r\n### 示例 4：打开相机录视频\r\n\r\n启动后置相机进行录像，录像完成后获取视频文件路径，结合播放器实现视频播放功能。\r\n\r\n```javascript\r\n// global_play 变量用于全局控制播放器的播放状态；例如：切换页面时，使用此变量暂停播放器播放\r\nlet global_play = null;\r\nfunction startRecordVideo() {\r\n    // 后置摄像头拍摄视频，打开原生相机，摄像头也可以切换\r\n    const opts = {\r\n        cameraDirection: CameraPreview.CAMERA_DIRECTION.BACK\r\n    }\r\n\r\n    CameraPreview.startRecordVideo(opts, function(filePath){\r\n        // 返回的路径 key 直接 video 可以直接引用播放\r\n        // Aliplayer 为示例用的第三方阿里云播放器库，需用户自行引入\r\n        let player = new Aliplayer({\r\n            id: \"vodId\", // 容器 id\r\n            source: filePath,  // 视频 url 支持互联网可直接访问的视频地址\r\n            autoplay: false,      // 自动播放\r\n            width:\"100%\",       // 播放器宽度\r\n            height:\"200px\",      // 播放器高度\r\n            showBarTime:\"2000\",\r\n            showBuffer:true,\r\n            playsinline:true,\r\n            preload:true,\r\n            \"controlBarVisibility\": \"click\",\r\n            skinLayout: [{\"name\":\"bigPlayButton\",\"align\":\"cc\",\"x\":0,\"y\":0},{\"name\":\"H5Loading\",\"align\":\"cc\"},{\"align\":\"blabs\",\"x\":0,\"y\":0,\"name\":\"controlBar\", \"children\":[{\"align\":\"tlabs\",\"x\":0, \"y\":0,\"name\":\"progress\"},{\"align\":\"tl\",\"x\":15,\"y\":26,\"name\":\"playButton\"},{\"align\":\"tl\", \"x\":10, \"y\":24, \"name\":\"timeDisplay\"},{ \"align\":\"tr\", \"x\":20, \"y\":25, \"name\":\"fullScreenButton\"},{ \"align\":\"tr\", \"x\":20, \"y\":25, \"name\":\"setButton\"},{ \"align\":\"tr\", \"x\":20, \"y\":23, \"name\":\"streamButton\"},{\"align\":\"tr\",\"x\":20,\"y\":25, \"name\":\"volume\"}]}]\r\n        });\r\n\r\n        player.on(\"play\", function() {\r\n            // 监听播放\r\n            global_play = this;\r\n        });\r\n\r\n        player.on(\"requestFullScreen\", function() {\r\n            // 全屏播放监听\r\n        });\r\n\r\n        player.on(\"cancelFullScreen\", function() {\r\n            // 取消全屏播放\r\n        });\r\n        player.play();\r\n    });\r\n}\r\n```\r\n\r\n## 使用说明\r\n\r\n本插件在 OHOS 系统中调用原生相机能力，原生已实现闪光灯开关、前后摄像头切换、焦距调整、美颜、保存到相册等功能，JS 侧无需手动调用，仅需关注核心交互逻辑即可。\r\n\r\n当前版本 JS 侧主要支持以下核心功能，所有 API 均挂载在全局对象 `CameraPreview` 下，使用前需确保 Cordova 设备就绪事件（`deviceready`）已触发，避免 API 调用失败。\r\n\r\n- **相机启动**：通过 `CameraPreview.startCamera()` 方法初始化相机，可配置是否将拍摄内容存储为文件（storeToFile 参数）。\r\n\r\n- **拍照功能**：通过 `CameraPreview.takePicture()` 方法拍摄照片，支持配置照片质量（quality 参数，0-100，数值越高质量越好），可返回文件路径或 base64 数据。\r\n\r\n- **图片压缩**：通过 `CameraPreview.takeSnapshot()` 方法获取压缩后的图片缩略图，通过 quality 参数控制压缩比例，仅支持返回文件路径。\r\n\r\n- **录像功能**：通过 `CameraPreview.startRecordVideo()` 方法启动录像，可配置相机方向（cameraDirection 参数），录像完成后返回视频文件路径，支持直接用于视频播放。\r\n\r\n- **回调机制**：所有 API 均支持成功回调和失败回调，失败回调可获取错误信息，便于问题排查；成功回调可获取拍摄/录像后的文件路径、base64 数据等核心信息。\r\n\r\n## 新增特性\r\n\r\n该插件当前在 OHOS 平台的实现是基于系统相机实现的功能，对于闪光灯、焦距调整等接口基于原生实现，未提供 JS 侧接口。\r\n\r\n## 目录结构\r\n\r\n```\r\ncordova-plugin-camera-preview          # [根目录] 相机预览插件项目根目录\r\n├── src                                # [源码目录] 存放原生平台代码\r\n│   └── main                           # [主目录] 主代码目录\r\n│       ├── cpp                        # [C++ 目录] C++ 原生代码目录\r\n│       │   └── camera                 # [C++ 模块] 相机核心逻辑文件夹\r\n│       │       ├── CameraPreview.cpp  # [C++ 实现] 相机预览功能的 C++ 逻辑实现（打开相机、处理帧数据）\r\n│       │       └── CameraPreview.h    # [C++ 声明] 相机预览功能的 C++ 头文件\r\n│       └── ets                        # [ArkTS 目录] OHOS ArkTS/ETS 代码目录\r\n│           └── components             # [组件目录] 存放 UI 组件\r\n│               └── ImageCompress      # [TS 模块] 图像压缩相关组件文件夹（虽然路径叫 ImageCompress，但文件名为 CameraAction）\r\n│                   └── CameraAction.ets # [ETS 文件] 处理相机动作（如拍照、切换镜头）的 OHOS 组件\r\n├── www                                # [前端目录] 存放 JavaScript 接口文件\r\n│   ├── CameraPreview.js               # [JS 文件] 暴露给前端调用的 JavaScript 接口，负责与原生层通信\r\n│   └── LICENSE                        # [文本] 前端库接口的许可证文件\r\n├── .gitignore                         # [配置] Git 版本控制忽略文件配置\r\n├── LICENSE                            # [文本] 项目根目录的开源许可证文件\r\n├── OAT.xml                            # [配置] OHOS 应用配置文件\r\n├── package.json                       # [配置] NPM 包配置文件\r\n├── plugin.xml                         # [配置] Cordova 插件核心配置文件\r\n└── README.md                          # [文档] 项目说明文档\r\n```\r\n\r\n## 贡献代码\r\n\r\n使用过程中发现任何问题都可以提 [Issue](https://gitcode.com/CPF-Cordova/cordova-plugin-camera-preview/issues) ，当然也非常欢迎发 [PR](https://gitcode.com/CPF-Cordova/cordova-plugin-camera-preview/pulls) 共建。\r\n\r\n## 许可证\r\n\r\n本插件基于 **Apache License** 开源，详见 [LICENSE](LICENSE) 文件。\r\n\r\n## 官方资源\r\n\r\nOHOS Cordova：[https://gitcode.com/CPF-Cordova/cordova-plugin-camera-preview](https://gitcode.com/CPF-Cordova/cordova-plugin-camera-preview)\r\n\r\nAndroid/iOS：[https://npmjs.com/cordova-plugin-camera-preview](https://npmjs.com/cordova-plugin-camera-preview)\r\n","readmeFilename":"README.md"}