小程序
小游戏
企业微信
微信支付
扫描小程序码分享
canvas画布， 开发工具不报错，真机调试就出现错误： Unhandled promise rejection TypeError: r.Canvas is not a constructor
10 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
一年过去了，真机调试依然不支持canvas 2d，求提升优先级
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
两年了
现在是2021年11月29日，此bug 还是没有修复
现在还不支持真机调试嘛？不支持的话，我就忽略这个问题了。。。
问题解决了嘛 我也有这个问题
‘真机调试’有这个问题；手机预览调试没有。
此问题大家都解决了吗？我这里是用canvas 2d在iPad上报错，如果是用webgl就没有问题。真机调试报错如下：
runtime.js?devtools_ignore=true:1 [Violation] 'message' handler took 258ms
VM14:2 Unhandled promise rejection TypeError: r.Canvas is not a constructor
at n.value (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:742386)
at n.value (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:626107)
at t (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:626279)
at n.value (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:626368)
at eval (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:1244118)
at new T (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:66743)
at t (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:1244080)
at eval (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:1244135)
at Array.forEach (<anonymous>)
at r (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:1243340)
eval @ VM14:2
e.exports @ VM14:2
y.<computed> @ VM14:2
r @ VM14:2
setTimeout (async)
setTimeout @ VM14:2
_.now.f.addEventListener.f.importScripts.i @ VM14:2
h @ VM14:2
M @ VM14:2
e @ VM14:2
o @ VM14:2
D @ VM14:2
B @ VM14:2
success @ VM14:2
y @ VM14:2
v @ VM14:2
u @ runtime.js?devtools_ignore=true:1
w @ runtime.js?devtools_ignore=true:1
ke.onmessage @ runtime.js?devtools_ignore=true:1
请问楼主解决了吗，我开发者工具正常，真机调试报这个错，预览闪退
请问楼主解决这个问题了吗？开发者工具正常，真机预览、调试都报这个错误
是哪个版本的开发工具？
麻烦提供出现问题的具体机型、微信版本号、系统版本号，以及能复现问题的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
一年过去了，真机调试依然不支持canvas 2d，求提升优先级
两年了
现在是2021年11月29日，此bug 还是没有修复
现在还不支持真机调试嘛？不支持的话，我就忽略这个问题了。。。
问题解决了嘛 我也有这个问题
‘真机调试’有这个问题；手机预览调试没有。
此问题大家都解决了吗？我这里是用canvas 2d在iPad上报错，如果是用webgl就没有问题。真机调试报错如下：
runtime.js?devtools_ignore=true:1 [Violation] 'message' handler took 258ms
VM14:2 Unhandled promise rejection TypeError: r.Canvas is not a constructor
at n.value (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:742386)
at n.value (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:626107)
at t (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:626279)
at n.value (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:626368)
at eval (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:1244118)
at new T (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:66743)
at t (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:1244080)
at eval (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:1244135)
at Array.forEach (<anonymous>)
at r (eval at n.call.document (runtime.js?devtools_ignore=true:1), <anonymous>:2:1243340)
eval @ VM14:2
e.exports @ VM14:2
eval @ VM14:2
e.exports @ VM14:2
y.<computed> @ VM14:2
r @ VM14:2
eval @ VM14:2
eval @ VM14:2
eval @ VM14:2
setTimeout (async)
setTimeout @ VM14:2
_.now.f.addEventListener.f.importScripts.i @ VM14:2
h @ VM14:2
M @ VM14:2
eval @ VM14:2
e @ VM14:2
e.exports @ VM14:2
y.<computed> @ VM14:2
r @ VM14:2
eval @ VM14:2
eval @ VM14:2
eval @ VM14:2
setTimeout (async)
setTimeout @ VM14:2
_.now.f.addEventListener.f.importScripts.i @ VM14:2
h @ VM14:2
o @ VM14:2
eval @ VM14:2
D @ VM14:2
B @ VM14:2
eval @ VM14:2
success @ VM14:2
eval @ VM14:2
y @ VM14:2
v @ VM14:2
eval @ VM14:2
v @ VM14:2
u @ runtime.js?devtools_ignore=true:1
w @ runtime.js?devtools_ignore=true:1
ke.onmessage @ runtime.js?devtools_ignore=true:1
请问楼主解决了吗，我开发者工具正常，真机调试报这个错，预览闪退
请问楼主解决这个问题了吗？开发者工具正常，真机预览、调试都报这个错误
是哪个版本的开发工具？
麻烦提供出现问题的具体机型、微信版本号、系统版本号，以及能复现问题的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）
init(res) {
const width = res[0].width
const height = res[0].height
const canvas = res[0].node
const ctx = canvas.getContext('2d')
const dpr = wx.getSystemInfoSync().pixelRatio
canvas.width = width*dpr
canvas.height = height*dpr
ctx.scale(dpr, dpr)
let dot = 0;
const renderLoop = () => {
if(Object.keys(that.data.testingMachineData).length > 0) {
if (that.data.testingMachineData['位移'].length > 300) {
//console.log(that.data.testingMachineData)
dot = that.data.testingMachineData['位移'].shift()
}
}
that.render(canvas ,ctx, dot)
canvas.requestAnimationFrame(renderLoop)
}
canvas.requestAnimationFrame(renderLoop)
const stents = canvas.createImage()
const beam = canvas.createImage()
stents.onload = () => {
that._stents = stents
}
beam.onload = () => {
that._beam = beam
}
stents.src = '../../images/stents.png'
beam.src = '../../images/beam.png'
},
render(canvas, ctx, dot) {
ctx.clearRect(0, 0, 350, 350)
that.drawStents(ctx)
that.drawBeam(ctx, dot)
that.drawDisplay(ctx, dot)
},
drawStents(ctx) {
if (!that._stents) return
ctx.drawImage(that._stents, 50, 0, 180, 200)
ctx.restore()
},
drawBeam(ctx, dot) {
if(!that._beam) return
if(that.y > 350) {
that.y = -10
}
let transBeamDot = dot * 5 + 30
ctx.drawImage(that._beam, 112, transBeamDot, 50, 50)
ctx.restore()
},
//显示数据
drawDisplay(ctx, dot) {
let transBeamDot = dot * 5 + 30
ctx.beginPath()
ctx.moveTo(180, transBeamDot + 20)
ctx.lineTo(240, transBeamDot + 20)
ctx.lineTo(270, transBeamDot)
ctx.font = "14px Times New Roman"
if(dot == 0) {
ctx.strokeText('0.000', 280, transBeamDot)
}else{
ctx.strokeText(dot, 280, transBeamDot)
}
ctx.stroke()
},