# 前言
在 `APP` 开发中,或是 `H5` 开发时,避免不了会上传一写图片。利用 `uni-app` 中的 `uni.uploadFile(OBJECT) `,这种方式比较简单,按照文档一步一步操作即可。然而`uniapp` 上传接口输入参数没有`base64 `设置项。在图片通过`Canvas`压缩以后保存临时文件在H5平台不返回文件路径,而是`base64 `值。
注意⚠️
![H5 返回 base64.png](https://upload-images.jianshu.io/upload_images/23654578-a45585d02bbdc9ef.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
![代码片段.png](https://upload-images.jianshu.io/upload_images/23654578-ec4a1a6376a76f70.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
![执行打印.png](https://upload-images.jianshu.io/upload_images/23654578-629a34a573568ae2.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
# 解决方案
+ "image-tools": "^1.4.0"
+ npm i image-tools --save
+ 代码片段
```
base64ToPath(res.tempFilePath)
.then((path) => {
console.error(`base64ToPath path:${path}`);
})
.catch((error) => {
console.error(`base64ToPath error:${error}`);
});
```
# 参考
+ https://blog.csdn.net/sansanyuner/article/details/114384318
+ https://www.jianshu.com/p/29abad0586da?ivk_sa=1024320u
+ https://www.npmjs.com/package/image-tools
UniApp H5 Base64 图片上传
最新推荐文章于 2024-08-19 20:22:19 发布