|
|
@@ -1,132 +0,0 @@
|
|
|
-<!DOCTYPE html>
|
|
|
-<html lang="zh-CN">
|
|
|
-<head>
|
|
|
- <meta charset="UTF-8">
|
|
|
- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
|
|
- <title>安全人机验证</title>
|
|
|
- <!-- 引入阿里云验证码 2.0 Web SDK -->
|
|
|
- <script src="https://g.alicdn.com/gcaptchas/kidd/1.0.0/index.js"></script>
|
|
|
- <!-- 引入 uni-app SDK 用于向 App 发送消息 -->
|
|
|
- <script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>
|
|
|
- <style>
|
|
|
- html, body {
|
|
|
- margin: 0;
|
|
|
- padding: 0;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- background-color: rgba(0, 0, 0, 0.4);
|
|
|
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
|
- }
|
|
|
- .captcha-card {
|
|
|
- width: 85%;
|
|
|
- max-width: 340px;
|
|
|
- background: #ffffff;
|
|
|
- border-radius: 12px;
|
|
|
- box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
|
|
|
- overflow: hidden;
|
|
|
- box-sizing: border-box;
|
|
|
- padding: 20px;
|
|
|
- position: relative;
|
|
|
- }
|
|
|
- .captcha-header {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
- .captcha-title {
|
|
|
- font-size: 16px;
|
|
|
- font-weight: bold;
|
|
|
- color: #333333;
|
|
|
- }
|
|
|
- .captcha-close {
|
|
|
- font-size: 20px;
|
|
|
- color: #999999;
|
|
|
- cursor: pointer;
|
|
|
- border: none;
|
|
|
- background: none;
|
|
|
- padding: 0 5px;
|
|
|
- line-height: 1;
|
|
|
- }
|
|
|
- #ali-captcha {
|
|
|
- width: 100%;
|
|
|
- min-height: 100px;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
- .loading-tip {
|
|
|
- color: #666666;
|
|
|
- font-size: 14px;
|
|
|
- }
|
|
|
- </style>
|
|
|
-</head>
|
|
|
-<body>
|
|
|
- <div class="captcha-card">
|
|
|
- <div class="captcha-header">
|
|
|
- <span class="captcha-title">安全验证</span>
|
|
|
- <button class="captcha-close" onclick="cancelCaptcha()">×</button>
|
|
|
- </div>
|
|
|
- <div id="ali-captcha">
|
|
|
- <div class="loading-tip">正在加载验证组件...</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <script>
|
|
|
- // 解析 URL 参数
|
|
|
- function getQueryParam(name) {
|
|
|
- var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
|
|
|
- var r = window.location.search.substr(1).match(reg);
|
|
|
- if (r != null) return decodeURIComponent(r[2]);
|
|
|
- return null;
|
|
|
- }
|
|
|
-
|
|
|
- var sceneId = getQueryParam('sceneId') || 'YOUR_SCENE_ID'; // 默认场景ID
|
|
|
-
|
|
|
- function cancelCaptcha() {
|
|
|
- if (window.uni) {
|
|
|
- uni.postMessage({
|
|
|
- data: {
|
|
|
- action: 'captcha_cancel'
|
|
|
- }
|
|
|
- });
|
|
|
- // 延迟一小会儿后尝试后退，确保消息发出
|
|
|
- setTimeout(function() {
|
|
|
- uni.navigateBack();
|
|
|
- }, 100);
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- document.addEventListener('UniAppJSBridgeReady', function() {
|
|
|
- // 清空加载提示
|
|
|
- var container = document.getElementById('ali-captcha');
|
|
|
- container.innerHTML = '';
|
|
|
-
|
|
|
- // 初始化阿里云验证码 2.0
|
|
|
- initAliyunCaptcha({
|
|
|
- SceneId: sceneId,
|
|
|
- prefix: 'ali-captcha',
|
|
|
- mode: 'embed',
|
|
|
- element: '#ali-captcha',
|
|
|
- button: null, // 嵌入式，不需要绑定外部按钮
|
|
|
- captchaVerifyCallback: function(captchaVerifyParam) {
|
|
|
- // 验证成功，向 App 发送凭证
|
|
|
- uni.postMessage({
|
|
|
- data: {
|
|
|
- action: 'captcha_success',
|
|
|
- captchaVerifyParam: captchaVerifyParam
|
|
|
- }
|
|
|
- });
|
|
|
- return Promise.resolve();
|
|
|
- },
|
|
|
- onBizResultCallback: function(bizResult) {
|
|
|
- // 业务校验回调
|
|
|
- }
|
|
|
- });
|
|
|
- });
|
|
|
- </script>
|
|
|
-</body>
|
|
|
-</html>
|
