|
|
@@ -20,14 +20,15 @@
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
padding-top: 200px;
|
|
|
-
|
|
|
+
|
|
|
}
|
|
|
- .img-video{
|
|
|
- position: relative;
|
|
|
- border-radius: 280px;
|
|
|
- width: 564px;
|
|
|
- height: 564px;
|
|
|
- overflow: hidden;
|
|
|
+
|
|
|
+ .img-video {
|
|
|
+ position: relative;
|
|
|
+ border-radius: 280px;
|
|
|
+ width: 564px;
|
|
|
+ height: 564px;
|
|
|
+ overflow: hidden;
|
|
|
}
|
|
|
|
|
|
.row2 {
|
|
|
@@ -47,7 +48,7 @@
|
|
|
align-items: center;
|
|
|
border-radius: 50px;
|
|
|
color: white;
|
|
|
-
|
|
|
+
|
|
|
}
|
|
|
|
|
|
.btn {
|
|
|
@@ -59,7 +60,8 @@
|
|
|
justify-content: center;
|
|
|
padding: 80px 0;
|
|
|
}
|
|
|
- .img{
|
|
|
+
|
|
|
+ .img {
|
|
|
position: absolute;
|
|
|
top: 0;
|
|
|
bottom: 0;
|
|
|
@@ -70,7 +72,8 @@
|
|
|
left: 0;
|
|
|
margin: auto;
|
|
|
}
|
|
|
- .video-content{
|
|
|
+
|
|
|
+ .video-content {
|
|
|
position: absolute;
|
|
|
top: 0;
|
|
|
bottom: 0;
|
|
|
@@ -79,11 +82,13 @@
|
|
|
left: 0;
|
|
|
margin: auto;
|
|
|
}
|
|
|
- .video{
|
|
|
+
|
|
|
+ .video {
|
|
|
width: calc(100%);
|
|
|
background: #F5F6FA;
|
|
|
}
|
|
|
- .video-btn{
|
|
|
+
|
|
|
+ .video-btn {
|
|
|
width: 100%;
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
@@ -99,32 +104,33 @@
|
|
|
<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>
|
|
|
+ <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 class='row2' v-show="showVideo">
|
|
|
请将头像放于圆圈内，并阅读以下文字
|
|
|
</div>
|
|
|
- <div class='row2' v-show="showVideo">
|
|
|
+ <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>
|
|
|
+ <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>
|
|
|
|
|
|
@@ -196,7 +202,8 @@
|
|
|
const signature = this.getSignature(policyBase64); //获取签名
|
|
|
console.log("signatur--------------------------------------e")
|
|
|
console.log(signature)
|
|
|
- formdata.append("key", 'appData/' + new Date().getTime() + Math.floor(Math.random() * 150) + '.png')
|
|
|
+ formdata.append("key", 'appData/' + new Date().getTime() + Math.floor(Math.random() * 150) +
|
|
|
+ '.png')
|
|
|
formdata.append("policy", policyBase64)
|
|
|
formdata.append("OSSAccessKeyId", 'LTAI4G9c14PgKvM23WZ9zrpc')
|
|
|
// E9996KCDUh5wSzsJjHzqaq/FmHk=
|
|
|
@@ -205,13 +212,14 @@
|
|
|
formdata.append("success_action_status", '200')
|
|
|
$.ajax({
|
|
|
type: "POST",
|
|
|
- contentType: "application/json;charset=UTF-8",
|
|
|
+ data: formdata,
|
|
|
+ contentType : false,
|
|
|
+ processData : false,
|
|
|
url: 'https://taohaoliang.oss-cn-beijing.aliyuncs.com',
|
|
|
- data:formdata,
|
|
|
success: function(result) {
|
|
|
console.log("result", result);
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
//请求失败，包含具体的错误信息
|
|
|
error: function(e) {
|
|
|
console.log(e);
|
