借助 pyscript 框架，你可以在纯 html 页面中嵌入并执行 python 代码，所有运算在用户浏览器中完成，无需后端服务器或 python 环境部署。
现代 Web 开发中，Python 通常运行在服务端（如 Flask/Django），但若你想让 Python 逻辑“直接”在用户浏览器中执行——比如对输入文本进行单词打乱（shuffle）、实时数据处理、教育演示或轻量交互工具——PyScript 提供了一种简洁、安全且开箱即用的解决方案。
PyScript 是一个基于 WebAssembly 的前端框架，它将 CPython 编译为 WebAssembly，使标准 Python 代码能在浏览器中原生运行。整个过程不依赖服务器端 Python，也不需要用户安装任何环境。
✅ 快速上手示例：网页内实现单词随机打乱
- 创建 index.html，引入 PyScript 官方 CDN（推荐使用最新稳定版）：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Word Shuffler</title>
<!-- 引入 PyScript 样式与脚本 -->
<link rel="stylesheet" href="https://pyscript.net/releases/2024.8.1/pyscript.css" />
<script defer src="https://pyscript.net/releases/2024.8.1/pyscript.js"></script>
</head>
<body>
<h2>? 单词打乱工具</h2>
<input id="input-words" type="text" placeholder="输入单词，用空格分隔（例如：apple banana cherry）" />
<button id="shuffle-btn">打乱！</button>
<p><strong>结果：</strong><span id="output"></span></p><div class="aritcle_card flexRow">
<div class="artcardd flexRow">
<a class="aritcle_card_img" href="/xiazai/code/10953" title="DM6在线读报系统"><img
src="https://img.php.cn/upload/webcode/000/000/014/176440860293950.jpg" alt="DM6在线读报系统" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a href="/xiazai/code/10953" title="DM6在线读报系统">DM6在线读报系统</a>
<p>DM6在线读报系统ASPX 免费版2.0。如果您是一个DM广告公司的网站管理员，正在寻求一套程序或源码可以让公司网站具有一套配合网站整体架构的电子杂志频道，那您现在可找对了。请仔细阅读以下关于DM6在线读报系统的说明。 这是一个网站用户可以直接在线阅读报纸且无需插件(连Flash都不用)、无需下载、无需安装的在线读报系统(服务器端模块)，通过将此系统放到网站文件目录中即可轻松生成网站的在线读报频道</p>
</div>
<a href="/xiazai/code/10953" title="DM6在线读报系统" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a>
</div>
</div>
<!-- 内联 Python 逻辑 -->
<py-script>
from pyscript import when, display
import random
@when("click", selector="#shuffle-btn")
def shuffle_words():
words = Element("input-words").value.strip()
if not words:
display("请输入至少一个单词！", target="output", append=False)
return
word_list = words.split()
random.shuffle(word_list)
result = " ".join(word_list)
display(result, target="output", append=False)
</py-script>
</body>
</html>? 说明：上述代码完全运行在浏览器中。点击按钮时，Python 使用 random.shuffle() 处理输入，结果实时显示——无网络请求、无后端、零配置。
⚠️ 注意事项与限制
- 兼容性：需现代浏览器（Chrome/Firefox/Edge 最新版），不支持 IE。
- 性能边界：适合轻量计算（如文本处理、数学运算、小型算法）。避免 CPU 密集型或长时间阻塞任务（可结合 async/await 或 Web Workers 进阶优化）。
-
模块限制：仅支持纯 Python 模块及部分预编译的科学包（如 numpy, matplotlib 需显式声明
）。os, sys, 文件 I/O 等系统级模块不可用。 - 安全性：代码在沙箱中执行，无法访问本地文件系统或发起跨域请求（除非显式配置 CORS）。
? 替代方案对比（简要）
| 方案 | 是否需服务器 | 是否真 Python | 适用场景 |
|---|---|---|---|
| PyScript | ❌ 否 | ✅ 是（CPython） | 前端交互小工具、教学演示 |
| Flask + AJAX | ✅ 是 | ✅ 是 | 需持久化、数据库、复杂逻辑 |
| Skulpt / Brython | ❌ 否 | ⚠️ 类 Python（非 CPython） | 教学/兼容性优先场景 |
✅ 总结
如果你的目标是：让用户打开 HTML 页面即用 Python 功能（如单词打乱、计算器、词频统计），且不想搭服务器、不关心 SEO、接受现代浏览器要求——那么 PyScript 是当前最直接、最 Pythonic 的选择。只需三步：引入 JS/CSS → 写
立即学习“Python免费学习笔记（深入）”；
