1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950 |
- <!DOCTYPE html>
- <html>
- <head>
- <title>视频播放测试</title>
- <!--
- 自定义API基础URL(可选):
- <script>window.API_BASE_URL = 'http://your-custom-domain:port';</script>
- 如果不设置,将自动使用当前页面的域名和端口
- -->
- </head>
- <body>
- <h1>视频播放测试</h1>
-
- <video width="640" height="480" controls>
- <source id="video-source" src="" type="video/mp4">
- 您的浏览器不支持视频播放。
- </video>
-
- <script>
- // 动态获取API基础URL,支持不同环境部署
- function getApiBase() {
- // 优先使用环境变量或配置
- if (window.API_BASE_URL) {
- return window.API_BASE_URL;
- }
-
- // 默认使用当前页面的主机和端口
- return `${window.location.protocol}//${window.location.host}`;
- }
-
- const API_BASE = getApiBase();
- console.log('当前 API 基础URL:', API_BASE);
-
- // 设置视频源
- document.getElementById('video-source').src = `${API_BASE}/videos/20251010_160000/test_stream1.mp4`;
-
- const video = document.querySelector('video');
- video.addEventListener('error', (e) => {
- console.log('视频加载错误:', e);
- console.log('尝试的URL:', e.target.src);
- });
- video.addEventListener('loadstart', () => {
- console.log('开始加载视频');
- });
- video.addEventListener('canplay', () => {
- console.log('视频可以播放');
- });
- </script>
- </body>
- </html>
|