2025-08-14 22:38:11 +01:00

139 lines
4.7 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="WebRTC code samples">
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1, maximum-scale=1">
<meta name="mobile-web-app-capable" content="yes">
<base target="_blank">
<title>AI验真</title>
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/loading.css">
</head>
<body>
<div class="loading" id="loading">
<div>
<div class="lds-roller"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
</div>
<div>
AI摄像头加载中...
</div>
</div>
<div id="container">
<div>
<div class="camoverlay">
<div class="upper overlay">
<div>
<div class="qrarc">
<img class="topleft arc" src="images/arc.png" />
<img class="topright arc" src="images/arc.png" />
<img class="bottomleft arc" src="images/arc.png" />
<img class="bottomright arc" src="images/arc.png" />
</div>
</div>
<div class="hint wrapper">
<div id="hint" class="upper text" onclick="debug_countdown()">
对齐定位点
</div>
</div>
</div>
</div>
<video class="preview" id="video" autoplay muted playsinline></video>
</div>
<div class="bottomfixed">
<div class="play action" onclick="show_modal('scanguide')">
<img
class="play"
src="images/play-button.png"
/>
验证演示
</div>
<div class="torch action" onclick="toggle_torch()">
<img
class="torch"
src="images/flash-button.png"
/>
开启补光
</div>
<div class="hidden tooltip"><span class="tooltiptext">遇到困难?</span></div>
</div>
<div class="hidden debug" id="debug_div">
<div class="buttons">
<button onclick="location.reload()">reload</button>
<button onclick="set_zoom(4)">4x zoom</button>
<button onclick="set_zoom(2)">2x zoom</button>
<button onclick="wx_submit('debug')">WX OK</button>
<button onclick="torch_onoff()">Torch</button>
<button onclick="hide_debug()">Hide</button>
</div>
<div>
<canvas class="hidden" id="original" width="2000" height="2000">
</canvas>
<canvas class="hidden" id="grayscale" width="2000" height="2000">
</canvas>
</div>
<div id="logs" class="bordered">
</div>
<div class="bordered">
Caps: <span id="caps"></span>
</div>
<div class="bordered">
Constraints: <span id="cons"></span>
</div>
</div>
<div class="modal hidden">
<div class="panel">
<div class="scanguide hidden">
<div id="scanguide">
</div>
</div>
<div class="serviceqr hidden">
<div class="imgbox">
<img id="service_img" src="https://emblem-resources.oss-accelerate.aliyuncs.com/service-qr2.png" alt=""/>
</div>
<div class="title">
长按识别二维码,添加人工客服
</div>
</div>
<div class="verifyfailed hidden">
<div class="circle">
!
</div>
<div class="title">验证未通过</div>
<div class="hints">
<div>
请按照验证指引
</div>
<div>重新验证</div>
<div>
-
</div>
<div>如反复验证仍无法通过</div>
<div>请联系人工客服</div>
</div>
</div>
<div class="actions">
<button onclick="show_modal('serviceqr')" class="service">人工客服</button>
<button onclick="hide_modal()" class="back">
<img class="return" src="images/return.png" alt=""/>
采集</button>
</div>
</div>
</div>
</div>
<div class="verifyspin hidden">
<div class="spinner">
<img src="images/spinner.png" class="spin-image spin-and-shrink">
</div>
<div class="loading">
Loading
</div>
</div>
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
<script type="text/javascript" src="js/lottie.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript" src="js/qrtool.web.js"></script>
</body>
</html>