238 lines
9.6 KiB
HTML
238 lines
9.6 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Asset Protocol Access Test</title>
|
|
<style>
|
|
body { font-family: Arial, sans-serif; margin: 20px; }
|
|
.test-item { margin: 10px 0; padding: 10px; border: 1px solid #ccc; }
|
|
.success { background-color: #d4edda; border-color: #c3e6cb; }
|
|
.error { background-color: #f8d7da; border-color: #f5c6cb; }
|
|
.pending { background-color: #fff3cd; border-color: #ffeaa7; }
|
|
button { margin: 5px; padding: 5px 10px; }
|
|
img, video { max-width: 200px; max-height: 150px; margin: 5px; }
|
|
.log { background: #f8f9fa; padding: 10px; margin: 10px 0; font-family: monospace; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Tauri Asset Protocol 访问测试</h1>
|
|
|
|
<div>
|
|
<h2>测试路径</h2>
|
|
<div>
|
|
<label>测试路径: </label>
|
|
<input type="text" id="testPath" value="C:\Users\imeep\.mixvideo\temp\video_segments" style="width: 400px;">
|
|
<button onclick="testPath()">测试路径</button>
|
|
</div>
|
|
|
|
<div>
|
|
<label>测试文件: </label>
|
|
<input type="text" id="testFile" value="C:\Users\imeep\.mixvideo\temp\video_segments\test.mp4" style="width: 400px;">
|
|
<button onclick="testFile()">测试文件</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<h2>预设测试</h2>
|
|
<button onclick="testCommonPaths()">测试常用路径</button>
|
|
<button onclick="testMixvideoPath()">测试 .mixvideo 路径</button>
|
|
<button onclick="clearResults()">清除结果</button>
|
|
</div>
|
|
|
|
<div id="results"></div>
|
|
|
|
<div>
|
|
<h2>调试日志</h2>
|
|
<div id="log" class="log"></div>
|
|
</div>
|
|
|
|
<script>
|
|
function log(message) {
|
|
const logDiv = document.getElementById('log');
|
|
const timestamp = new Date().toLocaleTimeString();
|
|
logDiv.innerHTML += `[${timestamp}] ${message}\n`;
|
|
logDiv.scrollTop = logDiv.scrollHeight;
|
|
console.log(message);
|
|
}
|
|
|
|
function addResult(path, status, message, element = null) {
|
|
const resultsDiv = document.getElementById('results');
|
|
const div = document.createElement('div');
|
|
div.className = `test-item ${status}`;
|
|
|
|
let content = `<strong>路径:</strong> ${path}<br><strong>状态:</strong> ${message}`;
|
|
if (element) {
|
|
content += '<br>';
|
|
div.appendChild(document.createTextNode(''));
|
|
div.innerHTML = content;
|
|
div.appendChild(element);
|
|
} else {
|
|
div.innerHTML = content;
|
|
}
|
|
|
|
resultsDiv.appendChild(div);
|
|
}
|
|
|
|
async function testAssetUrl(path, type = 'fetch') {
|
|
try {
|
|
// 使用 Tauri 的 convertFileSrc
|
|
const { convertFileSrc } = window.__TAURI__.core;
|
|
const assetUrl = convertFileSrc(path);
|
|
|
|
log(`Testing: ${path} -> ${assetUrl}`);
|
|
|
|
if (type === 'image') {
|
|
return new Promise((resolve, reject) => {
|
|
const img = new Image();
|
|
img.onload = () => {
|
|
log(`✅ Image loaded: ${path}`);
|
|
resolve({ success: true, element: img, url: assetUrl });
|
|
};
|
|
img.onerror = (e) => {
|
|
log(`❌ Image failed: ${path} - ${e}`);
|
|
reject(new Error('Image load failed'));
|
|
};
|
|
img.src = assetUrl;
|
|
});
|
|
} else if (type === 'video') {
|
|
return new Promise((resolve, reject) => {
|
|
const video = document.createElement('video');
|
|
video.controls = true;
|
|
video.onloadedmetadata = () => {
|
|
log(`✅ Video loaded: ${path} (${video.duration}s)`);
|
|
resolve({ success: true, element: video, url: assetUrl });
|
|
};
|
|
video.onerror = (e) => {
|
|
log(`❌ Video failed: ${path} - ${e}`);
|
|
reject(new Error('Video load failed'));
|
|
};
|
|
video.src = assetUrl;
|
|
});
|
|
} else {
|
|
// Fetch test
|
|
const response = await fetch(assetUrl);
|
|
if (response.ok) {
|
|
const size = response.headers.get('content-length');
|
|
log(`✅ Fetch success: ${path} (${size} bytes)`);
|
|
return { success: true, url: assetUrl, size };
|
|
} else {
|
|
throw new Error(`HTTP ${response.status}`);
|
|
}
|
|
}
|
|
} catch (error) {
|
|
log(`❌ Test failed: ${path} - ${error.message}`);
|
|
throw error;
|
|
}
|
|
}
|
|
|
|
async function testPath() {
|
|
const path = document.getElementById('testPath').value;
|
|
if (!path) return;
|
|
|
|
try {
|
|
const result = await testAssetUrl(path, 'fetch');
|
|
addResult(path, 'success', `访问成功 (${result.size} bytes)`);
|
|
} catch (error) {
|
|
addResult(path, 'error', `访问失败: ${error.message}`);
|
|
}
|
|
}
|
|
|
|
async function testFile() {
|
|
const path = document.getElementById('testFile').value;
|
|
if (!path) return;
|
|
|
|
const ext = path.toLowerCase().split('.').pop();
|
|
let type = 'fetch';
|
|
|
|
if (['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'].includes(ext)) {
|
|
type = 'image';
|
|
} else if (['mp4', 'avi', 'mov', 'mkv', 'webm'].includes(ext)) {
|
|
type = 'video';
|
|
}
|
|
|
|
try {
|
|
const result = await testAssetUrl(path, type);
|
|
addResult(path, 'success', `${type} 加载成功`, result.element);
|
|
} catch (error) {
|
|
addResult(path, 'error', `${type} 加载失败: ${error.message}`);
|
|
}
|
|
}
|
|
|
|
async function testCommonPaths() {
|
|
const paths = [
|
|
'C:\\Users\\imeep\\Desktop',
|
|
'C:\\Users\\imeep\\Documents',
|
|
'C:\\Users\\imeep\\Downloads',
|
|
'C:\\Users\\imeep\\.mixvideo',
|
|
'C:\\Users\\imeep\\.mixvideo\\temp',
|
|
'C:\\Users\\imeep\\.mixvideo\\temp\\video_segments'
|
|
];
|
|
|
|
for (const path of paths) {
|
|
try {
|
|
addResult(path, 'pending', '测试中...');
|
|
await testAssetUrl(path, 'fetch');
|
|
// 更新结果
|
|
const items = document.querySelectorAll('.test-item');
|
|
const lastItem = items[items.length - 1];
|
|
lastItem.className = 'test-item success';
|
|
lastItem.innerHTML = `<strong>路径:</strong> ${path}<br><strong>状态:</strong> 访问成功`;
|
|
} catch (error) {
|
|
const items = document.querySelectorAll('.test-item');
|
|
const lastItem = items[items.length - 1];
|
|
lastItem.className = 'test-item error';
|
|
lastItem.innerHTML = `<strong>路径:</strong> ${path}<br><strong>状态:</strong> 访问失败: ${error.message}`;
|
|
}
|
|
}
|
|
}
|
|
|
|
async function testMixvideoPath() {
|
|
const basePath = 'C:\\Users\\imeep\\.mixvideo';
|
|
const subPaths = [
|
|
'',
|
|
'\\temp',
|
|
'\\temp\\cache',
|
|
'\\temp\\video_segments',
|
|
'\\temp\\original_videos',
|
|
'\\temp\\thumbnails'
|
|
];
|
|
|
|
for (const subPath of subPaths) {
|
|
const fullPath = basePath + subPath;
|
|
try {
|
|
addResult(fullPath, 'pending', '测试中...');
|
|
await testAssetUrl(fullPath, 'fetch');
|
|
// 更新结果
|
|
const items = document.querySelectorAll('.test-item');
|
|
const lastItem = items[items.length - 1];
|
|
lastItem.className = 'test-item success';
|
|
lastItem.innerHTML = `<strong>路径:</strong> ${fullPath}<br><strong>状态:</strong> 访问成功`;
|
|
} catch (error) {
|
|
const items = document.querySelectorAll('.test-item');
|
|
const lastItem = items[items.length - 1];
|
|
lastItem.className = 'test-item error';
|
|
lastItem.innerHTML = `<strong>路径:</strong> ${fullPath}<br><strong>状态:</strong> 访问失败: ${error.message}`;
|
|
}
|
|
}
|
|
}
|
|
|
|
function clearResults() {
|
|
document.getElementById('results').innerHTML = '';
|
|
document.getElementById('log').innerHTML = '';
|
|
}
|
|
|
|
// 页面加载时的初始化
|
|
window.addEventListener('DOMContentLoaded', () => {
|
|
log('Asset Protocol 测试工具已加载');
|
|
log('当前 User Agent: ' + navigator.userAgent);
|
|
|
|
// 检查 Tauri API 是否可用
|
|
if (window.__TAURI__) {
|
|
log('✅ Tauri API 可用');
|
|
} else {
|
|
log('❌ Tauri API 不可用 - 请在 Tauri 应用中运行此测试');
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|