在动画运行的时候，退出页面，所有lottie动画就卡主了 再也不会动了。只能初始化但是不能动。也无报错。

https://developers.weixin.qq.com/s/qgG4ZamU7Ku6 这个官方示例，如果用华为p30 pro或者小米11 会出现左上角毛玻璃的现象。[图片]

最近做了关于小程序下WebGL截图的项目，遇到一些坑，记录下。 安卓切换页面后返回，再一次获取像素为空 IOS偶尔获取到的为空白图像 获取到的数据绘制出来后上下颠倒 翻THREE.JS的代码，发现正确的截图方法 https://github.com/mrdoob/three.js/blob/master/src/renderers/WebGLRenderer.js#L1903 [代码]if ( _gl.checkFramebufferStatus( _gl.FRAMEBUFFER ) === _gl.FRAMEBUFFER_COMPLETE ) { // the following if statement ensures valid read requests (no out-of-bounds pixels, see #8604) if ( ( x >= 0 && x <= ( renderTarget.width - width ) ) && ( y >= 0 && y <= ( renderTarget.height - height ) ) ) { _gl.readPixels( x, y, width, height, utils.convert( textureFormat ), utils.convert( textureType ), buffer ); } } else { console.error( 'THREE.WebGLRenderer.readRenderTargetPixels: readPixels from renderTarget failed. Framebuffer not complete.' ); } [代码] 所以解决方法 [代码]// 在渲染循环里检测checkFramebufferStatus状态，完成后再读取像素 const render = () => { if (this.disposing) return requestAnimationFrame(render); demo.update() renderer.render(scene, camera); if (this.screenshotResolve) { // @ts-ignore 参考 Threejs WebGLRenderer.readRenderTargetPixels if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) === gl.FRAMEBUFFER_COMPLETE) { // @ts-ignore gl.readPixels(0, 0, frameBuffer.x, frameBuffer.y, gl.RGBA, gl.UNSIGNED_BYTE, pixelData); // 翻转Y轴 flip(pixelData, frameBuffer.x, frameBuffer.y, 4); // 确保有像素，微信小程序安卓在进入子页面返回本页面后，再一次readPixels稳定无像素 if (pixelData.some(i => i !== 0)) { this.screenshotResolve([pixelData, frameBuffer.x, frameBuffer.y]) this.screenshotResolve = null as unknown as Function; } } } } [代码] 具体可阅读代码片段 https://developers.weixin.qq.com/s/syS4xzmw7AnO

canvasToTempFilePath 的坑太多了，不同环境有不同的坑，不同版本的canvas接口有不同的坑，为了彻底解决这些问题最好的方法就是不用它。 直接用toDataURL获取base64图像数据，然后再写入临时文件即可 [代码]// 获取base64图像 const b64Data = this.ctx.canvas.toDataURL() const time = new Date().getTime(); const filePath = `${uni.env.USER_DATA_PATH}/temp_image_${time}.png` // base64格式的图片要去除逗号前面的部分才能正确解码 const buffer = uni.base64ToArrayBuffer(b64Data.substring(b64Data.indexOf(',') + 1)) // 写入临时文件 uni.getFileSystemManager().writeFile({ filePath, data: buffer, encoding: 'utf8', success: res => { console.log('保存图片：', filePath) } }) [代码]

点击在“开发者工具中预览效果”字段后。进入的页面显示“请打开工具手动导入，若未安装可点击下载”，当前工具是打开的，要怎么样操作才可以把官方的demo导入工具预览效果，在线等

本文适合小白交流，大佬勿喷。把自己遇到的坑，小白解决方案贴出来交流。 坑1：微信跳转与H5跳转，跳转的路径不是一样的。 跟我一样粗心伙伴注意了 官方说明：网页会判断所在的环境来觉得采用哪种跳转方式，如检测到微信客户端内，则免鉴权使用开放标签跳转，如检测到在外部浏览器或 App，则使用 URL Scheme 跳转小程序。区别在于在html代码里面的属于标签跳转，URL Scheme跳转是在云函数里面的。主要问题是没看清文档及不熟悉云开发，以为前台代码的path就是所有跳转的url。html的path=xxx 仅指的是当在微信H5情况下跳转的路径（可带参数） <wx-open-launch-weapp id="launch-btn" username="小程序原始账号 ID（gh_ 开头的）" path="要跳转到的页面路径"> <!-- replace --> <template> <button style="width: 200px; height: 45px; text-align: center; font-size: 17px; display: block; margin: 0 auto; padding: 8px 24px; border: none; border-radius: 4px; background-color: #07c160; color:#fff;">打开小程序</button> </template> </wx-open-launch-weapp> 如果想在其他浏览器（非微信H5上做跳转，跳转的路径及参数需要在云函数写） async function getUrlScheme(options) { return cloud.openapi.urlscheme.generate({ jumpWxa: { path: '/page/component/index', // <!-- replace --> query: 'i=aaabbb', }, // 如果想不过期则置为 false，并可以存到数据库 isExpire: true, // 一分钟有效期 expireTime: parseInt(Date.now() / 1000 + 60 其中path是路径，不能带参数(不太确定)，简约如果有参数则写在query里面去，例如 query：'openid=developers' 这样的话微信跳转的路径其实可以与H5跳转路径不一样都没问题，第一个坑解决了。 坑2：哪怕按照上面写了，还是微信能跳，H5不能跳，云函数一直无法上传。 我也查了社区很多贴，没有一个好的解决方案，这个坑主要问题是在基础没有打好的问题，我想部分人应该也是刚接触云开发不久，都是用到这个开发能力才去接触这个开发能力 解决方案： 官方在云函数的地方，告诉我们需要新建一个云函数名字为public，在这个目录下面创建一个js。但是因为这个要用到wx-server-sdk。 打开命令行，定位到public，安装一下所需要的环境，云函数中使用 wx-server-sdk 需在对应云函数目录下安装 wx-server-sdk 依赖（自己理解） npm install --save wx-server-sdk@latesty 这个安装上去的了，你的public目录下就会多一个node_modules目录，云端安装就不说了，这里我是直接全部上传的。 安装好后，上传代码后，基本上H5就可以跳转到浏览器了。（如果你的还行不行，检查一下权限，还有报错，可能还需要按照node_sdk） 【如果还是不行，可以回复本帖，尝试帮忙排查解决】 坑3：路径后自定义传参问题？参数是动态的问题。 因为自己对云函数认识不足，所以用了自己的解决方案。 我当时项目的需求是，动态传参，每个参数都是不一样，如果按官方的文档是固定路径的 我是获取当前h5的url参数，提取自己要的参数出来。然后拼接到 path里面去。拼接的方法有很多，当时为了速度快点就用了最白痴的方法。 需要注意，微信的跳转与h5跳转写法不一样。 //获取url的参数 function getQueryVariable(variable) {    var query = window.location.search.substring(1);    var vars = query.split("&");    for (var i=0;i<vars.length;i++) {    var pair = vars[i].split("=");    if(pair[0] == variable){return pair[1];}    }    return(false); } //如果你的url是 qq.com/i=88888 ，则getQueryVariable("i") 就是取i的值：88888 var i = getQueryVariable("i"); 微信H5的自定义参数跳转 我把官方的这个代码 <wx-open-launch-weapp id="launch-btn" username="小程序原始账号 ID（gh_ 开头的）" path="要跳转到的页面路径"> <!-- replace --> <template> <button>打开小程序</button> </template> </wx-open-launch-weapp> 改成了（大佬别吐槽，当时为了实现功能） <script type="text/javascript"> document.write("<wx-open-launch-weapp id='launch-btn' username='' path='pages/index/index?i="+i+"'>"); </script>  <template> <button>打开小程序</button> </template> </wx-open-launch-weapp> 其他H5的自定义参数跳转 把代码拉到最下面去，他是通过这个来执行云函数的，然后拿到回传的信息的链接，最后直接js跳转到该链接。  async function openWeapp(onBeforeJump) {     var c = window.c     const res = await c.callFunction({       name: 'public',       data: {         action: 'getUrlScheme',       },     })     console.warn(res)     if (onBeforeJump) {       onBeforeJump()     } location.href = res.result.openlink 所以我们可以把我们的值也传过去。我在data里面加了一个action1  async function openWeapp(onBeforeJump) {     var c = window.c     const res = await c.callFunction({       name: 'public',       data: {         action: 'getUrlScheme', action1: 'i='+i,       },     }) // console.log(i,"8888")     console.warn(res)     if (onBeforeJump) {       onBeforeJump()     } location.href = res.result.openlink 云函数那边我没有用原本那个方法，而是直接改了原本的。（可以按照自己思路来） 最终我的云函数代码就是 // 云函数入口文件 const cloud = require('wx-server-sdk') cloud.init() // 云函数入口函数 exports.main = async (event, context) => {   const wxContext = cloud.getWXContext()   try {     const result = await cloud.openapi.urlscheme.generate({         "jumpWxa": {           "path": 'pages/index/index',           "query": event.action1         },         "isExpire": false,         "expireTime": parseInt(Date.now() / 1000 + 60)       })     return result   } catch (err) {     return err   } } 最后可以实现根据自定义传参到url，h5、微信h5都能自动跳转到微信小程序。 以此文提示自己需努力补前端基础，细心阅开发文档。

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写死在小程序代码中

- Bug 微信后台数据截图： [图片] 我们自己后台的统计： 累计注册用户数：9281 （累计到2017-01-07 15:04） 每日新增用户数 [图片] - 预期表现 我们计算是在玩家打开游戏后（载入100%，到游戏的主页后就算是打开游戏了，此时前端通过wx.login()得到临时登录凭证code，后端通过code取得openid），若数据库无该玩家，就算是新用户，则该日新用户数+1，并往数据库加入该玩家 微信后台的数据比我们的要多 - 复现路径 如果有需要请直接联系我、 现在想知道微信后台统计的“新增注册用户数”，指的是哪种用户？