在HBuilder中调用HTML5 Plus原生能力需先监听plusready事件确保环境就绪,再分别通过plus.barcode、plus.camera、plus.gallery、plus.geolocation模块调用扫码、拍照、相册、定位功能,并按平台要求配置权限与路径处理。

如果您在HBuilder中开发HTML5 Plus应用,需要调用设备原生能力(如扫码、拍照、相册、定位等),必须通过HTML5 Plus提供的标准JS API进行调用。以下是具体调用方法:
一、确认plus环境已就绪
HTML5 Plus API依赖于运行时plus对象,该对象仅在5+ Runtime环境中存在。需先确保plus对象可用,避免因环境未加载导致调用失败。
1、使用document.addEventListener监听plusready事件,该事件表示HTML5 Plus运行环境初始化完成。
2、在plusready回调中执行后续API调用,不可在页面加载初期直接调用plus.*接口。
立即学习“前端免费学习笔记(深入)”;
3、若plus对象不存在或plusready未触发,所有plus.camera、plus.barcode、plus.gallery等调用均会静默失败或抛出ReferenceError。
二、调用扫码功能
扫码功能由plus.barcode模块提供,支持一维码与二维码识别,需先获取扫描控件并启动扫描界面。
1、调用plus.barcode.getBarcode()获取可用的扫码类型列表。
2、创建plus.barcode.Barcode对象,传入DOM容器ID(如
)用于显示扫描框。3、调用barcode.start()启动扫描,成功后触发onmarked回调,返回result字段中的编码内容。
4、注意:Android平台需在manifest.json中勾选“Barcode”权限;iOS需在uni-app或5+项目中配置NSCameraUsageDescription描述。
三、调用拍照功能
拍照功能由plus.camera模块提供,支持直接调起系统相机拍摄并返回图像信息,不经过相册中间环节。
1、调用plus.camera.getCamera()获取默认后置摄像头对象。
2、调用camera.captureImage()启动拍照,支持指定目标文件路径和压缩质量参数。
3、成功后返回本地绝对路径(如/_www/image.jpg或/data/user/0/io.dcloud.xxx/cache/xxx.jpg)。
4、返回路径为原生文件系统路径,不能直接作为img src使用,需通过plus.io.resolveLocalFileSystemURL转换为Web可读URL。
四、调用相册选择图片
从手机相册选取图片由plus.gallery模块实现,适用于用户主动选择已有图片的场景。
1、调用plus.gallery.pick()打开相册选择界面,支持设置maxCount、mode(image/video)、system(是否仅系统相册)等参数。
2、成功后返回files数组,每个元素含originalPath(原始路径)和path(缩略图路径)。
3、调用plus.io.resolveLocalFileSystemURL处理originalPath,再通过file.file()读取Blob或生成Object URL供img标签使用。
4、Android 10+需注意Scoped Storage限制,originalPath可能不可直接访问,建议优先使用path字段或启用android:requestLegacyExternalStorage="true"。
五、调用定位功能
定位能力由plus.geolocation模块提供,支持GPS、基站、WiFi等多种方式混合定位。
1、调用plus.geolocation.getCurrentPosition()获取单次定位结果,需传入success、fail回调及options(如enableHighAccuracy、timeout)。
2、调用plus.geolocation.watchPosition()开启持续定位监听,返回watchID用于后续clearWatch。
3、Android需在manifest.json中声明ACCESS_FINE_LOCATION和ACCESS_COARSE_LOCATION权限;iOS需配置NSLocationWhenInUseUsageDescription。











