参考文档https://uniapp.dcloud.io/api/canvas/canvasToTempFilePath?id=canvastotempfilepath,
uni.canvasToTempFilePath({
// ...,
success: function(res) {
// 在H5平台下,tempFilePath 为 base64
console.log(res.tempFilePath)
}
})
目前, 非H5端返回tempFilePath为canvas生成图片的相对路径, 而H5端返回的tempFilePath为base64编码,
实际开发中其实统一返回base64编码也是有必要甚至更合适的, 应用场景如用户填写某个表单, 最下方需要用户签名确认,
提交表单时包含所填的各个表单项以及签名字迹的base64编码字段, 这时候非H5端提交签名图片的相对路径存储到数据库中是没有多大意义的, 还需要进一步转换, 例如:
uni.canvasToTempFilePath({
canvasId: 'myCanvas',
async success(res) {
let base64Code;
let tempFilePath = res.tempFilePath;
// #ifdef H5
base64Code = tempFilePath;
// #endif
// #ifndef H5
let path = plus.io.convertLocalFileSystemURL(tempFilePath);
let fileReader = new plus.io.FileReader();
fileReader.readAsDataURL(path);
fileReader.onloadend = res => {
base64Code = res.target.result;
//...
};
// #endif
}
});
既然如此, 建议uni.canvasToTempFilePath这个API返回的res里面统一增加一个字段base64Code(H5和非H5端统一返回base64编码), 非H5端返回res.tempFilePath(相对路径), 而H5端返回的res.tempFilePath为null;
谢谢
3 个回复
8***@qq.com
顶一个,APP临时路径在Android11时QQ分享会有问题,最好统一返回base64
9***@qq.com - 前端程序员
顶一个 APP端建议也返回base64
7***@qq.com
好使