Halaman utama Jelajahi Bantuan
Daftar Masuk
gongdecai
/
wangluohuoyun-huozhuapp
1
0
Fork 0
Berkas Masalah 0 Permintaan Tarik 0 Wiki
Jelajahi Sumber

优化视频认证页面样式

achao 3 tahun lalu
induk
bc68b10f78
melakukan
f7d914c827
7 mengubah file dengan 238 tambahan dan 821 penghapusan
Unified View Tampilkan Statistik Diff
  1. TEMPAT SAMPAH
      hybrid/html/img/shipinrenzheng.png
  2. 119 38
      hybrid/html/video.html
  3. TEMPAT SAMPAH
      unpackage/dist/dev/app-plus/hybrid/html/img/shipinrenzheng.png
  4. 0 268
      unpackage/dist/dev/app-plus/hybrid/html/oss - 副本.js
  5. 0 265
      unpackage/dist/dev/app-plus/hybrid/html/oss.js
  6. 0 212
      unpackage/dist/dev/app-plus/hybrid/html/video - 副本.js
  7. 119 38
      unpackage/dist/dev/app-plus/hybrid/html/video.html

TEMPAT SAMPAH
hybrid/html/img/shipinrenzheng.png
Tampilan Berkas


+ 119 - 38
hybrid/html/video.html
Tampilan Berkas 

@@ -5,46 +5,130 @@
 
 		<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
 
 		<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
 
 		<title></title>
 
 		<title></title>
 
 		<style>
 
 		<style>
 
+			body {
 
+				margin: 0;
 
+				background: #F5F6FA;
 
+			}
 
+
 
+			.content {
 
+				background: #F5F6FA;
 
+				height: 100vh;
 
+				position: relative;
 
+			}
 
+
 
+			.row {
 
+				display: flex;
 
+				justify-content: center;
 
+				padding-top: 200px;
 
+			
+			}
 
+			.img-video{
 
+					position: relative;
 
+					border-radius: 280px;
 
+					width: 564px;
 
+					height: 564px;
 
+						overflow: hidden;
 
+			}
 
 
 
+			.row2 {
 
+				display: flex;
 
+				font-size: 36px;
 
+				justify-content: center;
 
+				margin-top: 100px;
 
+			}
 
+
 
+			.verify-btn {
 
+				background: #2772FB;
 
+				font-size: 36px;
 
+				padding: 20px 0;
 
+				width: 70%;
 
+				display: flex;
 
+				justify-content: center;
 
+				align-items: center;
 
+				border-radius: 50px;
 
+				color: white;
 
+				
+			}
 
+
 
+			.btn {
 
+				position: absolute;
 
+				bottom: 0;
 
+				background: white;
 
+				width: 100%;
 
+				display: flex;
 
+				justify-content: center;
 
+				padding: 80px 0;
 
+			}
 
+			.img{
 
+				position: absolute;
 
+				top: 0;
 
+				bottom: 0;
 
+				width: 100%;
 
+				width: 564px;
 
+				height: 564px;
 
+				right: 0;
 
+				left: 0;
 
+				margin: auto;
 
+			}
 
+			.video-content{
 
+				position: absolute;
 
+				top: 0;
 
+				bottom: 0;
 
+				width: 100%;
 
+				right: 0;
 
+				left: 0;
 
+				margin: auto;
 
+			}
 
+			.video{
 
+				width: calc(100%);
 
+				background: #F5F6FA;
 
+			}
 
+			.video-btn{
 
+				width: 100%;
 
+				display: flex;
 
+				justify-content: center;
 
+			}
 
 		</style>
 
 		</style>
 
 	</head>
 
 	</head>
 
 	<body>
 
 	<body>
 
 		<div id='app'>
 
 		<div id='app'>
 
-			<div class="verify-placeholder">
 
-				<div class="verify-placeholder-img"></div>
 
-				<p class="verify-placeholder-text">正面平视手机、保证光线充足<br>请勿遮挡面部</p>
 
-			</div>
 
-			<div class="verify-bottom">
 
-				<ul class="verify-process">
 
-					<li>
 
-						<span class="num">1</span>
 
-						<p class="text">人脸放入框内，点击开始录制</p>
 
-					</li>
 
-					<li>
 
-						<span class="num">2</span>
 
-						<p class="text">录制倒计时<span class="text-tips">（8s）</span>，点击立即结束</p>
 
-					</li>
 
-					<li>
 
-						<span class="num">3</span>
 
-						<p class="text">完成录制，等待验证结果</p>
 
-					</li>
 
-				</ul>
 
-				<button class="verify-btn" @click="getCamera">开始录制</button>
 
-			</div>
 
-			<div class="btn-submit">
 
-				<button class="app-button-warning" size="small" @click="$router.back(-1)">上一步</button>
 
-				<button type="primary" size="small" class="btn">下一步</button>
 
-			</div>
 
-			<!--    人脸检测-->
 
-			<div class="video" v-show="showVideo">
 
-				<div class="video-cover"></div>
 
-				<video :src="url" ref="videoRef" autoplay playsinline x5-video-player-type="h5"></video>
 
-				<!-- 关闭按钮 -->
 
-				<button class="video-close" @click="closeVideo">×</button>
 
-				<button class="video-save" @click="saveVideo">
 
-					{{ isAlreadyRecord ? '结束录制(' + count + 's)' : '开始录制' }}</button>
 
+			<div class='content'>
 
+				<div class='row'>
 
+					<div class='img-video'>
 
+						<img src="./img/shipinrenzheng.png" alt="" class='img'>
 
+						<div class="video-content" v-show="showVideo">
 
+							<!--    人脸检测-->
 
+							<div class="video-cover"></div>
 
+							<video :src="url" ref="videoRef" autoplay playsinline x5-video-player-type="h5" class="video"></video>
 
+						</div>
 
+					</div>
 
+				</div>
 
+				<div class='row2' v-show="!showVideo">
 
+					请打开摄像头 并阅读提示文字
 
+				</div>
 
+				<div class='row2'  v-show="showVideo">
 
+					请将头像放于圆圈内，并阅读以下文字
 
+				</div>
 
+				<div class='row2'  v-show="showVideo">
 
+					网络客服过段时间浪费多少级范德萨快逻辑范德萨拉丝机多亏了房价按时付款了金坷垃所肩负的看离开静安寺了发动机as在考虑家双方都会计分录卡死范德萨拉使肌肤抵抗力
 
+				</div>
 
+				<div class='btn'>
 
+					<div class="verify-btn" @click="getCamera" v-show="!showVideo">打开摄像头</div>
 
+					
+					<div v-show="showVideo" class='video-btn'>
 
+						<div class="verify-btn"  @click="saveVideo" v-if='!isAlreadyRecord'>开始录制</div>
 
+						<div class="verify-btn" @click="saveVideo"  v-if='isAlreadyRecord'>结束录制</div>
 
+						<!-- <button class="video-close" @click="closeVideo">×</button>
 
+						<button class="video-save" @click="saveVideo">
 
+							{{ isAlreadyRecord ? '结束录制(' + count + 's)' : '开始录制' }}</button> -->
 
+					</div>
 
+				</div>
 
+
 
+				
+				<!-- <video ref="videob" controls="" name="media" v-show="!showVideo" width="100%" height="400"></video> -->
 
 			</div>
 
 			</div>
 
-			<video ref="videob" controls="" name="media" v-show="!showVideo" width="100%" height="400"></video>
 
+
 
+
 
 		</div>
 
 		</div>
 
 	</body>
 
 	</body>
 
 	<script src="vue.min.js"></script>
 
 	<script src="vue.min.js"></script>
 
@@ -107,7 +191,6 @@
 
 				uploadFile(policyBase64) {
 
 				uploadFile(policyBase64) {
 
 					var formdata = new FormData()
 
 					var formdata = new FormData()
 
 					// const policyBase64 = this.getPolicyBase64();
 
 					// const policyBase64 = this.getPolicyBase64();
 
-
 
 					console.log("policyBase64-----------------------")
 
 					console.log("policyBase64-----------------------")
 
 					console.log(policyBase64)
 
 					console.log(policyBase64)
 
 					const signature = this.getSignature(policyBase64); //获取签名
 
 					const signature = this.getSignature(policyBase64); //获取签名
 
@@ -124,8 +207,6 @@
 
 						url: 'https://taohaoliang.oss-cn-beijing.aliyuncs.com',
 
 						url: 'https://taohaoliang.oss-cn-beijing.aliyuncs.com',
 
 						success: function(result) {
 
 						success: function(result) {
 
 							console.log("result", result);
 
 							console.log("result", result);
 
-
 
-
 
 						},
 
 						},
 
 						//请求失败，包含具体的错误信息
 
 						//请求失败，包含具体的错误信息
 
 						error: function(e) {
 
 						error: function(e) {
 
@@ -255,7 +336,7 @@
 
 
 
 								console.log('11111111111111111')
 
 								console.log('11111111111111111')
 
 								console.log(reader.result); // base64格式
 
 								console.log(reader.result); // base64格式
 
-								this.$refs.videob.src = reader.result
 
+								// this.$refs.videob.src = reader.result
 
 								this.uploadFile(reader.result)
 
 								this.uploadFile(reader.result)
 
 
 
 								console.log(reader)
 
 								console.log(reader)

TEMPAT SAMPAH
unpackage/dist/dev/app-plus/hybrid/html/img/shipinrenzheng.png
Tampilan Berkas


+ 0 - 268
unpackage/dist/dev/app-plus/hybrid/html/oss - 副本.js
Tampilan Berkas 

@@ -1,268 +0,0 @@
 
-const Crypto = {};
 
-
 
-(function() {
 
-
 
-	var base64map = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
 
-
 
-
 
-	// Crypto utilities
 
-	var util = Crypto.util = {
 
-
 
-		// Bit-wise rotate left
 
-		rotl: function(n, b) {
 
-			return (n << b) | (n >>> (32 - b));
 
-		},
 
-
 
-		// Bit-wise rotate right
 
-		rotr: function(n, b) {
 
-			return (n << (32 - b)) | (n >>> b);
 
-		},
 
-
 
-		// Swap big-endian to little-endian and vice versa
 
-		endian: function(n) {
 
-
 
-			// If number given, swap endian
 
-			if (n.constructor == Number) {
 
-				return util.rotl(n, 8) & 0x00FF00FF |
 
-					util.rotl(n, 24) & 0xFF00FF00;
 
-			}
 
-
 
-			// Else, assume array and swap all items
 
-			for (var i = 0; i < n.length; i++)
 
-				n[i] = util.endian(n[i]);
 
-			return n;
 
-
 
-		},
 
-
 
-		// Generate an array of any length of random bytes
 
-		randomBytes: function(n) {
 
-			for (var bytes = []; n > 0; n--)
 
-				bytes.push(Math.floor(Math.random() * 256));
 
-			return bytes;
 
-		},
 
-
 
-		// Convert a string to a byte array
 
-		stringToBytes: function(str) {
 
-			var bytes = [];
 
-			for (var i = 0; i < str.length; i++)
 
-				bytes.push(str.charCodeAt(i));
 
-			return bytes;
 
-		},
 
-
 
-		// Convert a byte array to a string
 
-		bytesToString: function(bytes) {
 
-			var str = [];
 
-			for (var i = 0; i < bytes.length; i++)
 
-				str.push(String.fromCharCode(bytes[i]));
 
-			return str.join("");
 
-		},
 
-
 
-		// Convert a string to big-endian 32-bit words
 
-		stringToWords: function(str) {
 
-			var words = [];
 
-			for (var c = 0, b = 0; c < str.length; c++, b += 8)
 
-				words[b >>> 5] |= str.charCodeAt(c) << (24 - b % 32);
 
-			return words;
 
-		},
 
-
 
-		// Convert a byte array to big-endian 32-bits words
 
-		bytesToWords: function(bytes) {
 
-			var words = [];
 
-			for (var i = 0, b = 0; i < bytes.length; i++, b += 8)
 
-				words[b >>> 5] |= bytes[i] << (24 - b % 32);
 
-			return words;
 
-		},
 
-
 
-		// Convert big-endian 32-bit words to a byte array
 
-		wordsToBytes: function(words) {
 
-			var bytes = [];
 
-			for (var b = 0; b < words.length * 32; b += 8)
 
-				bytes.push((words[b >>> 5] >>> (24 - b % 32)) & 0xFF);
 
-			return bytes;
 
-		},
 
-
 
-		// Convert a byte array to a hex string
 
-		bytesToHex: function(bytes) {
 
-			var hex = [];
 
-			for (var i = 0; i < bytes.length; i++) {
 
-				hex.push((bytes[i] >>> 4).toString(16));
 
-				hex.push((bytes[i] & 0xF).toString(16));
 
-			}
 
-			return hex.join("");
 
-		},
 
-
 
-		// Convert a hex string to a byte array
 
-		hexToBytes: function(hex) {
 
-			var bytes = [];
 
-			for (var c = 0; c < hex.length; c += 2)
 
-				bytes.push(parseInt(hex.substr(c, 2), 16));
 
-			return bytes;
 
-		},
 
-
 
-		// Convert a byte array to a base-64 string
 
-		bytesToBase64: function(bytes) {
 
-
 
-			// Use browser-native function if it exists
 
-			// if (typeof btoa == "function") return btoa(util.bytesToString(bytes));
 
-
 
-			var base64 = [],
 
-				overflow;
 
-
 
-			for (var i = 0; i < bytes.length; i++) {
 
-				switch (i % 3) {
 
-					case 0:
 
-						base64.push(base64map.charAt(bytes[i] >>> 2));
 
-						overflow = (bytes[i] & 0x3) << 4;
 
-						break;
 
-					case 1:
 
-						base64.push(base64map.charAt(overflow | (bytes[i] >>> 4)));
 
-						overflow = (bytes[i] & 0xF) << 2;
 
-						break;
 
-					case 2:
 
-						base64.push(base64map.charAt(overflow | (bytes[i] >>> 6)));
 
-						base64.push(base64map.charAt(bytes[i] & 0x3F));
 
-						overflow = -1;
 
-				}
 
-			}
 
-
 
-			// Encode overflow bits, if there are any
 
-			if (overflow != undefined && overflow != -1)
 
-				base64.push(base64map.charAt(overflow));
 
-
 
-			// Add padding
 
-			while (base64.length % 4 != 0) base64.push("=");
 
-
 
-			return base64.join("");
 
-
 
-		},
 
-
 
-		// Convert a base-64 string to a byte array
 
-		base64ToBytes: function(base64) {
 
-
 
-			// Use browser-native function if it exists
 
-			if (typeof atob == "function") return util.stringToBytes(atob(base64));
 
-
 
-			// Remove non-base-64 characters
 
-			base64 = base64.replace(/[^A-Z0-9+\/]/ig, "");
 
-
 
-			var bytes = [];
 
-
 
-			for (var i = 0; i < base64.length; i++) {
 
-				switch (i % 4) {
 
-					case 1:
 
-						bytes.push((base64map.indexOf(base64.charAt(i - 1)) << 2) |
 
-							(base64map.indexOf(base64.charAt(i)) >>> 4));
 
-						break;
 
-					case 2:
 
-						bytes.push(((base64map.indexOf(base64.charAt(i - 1)) & 0xF) << 4) |
 
-							(base64map.indexOf(base64.charAt(i)) >>> 2));
 
-						break;
 
-					case 3:
 
-						bytes.push(((base64map.indexOf(base64.charAt(i - 1)) & 0x3) << 6) |
 
-							(base64map.indexOf(base64.charAt(i))));
 
-						break;
 
-				}
 
-			}
 
-
 
-			return bytes;
 
-
 
-		}
 
-
 
-	};
 
-
 
-	Crypto.HMAC = function(hasher, message, key, options) {
 
-
 
-		// Allow arbitrary length keys
 
-		key = key.length > hasher._blocksize * 4 ?
 
-			hasher(key, {
 
-				asBytes: true
 
-			}) :
 
-			util.stringToBytes(key);
 
-
 
-		// XOR keys with pad constants
 
-		var okey = key,
 
-			ikey = key.slice(0);
 
-		for (var i = 0; i < hasher._blocksize * 4; i++) {
 
-			okey[i] ^= 0x5C;
 
-			ikey[i] ^= 0x36;
 
-		}
 
-
 
-		var hmacbytes = hasher(util.bytesToString(okey) +
 
-			hasher(util.bytesToString(ikey) + message, {
 
-				asString: true
 
-			}), {
 
-				asBytes: true
 
-			});
 
-		return options && options.asBytes ? hmacbytes :
 
-			options && options.asString ? util.bytesToString(hmacbytes) :
 
-			util.bytesToHex(hmacbytes);
 
-
 
-	};
 
-	// The core
 
-	SHA1._sha1 = function(message) {
 
-
 
-		var m = util.stringToWords(message),
 
-			l = message.length * 8,
 
-			w = [],
 
-			H0 = 1732584193,
 
-			H1 = -271733879,
 
-			H2 = -1732584194,
 
-			H3 = 271733878,
 
-			H4 = -1009589776;
 
-
 
-		// Padding
 
-		m[l >> 5] |= 0x80 << (24 - l % 32);
 
-		m[((l + 64 >>> 9) << 4) + 15] = l;
 
-
 
-		for (var i = 0; i < m.length; i += 16) {
 
-
 
-			var a = H0,
 
-				b = H1,
 
-				c = H2,
 
-				d = H3,
 
-				e = H4;
 
-
 
-			for (var j = 0; j < 80; j++) {
 
-
 
-				if (j < 16) w[j] = m[i + j];
 
-				else {
 
-					var n = w[j - 3] ^ w[j - 8] ^ w[j - 14] ^ w[j - 16];
 
-					w[j] = (n << 1) | (n >>> 31);
 
-				}
 
-
 
-				var t = ((H0 << 5) | (H0 >>> 27)) + H4 + (w[j] >>> 0) + (
 
-					j < 20 ? (H1 & H2 | ~H1 & H3) + 1518500249 :
 
-					j < 40 ? (H1 ^ H2 ^ H3) + 1859775393 :
 
-					j < 60 ? (H1 & H2 | H1 & H3 | H2 & H3) - 1894007588 :
 
-					(H1 ^ H2 ^ H3) - 899497514);
 
-
 
-				H4 = H3;
 
-				H3 = H2;
 
-				H2 = (H1 << 30) | (H1 >>> 2);
 
-				H1 = H0;
 
-				H0 = t;
 
-
 
-			}
 
-
 
-			H0 += a;
 
-			H1 += b;
 
-			H2 += c;
 
-			H3 += d;
 
-			H4 += e;
 
-
 
-		}
 
-
 
-		return [H0, H1, H2, H3, H4];
 
-
 
-	};
 
-
 
-	// Package private blocksize
 
-	SHA1._blocksize = 16;
 
-
 
-	// Crypto mode namespace
 
-	Crypto.mode = {};
 
-
 
-})();
 
-console.log('oss')
 
-console.log(Crypto)
 
-return Crypto;

+ 0 - 265
unpackage/dist/dev/app-plus/hybrid/html/oss.js
Tampilan Berkas 

@@ -1,265 +0,0 @@
 
-const Crypto = {};
 
-
 
-(function() {
 
-
 
-	var base64map = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
 
-
 
-
 
-	// Crypto utilities
 
-	var util = Crypto.util = {
 
-
 
-		// Bit-wise rotate left
 
-		rotl: function(n, b) {
 
-			return (n << b) | (n >>> (32 - b));
 
-		},
 
-
 
-		// Bit-wise rotate right
 
-		rotr: function(n, b) {
 
-			return (n << (32 - b)) | (n >>> b);
 
-		},
 
-
 
-		// Swap big-endian to little-endian and vice versa
 
-		endian: function(n) {
 
-
 
-			// If number given, swap endian
 
-			if (n.constructor == Number) {
 
-				return util.rotl(n, 8) & 0x00FF00FF |
 
-					util.rotl(n, 24) & 0xFF00FF00;
 
-			}
 
-
 
-			// Else, assume array and swap all items
 
-			for (var i = 0; i < n.length; i++)
 
-				n[i] = util.endian(n[i]);
 
-			return n;
 
-
 
-		},
 
-
 
-		// Generate an array of any length of random bytes
 
-		randomBytes: function(n) {
 
-			for (var bytes = []; n > 0; n--)
 
-				bytes.push(Math.floor(Math.random() * 256));
 
-			return bytes;
 
-		},
 
-
 
-		// Convert a string to a byte array
 
-		stringToBytes: function(str) {
 
-			var bytes = [];
 
-			for (var i = 0; i < str.length; i++)
 
-				bytes.push(str.charCodeAt(i));
 
-			return bytes;
 
-		},
 
-
 
-		// Convert a byte array to a string
 
-		bytesToString: function(bytes) {
 
-			var str = [];
 
-			for (var i = 0; i < bytes.length; i++)
 
-				str.push(String.fromCharCode(bytes[i]));
 
-			return str.join("");
 
-		},
 
-
 
-		// Convert a string to big-endian 32-bit words
 
-		stringToWords: function(str) {
 
-			var words = [];
 
-			for (var c = 0, b = 0; c < str.length; c++, b += 8)
 
-				words[b >>> 5] |= str.charCodeAt(c) << (24 - b % 32);
 
-			return words;
 
-		},
 
-
 
-		// Convert a byte array to big-endian 32-bits words
 
-		bytesToWords: function(bytes) {
 
-			var words = [];
 
-			for (var i = 0, b = 0; i < bytes.length; i++, b += 8)
 
-				words[b >>> 5] |= bytes[i] << (24 - b % 32);
 
-			return words;
 
-		},
 
-
 
-		// Convert big-endian 32-bit words to a byte array
 
-		wordsToBytes: function(words) {
 
-			var bytes = [];
 
-			for (var b = 0; b < words.length * 32; b += 8)
 
-				bytes.push((words[b >>> 5] >>> (24 - b % 32)) & 0xFF);
 
-			return bytes;
 
-		},
 
-
 
-		// Convert a byte array to a hex string
 
-		bytesToHex: function(bytes) {
 
-			var hex = [];
 
-			for (var i = 0; i < bytes.length; i++) {
 
-				hex.push((bytes[i] >>> 4).toString(16));
 
-				hex.push((bytes[i] & 0xF).toString(16));
 
-			}
 
-			return hex.join("");
 
-		},
 
-
 
-		// Convert a hex string to a byte array
 
-		hexToBytes: function(hex) {
 
-			var bytes = [];
 
-			for (var c = 0; c < hex.length; c += 2)
 
-				bytes.push(parseInt(hex.substr(c, 2), 16));
 
-			return bytes;
 
-		},
 
-
 
-		// Convert a byte array to a base-64 string
 
-		bytesToBase64: function(bytes) {
 
-
 
-			// Use browser-native function if it exists
 
-			// if (typeof btoa == "function") return btoa(util.bytesToString(bytes));
 
-
 
-			var base64 = [],
 
-				overflow;
 
-
 
-			for (var i = 0; i < bytes.length; i++) {
 
-				switch (i % 3) {
 
-					case 0:
 
-						base64.push(base64map.charAt(bytes[i] >>> 2));
 
-						overflow = (bytes[i] & 0x3) << 4;
 
-						break;
 
-					case 1:
 
-						base64.push(base64map.charAt(overflow | (bytes[i] >>> 4)));
 
-						overflow = (bytes[i] & 0xF) << 2;
 
-						break;
 
-					case 2:
 
-						base64.push(base64map.charAt(overflow | (bytes[i] >>> 6)));
 
-						base64.push(base64map.charAt(bytes[i] & 0x3F));
 
-						overflow = -1;
 
-				}
 
-			}
 
-
 
-			// Encode overflow bits, if there are any
 
-			if (overflow != undefined && overflow != -1)
 
-				base64.push(base64map.charAt(overflow));
 
-
 
-			// Add padding
 
-			while (base64.length % 4 != 0) base64.push("=");
 
-
 
-			return base64.join("");
 
-
 
-		},
 
-
 
-		// Convert a base-64 string to a byte array
 
-		base64ToBytes: function(base64) {
 
-
 
-			// Use browser-native function if it exists
 
-			if (typeof atob == "function") return util.stringToBytes(atob(base64));
 
-
 
-			// Remove non-base-64 characters
 
-			base64 = base64.replace(/[^A-Z0-9+\/]/ig, "");
 
-
 
-			var bytes = [];
 
-
 
-			for (var i = 0; i < base64.length; i++) {
 
-				switch (i % 4) {
 
-					case 1:
 
-						bytes.push((base64map.indexOf(base64.charAt(i - 1)) << 2) |
 
-							(base64map.indexOf(base64.charAt(i)) >>> 4));
 
-						break;
 
-					case 2:
 
-						bytes.push(((base64map.indexOf(base64.charAt(i - 1)) & 0xF) << 4) |
 
-							(base64map.indexOf(base64.charAt(i)) >>> 2));
 
-						break;
 
-					case 3:
 
-						bytes.push(((base64map.indexOf(base64.charAt(i - 1)) & 0x3) << 6) |
 
-							(base64map.indexOf(base64.charAt(i))));
 
-						break;
 
-				}
 
-			}
 
-
 
-			return bytes;
 
-
 
-		}
 
-
 
-	};
 
-
 
-	Crypto.HMAC = function(hasher, message, key, options) {
 
-
 
-		// Allow arbitrary length keys
 
-		key = key.length > hasher._blocksize * 4 ?
 
-			hasher(key, {
 
-				asBytes: true
 
-			}) :
 
-			util.stringToBytes(key);
 
-
 
-		// XOR keys with pad constants
 
-		var okey = key,
 
-			ikey = key.slice(0);
 
-		for (var i = 0; i < hasher._blocksize * 4; i++) {
 
-			okey[i] ^= 0x5C;
 
-			ikey[i] ^= 0x36;
 
-		}
 
-
 
-		var hmacbytes = hasher(util.bytesToString(okey) +
 
-			hasher(util.bytesToString(ikey) + message, {
 
-				asString: true
 
-			}), {
 
-				asBytes: true
 
-			});
 
-		return options && options.asBytes ? hmacbytes :
 
-			options && options.asString ? util.bytesToString(hmacbytes) :
 
-			util.bytesToHex(hmacbytes);
 
-
 
-	};
 
-	// The core
 
-	SHA1._sha1 = function(message) {
 
-
 
-		var m = util.stringToWords(message),
 
-			l = message.length * 8,
 
-			w = [],
 
-			H0 = 1732584193,
 
-			H1 = -271733879,
 
-			H2 = -1732584194,
 
-			H3 = 271733878,
 
-			H4 = -1009589776;
 
-
 
-		// Padding
 
-		m[l >> 5] |= 0x80 << (24 - l % 32);
 
-		m[((l + 64 >>> 9) << 4) + 15] = l;
 
-
 
-		for (var i = 0; i < m.length; i += 16) {
 
-
 
-			var a = H0,
 
-				b = H1,
 
-				c = H2,
 
-				d = H3,
 
-				e = H4;
 
-
 
-			for (var j = 0; j < 80; j++) {
 
-
 
-				if (j < 16) w[j] = m[i + j];
 
-				else {
 
-					var n = w[j - 3] ^ w[j - 8] ^ w[j - 14] ^ w[j - 16];
 
-					w[j] = (n << 1) | (n >>> 31);
 
-				}
 
-
 
-				var t = ((H0 << 5) | (H0 >>> 27)) + H4 + (w[j] >>> 0) + (
 
-					j < 20 ? (H1 & H2 | ~H1 & H3) + 1518500249 :
 
-					j < 40 ? (H1 ^ H2 ^ H3) + 1859775393 :
 
-					j < 60 ? (H1 & H2 | H1 & H3 | H2 & H3) - 1894007588 :
 
-					(H1 ^ H2 ^ H3) - 899497514);
 
-
 
-				H4 = H3;
 
-				H3 = H2;
 
-				H2 = (H1 << 30) | (H1 >>> 2);
 
-				H1 = H0;
 
-				H0 = t;
 
-
 
-			}
 
-
 
-			H0 += a;
 
-			H1 += b;
 
-			H2 += c;
 
-			H3 += d;
 
-			H4 += e;
 
-
 
-		}
 
-
 
-		return [H0, H1, H2, H3, H4];
 
-
 
-	};
 
-
 
-	// Package private blocksize
 
-	SHA1._blocksize = 16;
 
-
 
-	// Crypto mode namespace
 
-	Crypto.mode = {};
 
-	return Crypto;
 
-})();

+ 0 - 212
unpackage/dist/dev/app-plus/hybrid/html/video - 副本.js
Tampilan Berkas 

@@ -1,212 +0,0 @@
 
-new Vue({
 
-		el: '#app',
 
-		data: {
 
-			url: '',
 
-			showVideo: false,
 
-			mediaRecorder: null,
 
-			MediaStreamTrack: null,
 
-			isAlreadyRecord: false,
 
-			count: 8,
 
-			countTimer: null,
 
-			recordedBlobs: []
 
-		},
 
-		beforeDestroy() {
 
-			this.MediaStreamTrack && this.MediaStreamTrack.stop()
 
-			this.countTimer && clearTimeout(this.countTimer)
 
-		},
 
-		computed: {},
 
-
 
-		mounted() {
 
-
 
-		},
 
-		watch: {},
 
-		methods: {
 
-			getPolicyBase64() {
 
-				let date = new Date();
 
-				date.setHours(date.getHours() + env.timeout);
 
-				let srcT = date.toISOString();
 
-				const policyText = {
 
-					"expiration": srcT, //设置该Policy的失效时间，超过这个失效时间之后，就没有办法通过这个policy上传文件了 
-					"conditions": [
 
-						["content-length-range", 0, 5 * 1024 * 1024] // 设置上传文件的大小限制,5mb
 
-					]
 
-				};
 
-
 
-				const policyBase64 = base64.encode(JSON.stringify(policyText));
 
-				console.log(policyBase64);
 
-				return policyBase64;
 
-			},
 
-			getSignature(policyBase64) {
 
-				const accesskey = 'FpClTp4OVrRRtHEfi3lBOWUoLxKieW';
 
-
 
-				const bytes = Crypto.HMAC(Crypto.SHA1, policyBase64, accesskey, {
 
-					asBytes: true
 
-				})
 
-				const signature = Crypto.util.bytesToBase64(bytes);
 
-				console.log(signature);
 
-				return signature;
 
-			},
 
-			uploadFile() {
 
-				var formdata = new FormData()
 
-				const policyBase64 = getPolicyBase64();
 
-				const signature = getSignature(policyBase64); //获取签名
 
-				formdata.append("key", "https://taohaoliang.oss-cn-beijing.aliyuncs.com")
 
-				formdata.append("policy", policyBase64)
 
-				formdata.append("OSSAccessKeyId", 'LTAI4G9c14PgKvM23WZ9zrpc')
 
-				formdata.append("signature", signature)
 
-				formdata.append("success_action_status", '200')
 
-				$.ajax({
 
-					type: "GET",
 
-					contentType: "application/json;charset=UTF-8",
 
-					url: "http://api1.eliangeyun.com/biInfoController/selectBiInfo?compId=" + compId +
 
-						'&seachMoth=' + seachMoth,
 
-					success: function(result) {
 
-						console.log("result", result);
 
-
 
-
 
-					},
 
-					//请求失败，包含具体的错误信息
 
-					error: function(e) {
 
-						console.log(e);
 
-						console.log(e.status);
 
-						console.log(e.responseText);
 
-					}
 
-				});
 
-			},
 
-			// 调用摄像头 开始录制
 
-			getCamera() {
 
-				// 注意本例需要在HTTPS协议网站中运行，新版本Chrome中getUserMedia接口在http下不再支持。
 
-				let constraints = {
 
-					audio: true,
 
-					video: {
 
-						facingMode: 'user' // 优先调前置摄像头
 
-					}
 
-				}
 
-				console.log('--------------')
 
-				console.log(navigator)
 
-				// 老的浏览器可能根本没有实现 mediaDevices，所以我们可以先设置一个空的对象
 
-				if (navigator.mediaDevices === undefined) {
 
-					navigator.mediaDevices = {}
 
-				}
 
-				// 一些浏览器部分支持 mediaDevices。我们不能直接给对象设置 getUserMedia
 
-				// 因为这样可能会覆盖已有的属性。这里我们只会在没有getUserMedia属性的时候添加它。
 
-				if (navigator.mediaDevices.getUserMedia === undefined) {
 
-					navigator.mediaDevices.getUserMedia = function(constraints) {
 
-						// 首先，如果有getUserMedia的话，就获得它
 
-						//   var getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia
 
-						var getUserMedia = navigator.getUserMedia ||
 
-							navigator.webkitGetUserMedia ||
 
-							navigator.mozGetUserMedia
 
-						// 一些浏览器根本没实现它 - 那么就返回一个error到promise的reject来保持一个统一的接口
 
-						if (!getUserMedia) {
 
-							this.$messageBox.alert('该浏览器不支持getUserMedia，请使用其他浏览器')
 
-							return Promise.reject(new Error(
 
-								'getUserMedia is not implemented in this browser'))
 
-						}
 
-						// 否则，为老的navigator.getUserMedia方法包裹一个Promise
 
-						return new Promise(function(resolve, reject) {
 
-							getUserMedia.call(navigator, constraints, resolve, reject)
 
-						})
 
-					}
 
-				}
 
-				navigator.mediaDevices.getUserMedia(constraints)
 
-					.then((stream) => {
 
-						this.MediaStreamTrack = typeof stream.stop === 'function' ? stream : stream
 
-							.getTracks()[0]
 
-						console.log(stream)
 
-						console.log(this.MediaStreamTrack)
 
-						// 显示录制框
 
-						this.showVideo = true
 
-						this.isAlreadyRecord = false
 
-						let winURL = window.URL || window.webkitURL
 
-						if ('srcObject' in this.$refs.videoRef) {
 
-							this.$refs.videoRef.srcObject = stream
 
-						} else {
 
-							this.$refs.videoRef.src = winURL.createObjectURL(stream)
 
-						}
 
-						console.log(this.$refs.videoRef)
 
-						this.$refs.videoRef.onloadedmetadata = e => {
 
-							// 播放视频
 
-							this.$refs.videoRef.play()
 
-						}
 
-						let options = {
 
-							videoBitsPerSecond: 2500000
 
-						}
 
-						this.mediaRecorder = new MediaRecorder(stream, options)
 
-					})
 
-					.catch((err) => {
 
-						console.log(err)
 
-						this.$messageBox.alert('摄像头开启失败，请检查摄像头是否授权或是否可用！')
 
-					})
 
-			},
 
-			// 关闭活体检测
 
-			closeVideo() {
 
-				this.recordedBlobs = ''
 
-				this.isAlreadyRecord = false
 
-				this.MediaStreamTrack && this.MediaStreamTrack.stop()
 
-				this.countTimer && clearTimeout(this.countTimer)
 
-				this.$router.go(0)
 
-			},
 
-			// 录制倒计时
 
-			countDown() {
 
-				let that = this
 
-				let sendTime = Math.round(+new Date() / 1000)
 
-				return function walk() {
 
-					that.countTimer = setTimeout(function() {
 
-						that.countTimer && clearTimeout(that.countTimer)
 
-						let diff = sendTime + 8 - Math.round(+new Date() / 1000)
 
-						if (diff > 0) {
 
-							that.count = diff
 
-							walk()
 
-						} else {
 
-							console.log('倒计时结束')
 
-							this.showVideo = false
 
-							console.log(this.url)
 
-							console.log(this.MediaStreamTrack)
 
-						}
 
-					}, 1000)
 
-				}
 
-			},
 
-			// 保存录制视频
 
-			saveVideo() {
 
-				if (this.isAlreadyRecord) {
 
-					this.countTimer && clearTimeout(this.countTimer)
 
-					this.showVideo = false
 
-					//当录制的数据可用时
 
-					this.mediaRecorder.ondataavailable = (e) => {
 
-						console.log(e.data)
 
-						if (e.data && e.data.size > 0) {
 
-							this.recordedBlobs.push(e.data)
 
-						}
 
-					}
 
-					this.mediaRecorder.stop()
 
-					setTimeout(() => {
 
-						var blob = new Blob(this.recordedBlobs, {
 
-							type: 'video/mp4'
 
-						})
 
-						console.log(blob)
 
-						this.isAlreadyRecord = false
 
-						this.MediaStreamTrack && this.MediaStreamTrack.stop()
 
-						var reader = new FileReader();
 
-						reader.readAsDataURL(blob, 'utf-8')
 
-						reader.onload = () => {
 
-							console.log(reader.result); // base64格式
 
-							this.$refs.videob.src = reader.result
 
-							console.log('11111111111111111')
 
-							console.log(reader)
 
-
 
-						}
 
-					}, 1000)
 
-				} else {
 
-					this.count = 8
 
-					this.isAlreadyRecord = true
 
-					this.mediaRecorder.start(8000)
 
-					this.countDown()()
 
-				}
 
-			},
 
-			changeVideo(e) {
 
-				let file = this.$refs.videoFile.files
 
-				console.log(file)
 
-			}
 
-		}
 
-	})

+ 119 - 38
unpackage/dist/dev/app-plus/hybrid/html/video.html
Tampilan Berkas 

@@ -5,46 +5,130 @@
 
 		<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
 
 		<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
 
 		<title></title>
 
 		<title></title>
 
 		<style>
 
 		<style>
 
+			body {
 
+				margin: 0;
 
+				background: #F5F6FA;
 
+			}
 
+
 
+			.content {
 
+				background: #F5F6FA;
 
+				height: 100vh;
 
+				position: relative;
 
+			}
 
+
 
+			.row {
 
+				display: flex;
 
+				justify-content: center;
 
+				padding-top: 200px;
 
+			
+			}
 
+			.img-video{
 
+					position: relative;
 
+					border-radius: 280px;
 
+					width: 564px;
 
+					height: 564px;
 
+						overflow: hidden;
 
+			}
 
 
 
+			.row2 {
 
+				display: flex;
 
+				font-size: 36px;
 
+				justify-content: center;
 
+				margin-top: 100px;
 
+			}
 
+
 
+			.verify-btn {
 
+				background: #2772FB;
 
+				font-size: 36px;
 
+				padding: 20px 0;
 
+				width: 70%;
 
+				display: flex;
 
+				justify-content: center;
 
+				align-items: center;
 
+				border-radius: 50px;
 
+				color: white;
 
+				
+			}
 
+
 
+			.btn {
 
+				position: absolute;
 
+				bottom: 0;
 
+				background: white;
 
+				width: 100%;
 
+				display: flex;
 
+				justify-content: center;
 
+				padding: 80px 0;
 
+			}
 
+			.img{
 
+				position: absolute;
 
+				top: 0;
 
+				bottom: 0;
 
+				width: 100%;
 
+				width: 564px;
 
+				height: 564px;
 
+				right: 0;
 
+				left: 0;
 
+				margin: auto;
 
+			}
 
+			.video-content{
 
+				position: absolute;
 
+				top: 0;
 
+				bottom: 0;
 
+				width: 100%;
 
+				right: 0;
 
+				left: 0;
 
+				margin: auto;
 
+			}
 
+			.video{
 
+				width: calc(100%);
 
+				background: #F5F6FA;
 
+			}
 
+			.video-btn{
 
+				width: 100%;
 
+				display: flex;
 
+				justify-content: center;
 
+			}
 
 		</style>
 
 		</style>
 
 	</head>
 
 	</head>
 
 	<body>
 
 	<body>
 
 		<div id='app'>
 
 		<div id='app'>
 
-			<div class="verify-placeholder">
 
-				<div class="verify-placeholder-img"></div>
 
-				<p class="verify-placeholder-text">正面平视手机、保证光线充足<br>请勿遮挡面部</p>
 
-			</div>
 
-			<div class="verify-bottom">
 
-				<ul class="verify-process">
 
-					<li>
 
-						<span class="num">1</span>
 
-						<p class="text">人脸放入框内，点击开始录制</p>
 
-					</li>
 
-					<li>
 
-						<span class="num">2</span>
 
-						<p class="text">录制倒计时<span class="text-tips">（8s）</span>，点击立即结束</p>
 
-					</li>
 
-					<li>
 
-						<span class="num">3</span>
 
-						<p class="text">完成录制，等待验证结果</p>
 
-					</li>
 
-				</ul>
 
-				<button class="verify-btn" @click="getCamera">开始录制</button>
 
-			</div>
 
-			<div class="btn-submit">
 
-				<button class="app-button-warning" size="small" @click="$router.back(-1)">上一步</button>
 
-				<button type="primary" size="small" class="btn">下一步</button>
 
-			</div>
 
-			<!--    人脸检测-->
 
-			<div class="video" v-show="showVideo">
 
-				<div class="video-cover"></div>
 
-				<video :src="url" ref="videoRef" autoplay playsinline x5-video-player-type="h5"></video>
 
-				<!-- 关闭按钮 -->
 
-				<button class="video-close" @click="closeVideo">×</button>
 
-				<button class="video-save" @click="saveVideo">
 
-					{{ isAlreadyRecord ? '结束录制(' + count + 's)' : '开始录制' }}</button>
 
+			<div class='content'>
 
+				<div class='row'>
 
+					<div class='img-video'>
 
+						<img src="./img/shipinrenzheng.png" alt="" class='img'>
 
+						<div class="video-content" v-show="showVideo">
 
+							<!--    人脸检测-->
 
+							<div class="video-cover"></div>
 
+							<video :src="url" ref="videoRef" autoplay playsinline x5-video-player-type="h5" class="video"></video>
 
+						</div>
 
+					</div>
 
+				</div>
 
+				<div class='row2' v-show="!showVideo">
 
+					请打开摄像头 并阅读提示文字
 
+				</div>
 
+				<div class='row2'  v-show="showVideo">
 
+					请将头像放于圆圈内，并阅读以下文字
 
+				</div>
 
+				<div class='row2'  v-show="showVideo">
 
+					网络客服过段时间浪费多少级范德萨快逻辑范德萨拉丝机多亏了房价按时付款了金坷垃所肩负的看离开静安寺了发动机as在考虑家双方都会计分录卡死范德萨拉使肌肤抵抗力
 
+				</div>
 
+				<div class='btn'>
 
+					<div class="verify-btn" @click="getCamera" v-show="!showVideo">打开摄像头</div>
 
+					
+					<div v-show="showVideo" class='video-btn'>
 
+						<div class="verify-btn"  @click="saveVideo" v-if='!isAlreadyRecord'>开始录制</div>
 
+						<div class="verify-btn" @click="saveVideo"  v-if='isAlreadyRecord'>结束录制</div>
 
+						<!-- <button class="video-close" @click="closeVideo">×</button>
 
+						<button class="video-save" @click="saveVideo">
 
+							{{ isAlreadyRecord ? '结束录制(' + count + 's)' : '开始录制' }}</button> -->
 
+					</div>
 
+				</div>
 
+
 
+				
+				<!-- <video ref="videob" controls="" name="media" v-show="!showVideo" width="100%" height="400"></video> -->
 
 			</div>
 
 			</div>
 
-			<video ref="videob" controls="" name="media" v-show="!showVideo" width="100%" height="400"></video>
 
+
 
+
 
 		</div>
 
 		</div>
 
 	</body>
 
 	</body>
 
 	<script src="vue.min.js"></script>
 
 	<script src="vue.min.js"></script>
 
@@ -107,7 +191,6 @@
 
 				uploadFile(policyBase64) {
 
 				uploadFile(policyBase64) {
 
 					var formdata = new FormData()
 
 					var formdata = new FormData()
 
 					// const policyBase64 = this.getPolicyBase64();
 
 					// const policyBase64 = this.getPolicyBase64();
 
-
 
 					console.log("policyBase64-----------------------")
 
 					console.log("policyBase64-----------------------")
 
 					console.log(policyBase64)
 
 					console.log(policyBase64)
 
 					const signature = this.getSignature(policyBase64); //获取签名
 
 					const signature = this.getSignature(policyBase64); //获取签名
 
@@ -124,8 +207,6 @@
 
 						url: 'https://taohaoliang.oss-cn-beijing.aliyuncs.com',
 
 						url: 'https://taohaoliang.oss-cn-beijing.aliyuncs.com',
 
 						success: function(result) {
 
 						success: function(result) {
 
 							console.log("result", result);
 
 							console.log("result", result);
 
-
 
-
 
 						},
 
 						},
 
 						//请求失败，包含具体的错误信息
 
 						//请求失败，包含具体的错误信息
 
 						error: function(e) {
 
 						error: function(e) {
 
@@ -255,7 +336,7 @@
 
 
 
 								console.log('11111111111111111')
 
 								console.log('11111111111111111')
 
 								console.log(reader.result); // base64格式
 
 								console.log(reader.result); // base64格式
 
-								this.$refs.videob.src = reader.result
 
+								// this.$refs.videob.src = reader.result
 
 								this.uploadFile(reader.result)
 
 								this.uploadFile(reader.result)
 
 
 
 								console.log(reader)
 
 								console.log(reader)