
本文介绍使用 pyscript 框架通过 `
在 Web 前端中直接运行 Python 代码并非原生支持,但借助 PyScript(一个基于 WebAssembly 的 Python 运行时框架),你可以在浏览器中执行 Python 脚本,并像引入 JS 或 CSS 那样模块化组织代码。关键在于:不能直接用 file:// 协议加载本地 .py 文件,而必须通过 HTTP 服务提供。
✅ 正确做法:使用 + 本地 HTTP 服务器
首先,在 HTML 中引入 PyScript 运行时(推荐使用 CDN):
⚠️ 注意:src 属性值是相对或绝对 URL(如 ./game_logic.py、/scripts/main.py 或 https://example.com/logic.py),不是本地文件路径(如 C:\my\game.py)。浏览器出于安全限制,禁止前端脚本直接读取本地文件系统。
接着,确保你的 Python 文件(例如 game_logic.py)放在与 HTML 同一目录(或按路径正确配置),内容示例:
# game_logic.py
from pyscript import display
import random
def start_game():
num = random.randint(1, 100)
display(f"? 游戏已启动!随机数已生成:{num}", append=False)
# 自动执行初始化(可选)
start_game()? 本地开发必备:启动简易 HTTP 服务器
在包含 index.html 和 game_logic.py 的目录下,打开终端,运行:
立即学习“Python免费学习笔记(深入)”;
# Python 3.7+ python -m http.server 8000
然后访问 http://localhost:8000 即可正常加载并执行外部 Python 文件。若使用其他端口(如 8080),请同步调整命令和浏览器地址。
❗重要注意事项
- 不支持 import 大多数第三方包:PyScript 当前仅内置少量常用库(如 micropip、random、math),numpy、pygame 等无法直接使用;复杂游戏逻辑建议拆分为前端(HTML/CSS/JS)+ 后端(Flask/FastAPI)架构。
-
无 DOM 操作权限?用 pyscript.display() 或 Element API:
from pyscript import Element Element("output").write("Hello from Python!") - 调试技巧:打开浏览器开发者工具 → Console 标签页,查看 PyScript 错误日志(如 404 Not Found 表示路径错误,CORS 错误说明未启用 HTTP 服务)。
✅ 总结
| 方式 | 是否可行 | 说明 |
|---|---|---|
| ✅ | 内联脚本,适合简单逻辑 | |
| ✅(需 HTTP 服务) | 推荐用于分离逻辑、提升可维护性 | |
| ❌ | 浏览器安全策略禁止,必报错 |
通过合理使用











