记录uniapp使用华为云obs上传图片视频

1:去华为云官网下载  OBS BrowserJS SDK  华为云


记录uniapp使用华为云obs上传图片视频_第1张图片

 2:项目中引入sdk文件

import ObsClient from '../../utils/esdk-obs-browserjs-without-polyfill.3.22.3.min.js';

3:配置使用

videoUpload() {
			const that = this;
			uni.chooseVideo({
				sourceType: ['camera'],
				success: function(res) {
					// 年与日
					const now = new Date();
					const year = now.getFullYear();
					let month = now.getMonth() + 1;
					let day = now.getDate();
                    // 如果日期小于10,前面补0
					if (month < 10) {
						month = '0' + month;
					}

					// 如果日期小于10,前面补0
					if (day < 10) {
						day = '0' + day;
					}
					const my_data = `${year}${month}${day}`;
					const newName = new Date().valueOf(); //当前时间戳
					const str10 = that.s10(); //随机10字符
					var arr = res.tempFile.name.split('.');
					const str = arr[0];
					const encodedUrl = encodeURIComponent(str);
					uni.showLoading({
						title: '上传中'
					});
                    var obsClient = new ObsClient({
	                    access_key_id: '你的ak', 
	                    secret_access_key: '你的sk',
	                    server: 'https://obs.cn-north-4.myhuaweicloud.com' // 你的endPoint
                    });
					obsClient.putObject(
						{
							Bucket: '你的桶名',
							Key: `video/${my_data}/${newName}_${str20}.${arr[1]}`, // 路径 + 文件名
							SourceFile: res.tempFile
						},
						function(err, result) {
							if (!err) {
                               console.log(`https://${这里是Bucket}.obs.cn-north-4.myhuaweicloud.com/video/${my_data}/${newName}_${str20}.${arr[1]}`);
								that.$nextTick(() => {
									uni.hideLoading();
								});
							}
						}
					);
				}
			});
		},

4:这里是上面我用到的随机10字符串

// 随机10字符
		s10() {
			var data = [
				'0',
				'1',
				'2',
				'3',
				'4',
				'5',
				'6',
				'7',
				'8',
				'9',
				'A',
				'B',
				'C',
				'D',
				'E',
				'F',
				'G',
				'H',
				'I',
				'J',
				'K',
				'L',
				'M',
				'N',
				'O',
				'P',
				'Q',
				'R',
				'S',
				'T',
				'U',
				'V',
				'W',
				'X',
				'Y',
				'Z',
				'a',
				'b',
				'c',
				'd',
				'e',
				'f',
				'g',
				'h',
				'i',
				'j',
				'k',
				'l',
				'm',
				'n',
				'o',
				'p',
				'q',
				'r',
				's',
				't',
				'u',
				'v',
				'w',
				'x',
				'y',
				'z'
			];

			var result = '';
			for (var i = 0; i < 10; i++) {
				var r = Math.floor(Math.random() * 62); 
				result += data[r]; 
			}
			return result;
		}

注意:

  1. 多看官方文档 !!!
  2. 我是上传到 /video/当前年月日(如:20230425)/当前时间戳_随机10字符.文件后缀,并且修改了文件名字,这样确保文件唯一性,
  3. 取值的时候就是
  4. 'https://' + bucket + '.obs.cn-north-4.myhuaweicloud.com/' + key

  5. 这里的key就是咱们存的时候的路径加文件名和文件后缀,取出来之后就是线上预览链接
  6. 还是多多看文档!!!!!!!!!!!

你可能感兴趣的:(uni-app,华为云,vue.js,javascript,音视频)