最常见致命问题是canvas.width/height未乘dpr导致物理像素不足；须用pixelratio动态设置width/height并调用ctx.scale(dpr,dpr)；drawimage需本地中转绕过跨域；导出时width/height与destwidth/destheight须匹配逻辑与物理尺寸。
canvas.width/height没乘dpr导致物理像素不足
这是最常见也最致命的问题。你看到的模糊不是“画得不好”，而是画布缓冲区本身像素太低——比如在 iPhone 14（dpr=3）上，只设了canvas.width = 750，实际只有 750×1334 物理像素，但设备需要 2250×4002 才能填满逻辑区域。浏览器强制拉伸，必然糊。
必须做两件事：
- 用
uni.getSystemInfoSync().pixelRatio拿到真实dpr - 动态设置
canvas元素的width和height属性（不是 CSS 的style.width），值为「设计稿宽高 ×dpr」
例如目标尺寸是 750×600 rpx，则：canvas.width = 750 * dpr，canvas.height = 600 * dpr
ctx.scale(dpr, dpr)没在绘图前调用或调用错时机
ctx.scale()不是“美化开关”，它是重定义坐标系的底层操作。漏掉、晚调、或只调一次就不管重绘，都会让文字/线条位置错乱、粗细失真、甚至部分区域不显示。
关键规则：
- 每次调用
ctx.clear()或新建绘制上下文后，ctx.scale(dpr, dpr)必须重新执行 - 必须在任何绘图命令之前调用，包括
fillText、drawImage、strokeRect - 之后所有坐标、字号、线宽都按逻辑尺寸写（比如字号写
28，不是28 * dpr）
drawImage 加远程图时没绕过跨域和降采样
直接传 HTTP URL 给ctx.drawImage('https://xxx.png')在 iOS 微信 WebView 下大概率失败：要么 CORS 阻断导致空白，要么浏览器偷偷降采样成低分辨率图再画，再高清的 canvas 也救不回来。
可靠路径是本地中转：
- 先用
uni.downloadFile把图下到临时路径 - 再用
uni.getImageInfo({ src: tempFilePath })获取真实宽高（含orientation修正） - 最后用
ctx.drawImage画这个本地路径，确保原始像素 1:1 载入 - 注意：如果图是
@2x/@3x，getImageInfo返回的width/height就是物理像素，绘图时要除以dpr换算成逻辑尺寸缩放比例
uni.canvasToTempFilePath 导出参数没对齐逻辑尺寸
导出时若不显式指定width/height，微信会按 canvas 元素当前width/height（即物理像素数）生成图，结果就是一张超大图（比如 2250×1800），远超微信封面要求的 750×600，后续必被压缩糊掉。
正确做法是：
- 导出时传
{ width: 750, height: 600, canvasId: 'xxx', destWidth: 750 * dpr, destHeight: 600 * dpr } -
width/height控制输出图的逻辑尺寸（微信识别的尺寸） -
destWidth/destHeight控制最终文件的物理像素数（决定清晰度） - 别忘了检查生成图体积是否超过 120KB —— 超了微信会二次压缩，再准的绘制也白搭
真正容易被忽略的是：dpr 不是固定值，它可能在横竖屏切换、系统字体缩放开启后变化；而 canvas 缓冲区一旦创建，width/height 就锁定，不会自动响应 dpr 变更。所以每次绘制前都该重新读取 dpr 并重置 canvas 尺寸，不能只在初始化时做一次。
