萤石云对接、温湿度卡片合并、接口更新

2025-10-06 15:06:48 +08:00
parent 5f20cc7cd3
commit 4b65bea0bb
21 changed files with 5445 additions and 1027 deletions
--- a/src/static/html/ezviz-iframe.html
+++ b/src/static/html/ezviz-iframe.html
@ -0,0 +1,130 @@
+<!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>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+        
+        html, body {
+            width: 100%;
+            height: 100%;
+            overflow: hidden;
+            /* background: #1a1a1a; */
+            position: relative;
+        }
+        
+        #player-iframe {
+            width: 100%;
+            height: 50%;
+            border: none;
+            display: block;
+            object-fit: contain; /* 保持视频比例，不变形 */
+        }
+        
+        .loading {
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+            color: white;
+            font-size: 14px;
+            text-align: center;
+            background: rgba(0, 0, 0, 0.7);
+            padding: 15px 30px;
+            border-radius: 8px;
+            z-index: 10;
+        }
+        
+        .loading::after {
+            content: '';
+            display: block;
+            width: 20px;
+            height: 20px;
+            margin: 10px auto 0;
+            border: 3px solid rgba(255, 255, 255, 0.3);
+            border-top-color: white;
+            border-radius: 50%;
+            animation: spin 1s linear infinite;
+        }
+        
+        @keyframes spin {
+            to { transform: rotate(360deg); }
+        }
+    </style>
+</head>
+<body>
+    <div class="loading" id="loading">正在加载播放器...</div>
+    <iframe id="player-iframe" allow="autoplay; fullscreen"></iframe>
+
+    <script>
+        function log(message) {
+            console.log('[iframe播放器] ' + message);
+        }
+        
+        // 从URL参数获取配置
+        function getConfig() {
+            const params = new URLSearchParams(window.location.search);
+            return {
+                accessToken: params.get('accessToken'),
+                playUrl: params.get('playUrl')
+            };
+        }
+        
+        // 初始化播放器
+        function init() {
+            log('初始化开始');
+            
+            const config = getConfig();
+            
+            if (!config.accessToken || !config.playUrl) {
+                log('配置参数不完整');
+                document.getElementById('loading').textContent = '配置参数错误';
+                return;
+            }
+            
+            log('AccessToken: ' + config.accessToken.substring(0, 20) + '...');
+            log('PlayUrl: ' + config.playUrl);
+            
+            try {
+                // 使用萤石云官方iframe播放器（内存占用小）
+                const iframeUrl = 'https://open.ys7.com/ezopen/h5/iframe?' +
+                    'url=' + encodeURIComponent(config.playUrl) +
+                    '&accessToken=' + encodeURIComponent(config.accessToken) +
+                    '&width=100%' +
+                    '&height=100%' +
+                    '&autoplay=1' +
+                    '&audio=1' +
+                    '&controls=1';
+                
+                log('iframe URL: ' + iframeUrl);
+                
+                const iframe = document.getElementById('player-iframe');
+                iframe.src = iframeUrl;
+                
+                // 隐藏loading
+                setTimeout(() => {
+                    document.getElementById('loading').style.display = 'none';
+                    log('播放器加载完成');
+                }, 2000);
+                
+            } catch (error) {
+                log('初始化失败: ' + error.message);
+                document.getElementById('loading').textContent = '初始化失败';
+            }
+        }
+        
+        // 页面加载完成后初始化
+        window.onload = function() {
+            log('页面加载完成');
+            init();
+        };
+    </script>
+</body>
+</html>
+