uniapp 实现上传图片和上传视频_uniapp 上传视频

上传视频

<view class="file-left" @click="chooseFile" v-if="File">
	<image class="img" src="../../../static/interview/shangchuan.png" mode=""></image>
	<text class="text">视频上传</text>
</view>
1
2
3
4

chooseFile() {
				uni.chooseFile({
					// sourceType:['album','camera'],
					extension: ['.mp4'],
					type: 'video',
					success: (res) => {
						const tempFilePath = res.tempFiles[0].path;
						this.uploadFile(tempFilePath);
					}
				});
			},
uploadFile(filePath) {
				uni.uploadFile({
					url: 'https://yyfw.allxiangcun.cn/api/upload-file',
					filePath: filePath,
					name: 'file',
					success: (uploadRes) => {
						// 处理上传成功的逻辑
						const responseData = JSON.parse(uploadRes.data);
						this.uploadinfo = responseData.data
						this.shot = false
						let data = []
						this.uploadedUrls.push(this.uploadinfo);
						this.uploadUrl = this.uploadedUrls.join(',');

						console.log('uploadUrl:', this.uploadUrl);
					},
					fail: (error) => {
						// 处理上传失败的逻辑
						console.log(error);
					}
				});
},
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

上传图片

<view class="file-right" @tap="onGetImgClick" v-show="shot">
	<image class="img" src="../../../static/interview/xiangji.png" mode=""></image>
	<text class="text">拍照上传</text>
</view>
1
2
3
4

onGetImgClick() {
				uni.chooseImage({
					count: 1, // 最多可选择的图片数量
					sourceType: ['camera'], // 指定源类型为拍照
					success: (res) => {
						// 选择成功，将拍摄的照片路径保存到image中
						this.image = res.tempFilePaths[0];
						uni.uploadFile({
							url: 'https://yyfw.allxiangcun.cn/api/upload-img', // 上传图片的接口地址
							filePath: this.image, // 本地文件路径
							name: 'file', // 上传文件的表单名称
							success: (uploadRes) => {
								// 处理上传成功的逻辑
								const responseData = JSON.parse(uploadRes.data);
								this.uploadinfo = responseData.data
								this.File = false
								// let data = {
								// 	url: this.uploadinfo
								// }
								let data = []
								this.uploadedUrls.push(this.uploadinfo);
								this.uploadUrl = this.uploadedUrls.join(',');

								console.log('uploadUrl:', this.uploadUrl);


							},
							fail: (error) => {
								console.error('上传失败', error);
								// 这里可以根据具体情况处理上传失败的情况，比如展示上传失败的提示信息
							}
						});
					}
				});


},
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37