- 部分用户偶发request: fail -101:net::ERR_CONNECTION_REST?
调用微信请求 wx.request 部分Android用户偶发request: fail -101:net::ERR_CONNECTION_REST? 部分ios用户出现"request:fail 发生了 SSL 错误,无法建立与该服务器的安全连接。" 多试几次刷新几次请求就可以正常调用,不报错,但是刚开始几次就会出现这个问题,不清楚是为什么,请问一下需要怎么排查解决
2021-10-14 - 关于小程序 扫描二维码跳转到体验版的尝试与成果
背景: 由于公司小程序经常有生成产品海报的功能,但是生成的小程序码微信扫码之后进的是正式版,如需要调试,就只能通过微信开发者工具,还需要源码在本地编译,对于测试来说十分麻烦,于是就开始思考,有什么方法可以解决。 [图片] 探索: 首先肯定是各种谷歌,得到的结果就是,各种不支持,但是这个需求还是有的,很多人都遇到了测试不便的问题,基本都是通过微信开发者工具来解决的, 但是,我还是不死心,既然没有轮子,那我就造一个! [图片] [图片] [图片] 造轮子: 开始分析需求,我需要扫码进入对应版本的小程序,那也不一定非要用微信的扫一扫,小程序本身也有扫一扫的api呀,既然这样需要实验一下, 小程序调用相机扫一扫是否可以扫描小程序码,能拿到什么! 搞起。。 [图片] 在原先的小程序项目里写一个单独的页面,通过调用 wx.scanCode(Object object) 方法,打开相机,扫小程序码,成功获取页面链接,激动! [图片] 下一步就是跳转一下的事了。最终的核心代码就这一段话。实现了用体验版小程序,扫生成的小程序码,进入对应页面的功能,测试小妹妹开心的不行。 这个只能打开自己所在的小程序码 // 允许从相机和相册扫码 wx.scanCode({ success (res) { console.log(res) wx.navigateTo({url: '/' +res.path}) } }) [图片]
2020-01-07 - [开盖即食]小程序Canvas官方新版API实战
[图片] [图片] 最近本人在开发一个新项目的时候,注意到官方在2.9.0开始支持了一个canvas 2D的新API,同时对webGL上支持也有了很大的改进,相信很多人用canvas的组件做一些分享海报,战绩和新闻帖功能。 [图片] 这里是新的引入方式。 官方文档地址: https://developers.weixin.qq.com/miniprogram/dev/component/canvas.html 那么新的canvas2D API有啥好处呢? 原本的API微信有做一定的修改,现在全面支持源生H5 JS的写法,迁移H5的老代码变成更加容易,学习成本更低 修复了一些诡异的BUG,例如原本在IOS早期版本写法顺序会导致clip()图片裁切失效等~ 性能上的优化和提升,复杂动画上帧数明显 举例写法上的一些改变: 1、设置font的写法: [代码]//原本(传值的写法) ctx.setFontSize(20); ctx.fillText('MINA', 100, 100) ctx.draw() //现在(和源生H5写法一致,赋值) ctx.font = "16px"; ctx.fillStyle = 'blue'; //可以直接写颜色,原本的不支持 //不需要 ctx.draw() [代码] 2、获取并添加图片写法: [代码]//原本 //使用的是 wx.getImageInfo的方法 wx.getImageInfo({ src: mainImg,//服务器返回的图片地址 success: function (res) { console.log(res); ctx.drawImage(res.path, 0, 0); ctx.draw(true); }, fail: function (res) { //失败回调 } }); //现在 //可以直接img.onload调用 const headerImg = canvas.createImage(); headerImg.src = headImage;//微信请求返回头像 headerImg.onload = () => { ctx.save(); ctx.beginPath()//开始创建一个路径 ctx.arc(38, 288, 18, 0, 2 * Math.PI, false)//画一个圆形裁剪区域 ctx.clip()//裁剪 ctx.drawImage(headerImg,0,0); ctx.closePath(); ctx.restore(); } [代码] 3、将canvas生成虚拟地址便于下载(重点): [图片] 由于官方文档没有写清楚,误导了挺多人的。这里canvas对象必须通过选择器获取,并获得对应的node节点。 [代码]async saveImg() { let self = this; //这里是重点 新版本的type 2d 获取方法 const query = wx.createSelectorQuery(); const canvasObj = await new Promise((resolve, reject) => { query.select('#posterCanvas') .fields({ node: true, size: true }) .exec(async (res) => { resolve(res[0].node); }) }); console.log(canvasObj); wx.canvasToTempFilePath({ //fileType: 'jpg', //canvasId: 'posterCanvas', //之前的写法 canvas: canvasObj, //现在的写法 success: (res) => { console.log(res); self.setData({ canClose: true }); //保存图片 wx.saveImageToPhotosAlbum({ filePath: res.tempFilePath, success: function (data) { wx.showToast({ title: '已保存到相册', icon: 'success', duration: 2000 }) // setTimeout(() => { // self.setData({show: false}) // }, 6000); }, fail: function (err) { console.log(err); if (err.errMsg === "saveImageToPhotosAlbum:fail auth deny") { console.log("当初用户拒绝,再次发起授权") } else { util.showToast("请截屏保存分享"); } }, complete(res) { wx.hideLoading(); console.log(res); } }) }, fail(res) { console.log(res); } }, this) }, [代码] 分享个canvas海报的代码片段: [图片] 片段名: PoCf4emw7TgE 片段link: https://developers.weixin.qq.com/s/PoCf4emw7TgE [图片] [图片] 总结,相对之前还要看官方文档的canvas自定义API,现在写起来更加的方便,老代码迁移起来得心应手,只要你之前会canvas,那么各种效果和动画,拿来就怼,没什么大问题~ 一些奇怪的问题(注意!!!) canvas 2d 目前(2020年4月3日)还不支持真机调试,会报错!!! IDE工具 1.02.2003190 直接保存新版本canvas的API图片是打不开的,但是直接用手机保存在相册是没问题的,请更新到1.02.2003250 最新版即可解决~ 一些老款手机用新的API保存图片会有报错问题,如华为NOTE10,请更新系统到能支持的最新,且微信也是,即可解决~ 部分Android设备诡异的闪退和报错 [图片] 这种有可能是代码写法的问题,比如: [代码]//缺省写法 会导致部分Android机器 闪退 ctx.font = "bold 16px"; ctx.fillStyle = "#000" //在canvas 2D的写法中,所以写法必须规范且完整 ctx.font = "normal bold 12px sans-serif"; ctx.fillStyle = '#707070'; [代码] 所以在canvas 2D 的环境,所以写法必须原始且规范,不能用缺省写法,不然就会有诡异的闪退/报错。 后续:官方在7.0.13的Android版本已修复。 https://developers.weixin.qq.com/community/develop/doc/00088c13e1437890692afd8d85ec00 看完觉得有帮助记得点个赞哦~ 你的赞是我继续分享的最大动力!^-^
2020-05-09 - 小程序分享朋友圈能不能跳转指定页面?
在A页面有一个分享朋友圈功能,填写的query 路径跳转的是B页面,但是从朋友圈点击进入的还是A页面,可以做到跳转指定页面吗?
2020-08-19