uniapp图片压缩上传 (保姆式传递快乐,让摸鱼变得简单快乐)_uni chooseimage sizetype 压缩率-优快云博客

本文链接：https://blog.youkuaiyun.com/bad___man/article/details/123816308

本文介绍了一种使用uniapp进行图片压缩并上传的方法。首先通过uni.chooseImage选择图片，并根据图片大小调整压缩比例，确保图片大小不超过800KB。接着使用uni.compressImage API进行压缩，最后利用uni.uploadFile上传压缩后的图片到服务器。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

uniapp图片压缩上传

第一步

先选中图片

onChooseImage() {
				//选择图片
				uni.chooseImage({
					sizeType: ['compressed'],
					sourceType: this.sourceType,
					count: this.maxChooseCount,
					success: (res) => {
						//获取上传图片信息
						let tempFilePaths = res.tempFilePaths[0];
						//图片大小
						let tempFilePathsSize = res.tempFiles[0].size;
						let comSize = 0 //图片压缩百分比
						//判断图片
						if (tempFilePathsSize < 800000) {
							comSize = 100
						} else if (tempFilePathsSize >= 800000) {
							comSize = parseInt((800000 / tempFilePathsSize * 100).toFixed(0))
						}
						console.log(typeof(comSize))
						//压缩图片api
						uni.compressImage({
							//图片信息
							src: tempFilePaths,
							//图片比例
							quality: comSize,
							success: res => {
								console.log(res)
								this.upImg(res.tempFilePath)
							}
						})
						this.testShow = false
					}
				});
			},

第二步

上传图片

upImg(src) {
				uni.uploadFile({
					url: '上传接口地址',
					//图片地址
					filePath: src,
					header: {
						"Content-Type": "multipart/form-data",
					},
					formData: {
						path: 'jrls'
					},
					name: 'image_file', // 后端接收的文件名
					success: (res) => {
					//res:返回值
						console.log(res.data)
						if (res.data) {
							//#ifndef MP-BAIDU
							let msg = JSON.parse(res.data).body
							//#endif
							// #ifdef MP-BAIDU
							let msg = res.data.body
							// #endif
							this.$emit('onChoose', msg.urlPath, msg.imageUrl);
						}
					}
				})
			}