直接用第三方裁剪组件最省事，但须避开平台兼容、DOM初始化、canvas像素偏移三类高频坑；uni-app无内置裁剪能力，uni.chooseImage仅返回路径，需前端canvas处理才能获取像素数据并计算裁剪坐标。
直接用第三方裁剪组件最省事，但必须避开平台兼容、DOM 初始化、canvas 像素偏移这三类高频坑。uni-app 自身不带裁剪能力，uni.chooseImage 拿到的只是路径，不能跳过前端裁剪直传后端。
uni.chooseImage 后为什么不能直接上传？
因为 tempFilePaths[0] 在不同端语义不同：H5 是本地 file:// 路径，小程序是沙盒内只读路径，App 端甚至无法用 fs.readFile 读取二进制。不经过 canvas 处理，你根本拿不到像素数据，更没法算裁剪坐标。
- H5 下若用
<input type="file">替代uni.chooseImage，后续 canvas 操作更可控，但需自行处理 iOS 文件 MIME 类型识别问题 - 小程序必须走
uni.getImageInfo或直接塞进裁剪组件的src属性——它内部会自动调用该 API 获取宽高 - App 端建议加
sizeType: ['compressed']，否则原图动辄 5–10MB，canvas 初始化直接卡死或内存溢出
vue-cropper 在 uni-app 里报 document is not defined 怎么办？
这是 SSR 编译或平台判断缺失导致的。小程序和 App 端没有 document 对象，H5 端也可能在 mounted 阶段 DOM 还没挂载完就执行了初始化。
- 用
uni.getSystemInfoSync().platform !== 'app'做运行时守卫，只在 H5 / 小程序环境加载组件 - 把裁剪组件用
v-if="showCropper"包裹，图片加载完成（@load触发）后再设为true - 初始化 cropper 实例前加双保险：
this.$nextTick(() => { setTimeout(() => { /* new Cropper(...) */ }, 0) }) - 绝对不要在
data或onLoad里写new Cropper()，uni-app 的生命周期不保证 DOM 可用
uni-image-cropper 或 nice-cropper 如何正确集成？
这类封装好的组件省去了 canvas 坐标映射逻辑，但参数配置稍有不慎就会输出模糊图或比例错乱。
- 必须显式传
:mode="'circle'"或:mode="'rectangle'"，不传默认是自由裁剪，头像场景容易误操作 -
:quality="0.8"是关键，canvastoDataURL('image/jpeg', 0.8)能兼顾清晰度与体积，别用 1.0（太大）或 0.5（发灰） - 输出尺寸建议硬限制：
:dWidth="200"+:ratio="1"，避免用户拖大裁剪框导出超大图 - 真机调试时若发现裁剪位置偏移，大概率是没适配
pixelRatio，需在 canvas 绘制前乘上uni.getSystemInfoSync().pixelRatio
最易被忽略的是：裁剪后的 path 或 base64 必须立刻上传，临时路径在 iOS 微信小程序中几秒后就失效，Android App 端可能下次冷启动就清空。别存到 data 里等“稍后上传”，得在 @cropped 回调里直接调 uni.uploadFile。
