<!DOCTYPE html>
<html>
<head>
<title>Worker 中调试 Summarizer</title>
</head>
<body>
<h1>Worker 中的 Summarizer 测试</h1>
<div>
<button onclick="startWorker()">启动 Worker</button>
<button onclick="sendToWorker()">发送消息到 Worker</button>
<button onclick="stopWorker()">停止 Worker</button>
</div>
<div id="output" style="margin-top: 20px; padding: 10px; border: 1px solid #ccc; min-height: 100px;"></div>
<script>
let worker = null;
const output = document.getElementById('output');
function log(message) {
output.innerHTML += `<div>${new Date().toLocaleTimeString()}: ${message}</div>`;
console.log(message);
}
debugger;;
function startWorker() {
if (worker) {
log("Worker 已经在运行");
return;
}
log("正在创建 Worker...");
// 创建内联 Worker
const workerCode = `
// Worker 脚本
debugger;;;
console.log("Worker 启动");
// 检查 Summarizer
console.log("Worker 中 typeof Summarizer:", typeof Summarizer);
console.log("Worker 中 Summarizer:", Summarizer);
if (typeof Summarizer !== 'undefined') {
console.log("Worker 可以访问 Summarizer!");
console.log("Summarizer.availability:", Summarizer.availability);
if (Summarizer.availability) {
try {
const avail = Summarizer.availability();
console.log("Worker 中 Summarizer.availability():", avail);
// 发送回主线程
self.postMessage({
type: 'summarizer_info',
available: true,
availability: avail
});
} catch (e) {
console.error("Worker 中调用 availability 错误:", e);
}
}
} else {
console.log("Worker 无法访问 Summarizer");
self.postMessage({
type: 'summarizer_info',
available: false
});
}
// 监听主线程消息
self.onmessage = function(e) {
console.log("Worker 收到消息:", e.data);
if (e.data.type === 'test') {
if (typeof Summarizer !== 'undefined' && Summarizer.create) {
// 在 Worker 中尝试使用 Summarizer
Summarizer.create().then(summarizer => {
console.log("Worker 中创建 Summarizer 成功:", summarizer);
self.postMessage({
type: 'result',
message: 'Worker 中 Summarizer 创建成功',
summarizerType: typeof summarizer
});
}).catch(err => {
self.postMessage({
type: 'error',
message: 'Worker 中创建失败: ' + err.message
});
});
} else {
self.postMessage({
type: 'result',
message: 'Worker 中 Summarizer 不可用',
hasSummarizer: typeof Summarizer !== 'undefined',
hasCreate: Summarizer && Summarizer.create
});
}
}
};
// 发送就绪消息
self.postMessage({type: 'ready'});
`;
const blob = new Blob([workerCode], {type: 'application/javascript'});
const blobUrl = URL.createObjectURL(blob);
worker = new Worker(blobUrl);
worker.onmessage = function(e) {
const data = e.data;
log(`Worker 消息: ${JSON.stringify(data)}`);
if (data.type === 'summarizer_info') {
if (data.available) {
log("✅ Worker 可以访问 Summarizer");
log(`可用性信息: ${JSON.stringify(data.availability)}`);
} else {
log("❌ Worker 无法访问 Summarizer");
}
}
};
worker.onerror = function(error) {
log(`Worker 错误: ${error.message} (行: \${error.lineno})`);
};
log("Worker 已创建");
}
function sendToWorker() {
if (!worker) {
log("请先启动 Worker");
return;
}
log("发送测试消息到 Worker...");
worker.postMessage({
type: 'test',
timestamp: new Date().toISOString(),
text: "测试文本"
});
}
function stopWorker() {
if (worker) {
worker.terminate();
worker = null;
log("Worker 已停止");
}
}
// 页面加载时检查主线程
log("主线程检查 Summarizer:");
log("typeof Summarizer: " + typeof Summarizer);
if (typeof Summarizer !== 'undefined') {
log("✅ 主线程有 Summarizer");
if (Summarizer.availability) {
try {
const avail = Summarizer.availability();
log("Summarizer.availability(): " + JSON.stringify(avail));
} catch (e) {
log("调用 availability 错误: " + e.message);
}
}
} else {
log("❌ 主线程没有 Summarizer");
}
</script>
</body>
</html>
浙公网安备 33010602011771号