Notion 不支持直接运行自定义 HTML，因官方禁止 script、iframe（非白名单）及内联事件；唯一合法方式是将完整页面部署至 HTTPS 外部地址后用 /embed 嵌入。
Notion 里根本不能直接运行自定义 HTML
Notion 官方不支持在页面中插入可执行的 <script></script>、（除白名单域名外）、或内联事件处理器（如 onclick）。你粘贴的 HTML 会被自动过滤或静默丢弃，尤其是含 script、style、iframe 的片段——这不是配置问题，是平台安全策略。
唯一合法嵌入方式：用 Embed 块 + 外部托管 URL
想让 HTML 内容“看起来可交互”，必须把完整页面（含 HTML/CSS/JS）部署到公网可访问地址，再用 Notion 的 /embed 命令插入。Notion 只允许嵌入特定服务商（如 CodePen、JSFiddle、YouTube），或符合 X-Frame-Options 和 Content-Security-Policy 兼容要求的外部页面。
常见可行路径：
- 把 HTML 打包成单页（比如用
index.html+main.js），部署到Vercel、Netlify或 GitHub Pages - 确保部署后的页面响应头不含
X-Frame-Options: deny或frame-ancestors 'none' - 在 Notion 中输入
/embed→ 粘贴该页面完整 URL（必须以https://开头） - Notion 会尝试加载为
；若失败，提示 “This embed isn’t supported”
为什么本地文件（file://）或 localhost 一定失败
Notion 桌面端和网页端均禁止加载非 HTTPS 的嵌入源。即使你本地起一个 http://localhost:3000 服务，Notion 也会直接拦截，控制台报错 Refused to display 'http://localhost:3000/' in a frame because it set 'X-Frame-Options' to 'sameorigin'. 或更常见的 Load denied by X-Frame-Options。
实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
绕不过去，没有例外。连 127.0.0.1 都不行，必须是真实 HTTPS 域名。
能用但极受限的“伪交互”技巧
如果只是需要简单展开/折叠、切换颜色、基础表单，可借助 Notion 原生块模拟，但本质不是 HTML：
- 用
/toggle块做手风琴效果（无 JS，纯 Notion 渲染） - 用数据库视图 + 关系属性联动，实现类似筛选行为
- 用第三方集成（如
Notion API + webhook）触发外部动作，但用户点击后跳转到新页面，不是原地交互 - 千万别信“用 base64 编码 HTML 后塞进 iframe src”的方案——Notion 解析时会清空 data URL，且现代浏览器也已限制 data: iframe 加载
真正卡住的地方从来不是“怎么写 HTML”，而是“谁来托管、谁来配 header、谁来解决跨域和 frame 安全策略”。没走通部署这步，后面全是空谈。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
