在想協作平台上，製作一個scratch展示練習，像"https://scratch.mit.edu/"的展示方式，讓使用者可以上傳自己的sb3檔，在網頁上執行
from zipfile import ZipFile
from io import BytesIO
# HTML 內容
html_content = """
<!DOCTYPE html>
<html lang="zh-TW">
<head>
<meta charset="UTF-8" />
<title>Scratch sb3 線上展示</title>
<style>
body {
font-family: Arial, sans-serif;
padding: 20px;
background-color: #f5f5f5;
}
#player {
width: 100%;
height: 480px;
border: 1px solid #ccc;
margin-top: 20px;
}
</style>
</head>
<body>
<h1>Scratch 線上展示平台</h1>
<p>請上傳你的 .sb3 檔案以下載與預覽：</p>
<input type="file" id="fileInput" accept=".sb3" />
<iframe id="player" src="https://turbowarp.org/player" allowfullscreen></iframe>
<script>
const fileInput = document.getElementById('fileInput');
const player = document.getElementById('player');
fileInput.addEventListener('change', function () {
const file = fileInput.files[0];
if (file && file.name.endsWith('.sb3')) {
const reader = new FileReader();
reader.onload = function (e) {
const blob = new Blob([e.target.result], { type: 'application/octet-stream' });
const url = URL.createObjectURL(blob);
player.src = `https://turbowarp.org/player?project=${url}`;
};
reader.readAsArrayBuffer(file);
} else {
alert('請選擇一個有效的 .sb3 檔案');
}
});
</script>
</body>
</html>
"""
# 產生 ZIP 檔
with ZipFile("scratch_uploader_template.zip", "w") as zip_file:
zip_file.writestr("index.html", html_content)
print("✅ 已產生 scratch_uploader_template.zip")
scratch_uploader_template.zip 內會包含：
index.html：可用瀏覽器打開，上傳 .sb3 並即時執行
TurboWarp 編輯器（可載入 .sb3）：https://turbowarp.org/editor
TurboWarp 播放器（僅播放）：https://turbowarp.org/player
<iframe src="https://turbowarp.org/123456789/embed" width="800" height="600"></iframe>
https://s3.ilc.edu.tw/projects/2672902608/editor/