微信小程序开发说明

一、简介

在微信小程序开发WebAR。

技术支持QQ群:722979533

二、实现流程

1. wxml文件中增加 camera 与 canvas

<camera frame-size="medium" bindinitdone="cameraInitDone" mode="normal"
device-position="back" resolution="medium" flash="off" />

<canvas type="2d" id="canvas" style="width:1px; height: 1px;" />

2. js文件中导入WebAr SDK

import { WebAr } from "../../utils/WebAr";

3. 设置认证token等

const CONFIG = {
    token: '认证token', // 认证token, 请从开发者中心获取
    endpoint: 'https://iss-api.wujianar.cn',
    quantity: 0.7, // 图片压缩质量, 0~1
    interval: 1000, // 识别间隔(毫秒)
}

4. 在 camera 初始化完成事件中设置WebAr

this.webAr = new WebAr(CONFIG, res[0].node);

this.webAr.searchCallback(res => {
    // TODO: 识别成功后的回调
});

5. 开启与关闭识别

this.webAr.startSearch();
this.webAr.stopSearch();

6. 微信小程序示例下载

示例下载: https://gitee.com/wujianar/mini-webar
小程序WebAR相册: https://gitee.com/wujianar/mini-webar-album