feat(iframe): 添加通过URL参数filePath自动加载文件功能

新增demo页面展示iframe加载功能
添加测试数据文件public/test.ocd

demo.html

@@ -0,0 +1,71 @@
+<!doctype html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Canvas Editor Iframe Demo</title>
+    <style>
+      body { font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial; margin: 0; padding: 16px; }
+      .panel { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
+      .panel input[type="text"] { width: 420px; padding: 6px 8px; font-size: 12px; }
+      .panel button { padding: 6px 12px; font-size: 12px; cursor: pointer; }
+      iframe { width: 100%; height: 80vh; border: 1px solid #e2e6ed; }
+      small { color: #6b7280; }
+    </style>
+  </head>
+  <body>
+    <h3>父页面（同源）加载子页面 index.html（支持 ?filePath=URL）</h3>
+    <div class="panel">
+      <input id="urlInput" type="text" placeholder="输入同源文件URL或留空使用示例…" />
+      <input id="fileInput" type="file" accept=".json,.txt,.ocd" />
+      <button id="loadBtn">在 iframe 中打开</button>
+      <small>支持传入 JSON（完整编辑器数据）或纯文本（作为正文）。文件将以 blob: URL 形式传递，保证同源。</small>
+    </div>
+    <iframe id="editorFrame" src="./index.html" referrerpolicy="no-referrer"></iframe>
+
+    <script>
+      const editorFrame = document.getElementById('editorFrame')
+      const loadBtn = document.getElementById('loadBtn')
+      const urlInput = document.getElementById('urlInput')
+      const fileInput = document.getElementById('fileInput')
+
+      function setFrameSrc(fileUrl) {
+        const src = `./index.html?filePath=${encodeURIComponent(fileUrl)}`
+        editorFrame.src = src
+        console.log('[demo] 设置 iframe src:', src)
+      }
+
+      loadBtn.onclick = async () => {
+        const typedUrl = urlInput.value.trim()
+        if (typedUrl) {
+          // 直接使用同源URL
+          try {
+            // 试探一次，确保地址有效（可选）
+            await fetch(new URL(typedUrl, window.location.href))
+            setFrameSrc(typedUrl)
+            return
+          } catch (e) {
+            alert('无法访问该URL，请确认同源且可访问')
+            return
+          }
+        }
+
+        const file = fileInput.files && fileInput.files[0]
+        if (file) {
+          // 将本地选择的文件转为 blob: URL（同源），传给子页
+          const blobUrl = URL.createObjectURL(file)
+          setFrameSrc(blobUrl)
+          return
+        }
+
+        // 示例：使用内置示例JSON字符串构造 Blob
+        const example = {
+          main: [{ value: 'Hello from iframe demo' }]
+        }
+        const blob = new Blob([JSON.stringify(example)], { type: 'application/json' })
+        const blobUrl = URL.createObjectURL(blob)
+        setFrameSrc(blobUrl)
+      }
+    </script>
+  </body>
+  </html>