Pārlūkot izejas kodu

七牛云上传处理

zjs_project 1 gadu atpakaļ
vecāks
revīzija
9809705f15

+ 1 - 1
src/components/newBottomCom/viewAI/viewAI.html

@@ -167,5 +167,5 @@
 		</div>
 	</div>
 	<!-- <video id="videoPlayer" loop muted autoplay style="display: none;" controls="false" webkit-playsinline="webkit-playsinline" playsinline="playsinline" src=""></video> -->
-	<video id="output-video" controls :src="videoSrc"></video>
+	<!-- <video id="output-video" controls :src="videoSrc"></video> -->
 </div>

+ 74 - 9
src/components/newBottomCom/viewAI/viewAI.vue

@@ -15,7 +15,8 @@
 	import lottie from "lottie-web"; //lottie
 	// const { createWorker } = require('@ffmpeg/ffmpeg');
 	import { FFmpeg } from "@ffmpeg/ffmpeg";
-	import { fetchFile, toBlobURL } from '@ffmpeg/util'
+	import { fetchFile, toBlobURL } from '@ffmpeg/util';
+	var qiniu = require('qiniu-js');
 	const baseURL = '.'
 	let ffmpeg = null;
 	// import { createFFmpeg, fetchFile } from '@/assets/ffmpeg.min.js';
@@ -120,7 +121,7 @@
 		async mounted() {
 			// await this.getCityHouseList();		
 			console.warn("***viewAI***")
-			Indicator.open('加载中...');
+			// Indicator.open('加载中...');
 			this.getDatalist(0);
 			this.getDatalist(1);
 			this.getDatalist(3);
@@ -274,6 +275,59 @@
 				var newfile = new File([data.buffer], name, { type: "video/mp4" });
 				this.uploadMaterielFile({file:newfile},form)
 			},
+			//上传到七牛云中
+			async uploadVideolFile(file,form){
+				var self = this;
+				let tokenObj = await requestConfig('getUploadToken', {});//获取上传token
+			
+				var token = tokenObj.single.token;
+				var resultUrl =  tokenObj.single.resultUrl; //上传图片的访问前缀this.resultUrl =
+				var tp = file.name.substring(file.name.lastIndexOf('.'));
+				var putExtra = {
+					fname: "",
+					params: {},
+					mimeType: null
+				};
+				var config = {
+					useCdnDomain: true,
+					disableStatisticsReport: false,
+					retryCount: 6,
+					region: qiniu.region.z0
+				};
+				self.uploadStatus = 1;//上传中
+				self.showPersonView = false;
+				self.addSilhouette();//添加剪影视频
+				var fileName = decodeURIComponent(encodeURIComponent(Date.now() + '/video' + Math.floor(Math.random()*1000))) + tp;
+				var observable = qiniu.upload(file, fileName, token, putExtra, config);
+				var subscription = observable.subscribe(self.next, self.error, async function(res){
+					self.uploading=false;
+					let VideoUrl = resultUrl + fileName;
+					console.warn("视频上传七牛成功",VideoUrl);
+					// self.$message.success('视频上传成功');
+					// alert("***uploadMaterielFile***"+$config.brandId+this.userId);
+					let data = {
+						"url":VideoUrl,
+						"brandId": $config.brandId,
+						"userId":self.userId
+					}
+					let res1 = await requestConfig('robust_videoV2', data, true, false)
+					if (res1 && res1.success && res1.single) {
+						self.videoId = res1.single;//根据Id查询结果
+						self.startInterval();//开始轮询获取结果
+					}else{
+						self.initStatus();//还原初始状态
+					}
+					let videoForm = document.getElementById(form); //获取表单对象
+					videoForm && videoForm.reset(); // 重置表单
+				});
+			},
+			next(res){
+				this.progress = Math.round(res.total.percent);//loaded已经加载的
+			},
+			// 上传七牛云发生错误
+			error(res){
+				this.$message.error('视频上传失败'+res.message);
+			},
 			async uploadImgObj(e,form,type=1){
 				this.stopFlag = false;//上传开始时,开启上传
 				if(type==2){
@@ -283,7 +337,7 @@
 				var file = e.target.files[0];
 				// this.transcodeNew(file,form);
 				var fileSize = file.size / 1024 / 1024;
-				// alert('**文件**' + e.target.value + "-fileName=" + file.name);
+				// alert('**文件**' + e.target.value + "-fileName=" + file.name+ "-fileSize="+fileSize);
 				if (!/\.(MP4|mp4|MOV|mov)$/.test(e.target.value)) {
 					this.$message.warning('文件类型必须是mp4或者mov');
 					var videoForm = document.getElementById(form); //获取表单对象
@@ -307,7 +361,11 @@
 						var item = {};
 						item.file = file;
 						console.warn("***uploadImgObj***",file)
-						this.uploadMaterielFile(item, form); //正常上传图片
+						if(fileSize>20){//七牛云上传-服务端压缩
+							this.uploadVideolFile(file,form);
+						}else{
+							this.uploadMaterielFile(item, form); //正常上传图片
+						}
 					}
 				}else{//安卓
 					let reader = new FileReader();
@@ -331,7 +389,11 @@
 									var item = {};
 									item.file = file;
 									console.warn("***uploadImgObj***",file)
-									this.uploadMaterielFile(item, form); //正常上传图片
+									if(fileSize>20){//七牛云上传-服务端压缩
+										this.uploadVideolFile(file,form);
+									}else{
+										this.uploadMaterielFile(item, form); //正常上传图片
+									}
 								}
 							}
 						};
@@ -413,14 +475,16 @@
 				formData.append('file', item.file);
 				formData.append('brandId', $config.brandId);
 				formData.append('userId', this.userId);
-				console.warn("***uploadMaterielFile***");
+				console.warn("****uploadMaterielFile**",$config.brandId,this.userId)
+				// alert("***uploadMaterielFile***"+$config.brandId+this.userId);
 				this.uploadStatus = 1;//上传中
 				this.showPersonView = false;
 				this.addSilhouette();//添加剪影视频
 				let res = await requestConfig('robust_video', formData, true, false,'post',this.uploadProgress,this.cancel)
+				// alert("***uploadMaterielFile1***"+JSON.stringify(res));
 				if (axios.isCancel(res)) {//取消上传处理
 					this.initStatus();//还原初始状态
-				}else if (res.success && res.single) {
+				}else if (res && res.success && res.single) {
 					this.videoId = res.single;//根据Id查询结果
 					this.startInterval();//开始轮询获取结果
 				}else{
@@ -498,8 +562,9 @@
 					progress = progress.replace(this.videoId + ':','');
 					let index = progress.indexOf("|");
 					progress = progress.substr(0,index);
+					let numbers = progress.match(/\d+/g)
 					console.warn("***抠图进度条***",progress);
-					this.ktProgress = parseFloat(progress);//提取出来的进度条
+					this.ktProgress = parseFloat(numbers);//提取出来的进度条
 					if(this.ktProgress>99){
 						this.ktProgress = 99;
 					}
@@ -637,7 +702,7 @@
 					typeName = "Virtual_Pet";
 				} else if (type == 3) {
 					typeName = "Virtual_Music";
-					Indicator.close();
+					// Indicator.close();
 				}
 				var parmas = {
 					"type": typeName,

+ 1 - 1
src/pages/webgl_rxdz_krpano720/webgl_rxdz_krpano720.vue

@@ -144,7 +144,7 @@
 						this.lottieAni()
 					}else if(this.result.status==99){
 						Toast({
-							message: '礼包已抢完',
+							message: '礼包已抢完',
 						});
 					}
 				}else{

+ 6 - 5
src/services/request.js

@@ -7,7 +7,7 @@ var requestCount = 0; //记录下同时的请求数
 
 axios.defaults.headers.post['elabEnvironment'] = '4'; //axios默认的请求方式,可以自己设置
 axios.defaults.headers.post['userType'] = '1000'; //axios默认的请求方式,可以自己设置
-axios.defaults.timeout = '1000000'; //axios默认的请求方式,可以自己设置
+axios.defaults.timeout = 10*60*1000; //axios默认的请求方式,可以自己设置
 // axios.defaults.headers.post['Authorization'] = 'Token 9837b7480a99ab4df7e3a06ad0d990fbc7b941e4'; //axios默认的请求方式,可以自己设置
 axios.interceptors.request.use(function(config) {
 	if(config.noLoading){
@@ -32,13 +32,13 @@ axios.interceptors.request.use(function(config) {
 		}
 		if (config.url.includes('elab-marketing-operate/mofangTest/user/login')
 		||config.url.includes('elab-marketing-user/vcode/send/verifyCode')) {
-			config.headers['userId'] = "";
-			config.headers['ip'] = "";
+			// config.headers['userId'] = "";
+			// config.headers['ip'] = "";
 		} else {//uploadOss 上传format文件过大时提示不成功,接口500,通过测试与header有关,注释掉上传的header就好了
 			if (!config.url.includes('elab-marketing-sms/aliyun/openapi/uploadOss')
 			&& !config.url.includes('/robust_video')){
-				config.headers['userId'] = mapVue.$route.query.leavePhoneCustomerId || '';
-				config.headers['openId'] = mapVue.$route.query.openid || '';
+				// config.headers['userId'] = mapVue.$route.query.leavePhoneCustomerId || '';
+				// config.headers['openId'] = mapVue.$route.query.openid || '';
 				// config.headers['ip'] = getStorage('ip');
 				// config.headers['maiya_token'] =  getStorage('userInfoThing') ? JSON.parse(getStorage('userInfoThing')).maiya_token || "" : ""; //token
 			}
@@ -64,6 +64,7 @@ axios.interceptors.response.use(function(response) {
 	return result;
 }, function(error) {
 	console.log("***error***", error, requestCount)
+	// alert("***error***"+JSON.stringify(error))
 	if (axios.isCancel(error)) {
 		console.log('上传已取消');
 		requestCount = requestCount - 1;

+ 2 - 0
src/services/requestConfig.js

@@ -40,6 +40,8 @@ const endpoints = {
 	queryEnumList: 'elab-marketing-user/enum/queryEnumList', // 获取数字人
 	rob: 'elab-marketing-file/redpack/rob', // 抢红包
 	robust_video: 'https://robustvideomatting.elab-plus.com/robust_video', // 上传视频
+	robust_videoV2: 'https://robustvideomatting.elab-plus.com/robust_video/v2', // 上传视频
+	// robust_video: 'http://192.168.50.52:5000/robust_video', // 上传视频
 	get_result: 'https://robustvideomatting.elab-plus.com/get_result', // 获取视频上传结果
 	getUserVirtural: 'elab-marketing-file/virtual/getUserVirtural', // 查询用户上传的数字人 
 	addUserVirtural: 'elab-marketing-file/virtual/addUserVirtural', // 修改数字人信息

+ 0 - 4
vue.config.js

@@ -13,10 +13,6 @@ module.exports = {
 	assetsDir: 'static', //放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录。-打包时才有意义
 	indexPath: 'index.html', //指定生成的 index.html 的输出路径 (相对于 outputDir)。也可以是一个绝对路径。-打包时才有意义
 	devServer: {
-		headers: {
-			"Cross-Origin-Opener-Policy": "same-origin",
-			"Cross-Origin-Embedder-Policy": "require-corp",
-		},
 		open: false,
 		proxy:{},
 	},