- 小程序可以打开浏览器嘛 带链接跳转
小程序可以打开浏览器嘛 带链接跳转
2019-07-25 - 微信小游戏能否支持unity3d?
如果是需求: * 你希望有什么能力? 1、希望小游戏对程序包的大小可以放宽至10M左右,因为即使是空场景,其导出为web gl包后也是5M以上; 2、提供微信小程序支持Unity3d for WebGL的工具。 * 你需要这个能力的场景是 ? 1、我需要在小游戏里使用VR/AR功能。 如此一来,原本u3d的开发者或者项目要迁移到微信小程序上的成本将大大降低。
2018-01-04 - 微信小程序AR解决方案
EasyAR 小程序AR帮助您迅速在微信小程序中实现扫描识别图呈现3D动画模型、视频、图片、文字、UI按钮等效果,并且支持3D模型交互。区别于原生 AR 应用,具有模式轻、部署快、传播性强等特点。 EasyAR WebAR 微信小程序 快速入门一、开发前准备登录小程序后台,在【设置-开发设置-开发者ID】中,获取AppID,如下图:[图片][图片]登录 EasyAR 官网购买WebAR云识别图库,并获取Cloud Key和Token:在“云识别管理”进入云识别图库的管理页面,获取Cloud Key[图片]在“API KEY”进入API KEY的管理页面,获取Token。如有有效期需求选择有效期后生成Token[图片]二、开发步骤1. wxml文件中添加camera和canvas组件。camera组件用于展示相机内容和获取相机帧,canvas组件用于图片压缩。 2. 初始化camera和canvas const query = wx.createSelectorQuery(); query.select('#capture') .fields({node: true}) .exec((res) => { const canvas = res[0].node; //设置canvas内部尺寸为480*640,frame-size="medium"的设置下相机帧大多是480*640 canvas.width = 480; canvas.height = 640; this.canvas = canvas; }); let cameraContext = wx.createCameraContext(); let listener = cameraContext.onCameraFrame(frame => { if (!this.canvas) return; let canvas = this.canvas; //如果尺寸不匹配,就修改canvas尺寸以适应相机帧 if (canvas.width !== frame.width || canvas.height !== frame.height) { canvas.width = frame.width; canvas.height = frame.height; } //TODO 在这里保存frame对象,以便在需要的时候进行下一步压缩图片、发起CRS请求。不要在onCameraFrame回调中直接处理。 }); listener.start(); 3. 压缩图片为JPEG(在需要发起一次CRS请求时进行第3、4步,比如用户主动触发一次识别时,或者已经开始识别循环时。不要在onCameraFrame回调中直接发起) let context = this.canvas.getContext('2d'); let ctxImageData = context.createImageData(frame.width, frame.height); ctxImageData.data.set(new Uint8ClampedArray(frame.data)); //复制相机帧内容到imageData context.putImageData(ctxImageData, 0, 0); //将imageData画到canvas上 let dataUrl = this.canvas.toDataURL("image/jpeg", 0.7); //使用toDataURL方法将相机帧压缩为JPEG,质量70% let base64 = dataUrl.substr(23); //去除dataURL头,留下文件内容的base64 4. 组装请求参数,发起CRS请求 const params = { image: base64, notracking: "true", appId: "开发前准备中的 Cloud Key", }; return new Promise((resolve, reject) => { wx.request({ url: "https://cn1-crs.easyar.com:8443/search/", method: 'post', data: params, header: { 'Authorization': "开发前准备中的 Token", 'content-type': 'application/json' }, success: res => resolve(res.data), //处理方法见下 fail: err => reject(err), }); }); 5. 处理请求结果 queryImage(frame).then(response => { //response为上面的res.data let result = response && response.result; if (!result) return; if (result.target) { console.log("识别成功", result.target.targetId); //小程序可以根据targetId获知识别到了哪一张图,进而进行判断或触发事件等,也可以对每张图配置meta信息,根据meta信息来进行操作 if (result.target.meta) { //读取识别图meta的base64(meta在上传识别图时配置) console.log("meta base64:", result.target.meta); } } else { console.log("识别失败", result.message); } }); 三、后续工作完整示例: 点击查看将 https://cn1-crs.easyar.com:8443/ 加入小程序域名白名单的request部分在图库中添加识别图根据实际需求处理CRS请求的内容,如展示图片、视频、3D模型等可以通过自建服务器,在服务器端 调用接口 的方式获取Token,发送给小程序端使用,而不是将Token写死在小程序代码中
2021-01-05