如果canvas组件，设置了style.width、height, 需要保持和Canvas实例一样的值；导出尺寸要以Canvas实例尺寸除以桌面端pixelRatio重新计算 const dpr = wx.getSystemInfoSync().pixelRatio; wx.canvasToTempFilePath({width: canvas.width / dpr, height: canvas.height / dpr}) > 问题出在canvas元素和实例大小上，MAC和PC还不一样，元素style和实例width/height设置成一样的，canvasToTempFilePath导出大小按我上面的来
PC端canvas用canvasToTempFilePath生成图片，怎么做才能显示正确？<canvas type="2d" id='posterCanvas' /> 正常显示： [图片] windos显示： [图片] mac显示： [图片]
星期一 21:51如果canvas组件，设置了style.width、height, 需要保持和Canvas实例一样的值；导出尺寸要以Canvas实例尺寸除以桌面端pixelRatio重新计算 const dpr = wx.getSystemInfoSync().pixelRatio; wx.canvasToTempFilePath({width: canvas.width / dpr, height: canvas.height / dpr}) 你上面的代码，试一下给canvas元素设置个width和height, 必须和canvas实例一样，MAC和PC就正常了
PC端canvas2d，scale缩放后wx.canvasToTempFilePath生成图片不对？Canvas2D，根据像素比使用scale缩放后，用wx.canvasToTempFilePath生成图片，在PC端会导致生成的图片不完整。请管理员大大指教！ canvas.width = canvasWidth*this.data.dpr canvas.height = canvasHeight*this.data.dpr ctx.scale(this.data.dpr, this.data.dpr) // 根据像素比放大 1.开发工具和手机端正确：能完整生成全图。 [图片] 2.PC端同样代码，无法生成完整全图。 [图片] 代码片段：https://developers.weixin.qq.com/s/IW9zr9mJ73Pj 主要代码： const app = getApp() const sysInfo = wx.getSystemInfoSync() // 获取设备信息 Page({ data: { dpr: sysInfo.pixelRatio, canvasWidth: 750, canvasHeight: 421.875, // 默认16:9 fileCoverHttpUrl: 'https://jszs.ds.net.cn/api/file7/ccw/temp/2023-07-24/1522147391/3e22c349259b2d9000b8d7c2d93d7314.mp4?ss=0.1', }, onLoad() { }, handleDraw() { const {fileCoverHttpUrl} = this.data; let imagePath = ''; this.createCanvas().then(async () => { const coverImageInfo = await wx.getImageInfo({ src: fileCoverHttpUrl, }) const {path, width, height} = coverImageInfo; imagePath = path; // 临时路径 this.loadImg(imagePath).then(img => { this.drawMedia(img); }) }); }, drawMedia(media) { const {canvas, ctx} = this; const {canvasWidth, canvasHeight} = this.data; console.log('drawMedia', canvasWidth, canvasHeight); canvas.width = canvasWidth*this.data.dpr canvas.height = canvasHeight*this.data.dpr ctx.scale(this.data.dpr, this.data.dpr) // 根据像素比放大 ctx.drawImage(media, 0, 0, canvasWidth, canvasHeight); // 延时生成图片 setTimeout(() => { wx.canvasToTempFilePath({ canvas: canvas, x: 0, y: 0, width: canvasWidth*this.data.dpr, height: canvasHeight*this.data.dpr, destWidth: canvasWidth, // 输出的图片的宽度 destHeight: canvasHeight, success: res => { wx.hideLoading(); this.setData({ showPoster: true, tempShareImg: res.tempFilePath, }); }, fail: () => { wx.showToast({ title: '图片生成失败~', icon: 'none' }); } }) }, 300) }, createCanvas() { return new Promise(resolve => { wx.createSelectorQuery() .select('#canvas') .fields({ node: true, size: true }) .exec((res) => { const {canvasWidth, canvasHeight} = this.data; const canvas = res[0].node; const ctx = canvas.getContext('2d'); canvas.width = canvasWidth; canvas.height = canvasHeight; ctx.clearRect(0, 0, canvasWidth, canvasHeight) this.canvas = canvas; this.ctx = ctx; resolve(); }) }) }, loadImg(src){ return new Promise((resolve, reject) => { const {canvas} = this; const image = canvas.createImage() image.src = src image.onload = () => { resolve(image) } image.onerror = () => { reject(new Error(`fail to fetch image form: ${src}`)) } }) }, })
星期一 21:45如果canvas组件，设置了style.width、height, 需要保持和Canvas实例一样的值；导出尺寸要以Canvas实例尺寸除以桌面端pixelRatio重新计算 const dpr = wx.getSystemInfoSync().pixelRatio; wx.canvasToTempFilePath({width: canvas.width / dpr, height: canvas.height / dpr})
canvas生成完后使用canvasToTempFilePath导出图片手机端显示正常pc端不行？[图片]
10-22如果canvas组件，设置了style.width、height, 需要保持和Canvas实例一样的值；导出尺寸要以Canvas实例尺寸除以桌面端pixelRatio重新计算 const dpr = wx.getSystemInfoSync().pixelRatio; wx.canvasToTempFilePath({width: canvas.width / dpr, height: canvas.height / dpr})
pc端使用canvasToTempFilePath尺寸不正确？pc端使用canvasToTempFilePath尺寸比例不对[图片]这个是canvas展示效果，[图片]生成图片后就这样，怎么解决这问题了; 重新测试现在pc端完全不能生成了
10-22用这个版本不会变大 npm i -D miniprogram-ci@1.6
打包后文件大小没超2m ，但是miniprogram-ci 上传接口报错超出2m本地打包出来的大小没超过，用开发者工具都正常上传，用ci工具就会报错，从下面【图2】截图可以看出ci工具打印的日志显示 包大小是1.6m，但是请求上传之后腾讯接口返回了超出大小。感觉是腾讯服务器解压方面出了问题 （以下截图是同一次打包的结果） 图1 [图片] 图2 [图片]
02-19这个版本不会变大 npm i -D miniprogram-ci@1.6
cli工具预览，超出代码包限制？同一份代码，开发者工具可以进行预览，调用cli报错 {"errCode":-1,"errMsg":"inner test source fail with errcode: 80200, errmsg: main package source size 2097KB exceed max limit 2MB"} 配置： const ci = require('miniprogram-ci') ; (async () => { const project = new ci.Project({ appid: '********', type: 'miniProgram', projectPath: process.cwd() + '/dist/build/mp-wx-zsjfw', privateKeyPath: process.cwd() + '/private.zsjfw.wx.key', ignores: ['node_modules/**/*','images/**/*'], }) ci.preview({ project, desc: 'hello', setting: { urlCheck: false, es6: true, minify: true, }, libVersion: "2.25.4", qrcodeFormat: 'image', qrcodeOutputDest: process.cwd() + `/test.jpg`, onProgressUpdate: console.log, }).then(res => { console.log(res) }).catch(error => { console.log(error) process.exit(-1) }) })()
02-19时好时坏，不用修了，基础库一直在更新
主包有个页面，只要进入就会报 Framework inner error 错误[图片]
01-04应该是崩了，害得我找了半天bug，因为我刚发版
-501006 invalid common parameters- 当前 Bug 的表现（可附上截图） - 预期表现 - 复现路径 - 提供一个最简复现 Demo 之前云函数可以正常访问，突然就报这个错了，-501006 invalid common parameters | errMsg: SessionToken missing，在官网也找不到501006 对应的错误信息
2019-07-24签名和调起支付时间戳要一样才行
小程序支付验证签名失败已成功通过统一支付接口获取到prepay_id，使用和统一下单同样的小程序appId和对应的商户API key对appId,nonceStr,package,signType,timeStamp这几个参数进行md5加密，参数传到小程序后调起支付时报支付验证签名失败。 相关代码： [代码]public[代码] [代码]Map string, string="">getPayInfo(Map string, string="">data)/string,>/string,>[代码][代码]throws[代码] [代码]Exception {[代码][代码] [代码][代码]Map string, string="">unifiedOrder = unifiedOrder(data);/string,>[代码][代码] [代码][代码]Map string, string="">signData = Maps.newHashMap();/string,>[代码][代码] [代码][代码]signData.put([代码][代码]"appId"[代码][代码], [代码][代码]this[代码][代码].config.getAppID());[代码][代码] [代码][代码]signData.put([代码][代码]"timeStamp"[代码][代码], String.valueOf(WXPayUtil.getCurrentTimestamp()));[代码][代码] [代码][代码]signData.put([代码][代码]"nonceStr"[代码][代码], WXPayUtil.generateNonceStr());[代码][代码] [代码][代码]signData.put([代码][代码]"package"[代码][代码], [代码][代码]"prepay_id="[代码] [代码]+ unifiedOrder.get([代码][代码]"prepay_id"[代码][代码]));[代码][代码] [代码][代码]signData.put([代码][代码]"signType"[代码][代码], WXPayConstants.MD5);[代码][代码] [代码][代码]Map string, string="">returnData = Maps.newHashMap();/string,>[代码][代码] [代码][代码]returnData.put([代码][代码]"timeStamp"[代码][代码], signData.get([代码][代码]"timeStamp"[代码][代码]));[代码][代码] [代码][代码]returnData.put([代码][代码]"nonceStr"[代码][代码], signData.get([代码][代码]"nonceStr"[代码][代码]));[代码][代码] [代码][代码]returnData.put([代码][代码]"package"[代码][代码], signData.get([代码][代码]"package"[代码][代码]));[代码][代码] [代码][代码]returnData.put([代码][代码]"signType"[代码][代码], signData.get([代码][代码]"signType"[代码][代码]));[代码][代码] [代码][代码]returnData.put([代码][代码]"paySign"[代码][代码], WXPayUtil.generateSignature(signData, [代码][代码]this[代码][代码].config.getKey()));[代码][代码] [代码][代码]return[代码] [代码]returnData;[代码][代码]}[代码] md5加密前的串是这样的： appId=****&nonceStr=2f3c978b0e91435dab8b0f0045665158&package=prepay_id=wx201707141513256189b0503e0006016925&signType=MD5&timeStamp=1500016405&key=**** 签名前有加key，签名时的appId和key和统一下单的appId和key是相同的。 md5加密算法没有问题，用微信签名校验工具也核对过了，参数名称检查了很多遍和文档上是一样的。 小程序代码： [代码]var[代码] [代码]timeStamp = res.payInfo.timeStamp;[代码][代码]var[代码] [代码]nonceStr = res.payInfo.nonceStr;[代码][代码]var[代码] [代码]packageInfo = res.payInfo.package;[代码][代码]var[代码] [代码]signType = res.payInfo.signType;[代码][代码]var[代码] [代码]paySign = res.payInfo.paySign;[代码][代码]wx.requestPayment({[代码][代码] [代码][代码]'timeStamp'[代码][代码]: timeStamp,[代码][代码] [代码][代码]'nonceStr'[代码][代码]: nonceStr,[代码][代码] [代码][代码]'package'[代码][代码]: packageInfo,[代码][代码] [代码][代码]'signType'[代码][代码]: signType,[代码][代码] [代码][代码]'paySign'[代码][代码]: paySign,[代码][代码] [代码][代码]'success'[代码][代码]: [代码][代码]function[代码] [代码](res) {[代码][代码] [代码][代码]console.log(res);[代码][代码] [代码][代码]},[代码][代码] [代码][代码]'fail'[代码][代码]: [代码][代码]function[代码] [代码](res) {[代码][代码] [代码][代码]console.log(res);[代码][代码] [代码][代码]}[代码][代码]})[代码] 到底哪里有问题啊，求助！！！
2018-12-31
获得过 0 次赞
回答过的问题获得 0 次赞
分享过的文章/案例获得 0 次赞
评论与回复获得 0 次赞