92 lines
3.4 KiB
HTML
92 lines
3.4 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>ZAPlayer 构建测试</title>
|
||
<style>
|
||
body { font-family: Arial, sans-serif; margin: 20px; }
|
||
.test-section { margin: 30px 0; padding: 20px; border: 1px solid #ccc; }
|
||
.video-container { width: 640px; height: 360px; margin: 10px 0; }
|
||
.success { color: green; }
|
||
.error { color: red; }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<h1>ZAPlayer 构建文件测试</h1>
|
||
|
||
<div class="test-section">
|
||
<h2>测试1：UMD格式 (za-player.min.js)</h2>
|
||
<div id="container1" class="video-container"></div>
|
||
<div id="status1"></div>
|
||
</div>
|
||
|
||
<div class="test-section">
|
||
<h2>测试2：ES模块格式 (za-player.es.js)</h2>
|
||
<div id="container2" class="video-container"></div>
|
||
<div id="status2"></div>
|
||
</div>
|
||
|
||
<!-- 测试UMD格式 -->
|
||
<script src="dist/za-player.min.js"></script>
|
||
<script>
|
||
function testUMD() {
|
||
const status = document.getElementById('status1');
|
||
try {
|
||
if (typeof ZAPlayer === 'undefined') {
|
||
throw new Error('ZAPlayer 未定义 - UMD构建可能失败');
|
||
}
|
||
|
||
const player = new ZAPlayer('#container1', {
|
||
type: 'flv',
|
||
src: 'http://192.168.1.200:10037/live/PUGE0hFBYluVe_01.flv?expired=20260323151552'
|
||
});
|
||
|
||
if (player && player.player) {
|
||
status.innerHTML = '<span class="success">✓ UMD格式测试成功！ZAPlayer可用</span>';
|
||
console.log('UMD格式测试通过');
|
||
} else {
|
||
throw new Error('播放器创建失败');
|
||
}
|
||
} catch (error) {
|
||
status.innerHTML = `<span class="error">✗ UMD格式测试失败: ${error.message}</span>`;
|
||
console.error('UMD格式测试失败:', error);
|
||
}
|
||
}
|
||
|
||
// 延迟执行，确保脚本加载完成
|
||
setTimeout(testUMD, 100);
|
||
</script>
|
||
|
||
<!-- 测试ES模块格式 -->
|
||
<script type="module">
|
||
import ZAPlayer from './dist/za-player.es.js';
|
||
|
||
function testES() {
|
||
const status = document.getElementById('status2');
|
||
try {
|
||
if (typeof ZAPlayer === 'undefined') {
|
||
throw new Error('ZAPlayer 未定义 - ES模块构建可能失败');
|
||
}
|
||
|
||
const player = new ZAPlayer('#container2', {
|
||
type: 'hls',
|
||
src: 'http://192.168.1.201:9080/DS-2CD5026FWD20180811AACH220809006/0000000B/hls.m3u8'
|
||
});
|
||
|
||
if (player && player.player) {
|
||
status.innerHTML = '<span class="success">✓ ES模块格式测试成功！ZAPlayer可用</span>';
|
||
console.log('ES模块格式测试通过');
|
||
} else {
|
||
throw new Error('播放器创建失败');
|
||
}
|
||
} catch (error) {
|
||
status.innerHTML = `<span class="error">✗ ES模块格式测试失败: ${error.message}</span>`;
|
||
console.error('ES模块格式测试失败:', error);
|
||
}
|
||
}
|
||
|
||
testES();
|
||
</script>
|
||
</body>
|
||
</html> |