在 VS Code 中试试

在 Web 上运行和调试 Python

我们很高兴地宣布对在 Web 上运行 Python 代码提供实验性支持。要试用此功能,请从 Marketplace 安装最新预发布版本的 Experimental - Python for the Web 扩展。这项工作基于 Python 中的 WASM,目前正在开发中。要详细了解其工作原理和当前进展,您可以阅读 将 Python 编译到 WebAssembly (WASM)

先决条件

使用该扩展需要以下先决条件

  • 你需要安装 GitHub Repositories 扩展。
  • 你需要使用 GitHub 进行身份验证。
  • 你需要使用支持 跨域隔离 的浏览器。该扩展已在 Microsoft Edge 和 Google Chrome 浏览器上进行过测试。
  • 你需要使用 VS Code for the Web 的 insider 版本(例如 https://insiders.vscode.dev/
  • 你的源代码必须托管在本地文件系统或可通过 GitHub Repositories 扩展访问的 GitHub 仓库中。
  • 启动 VS Code for the Web 时,你需要在 URL 的末尾添加以下查询参数:?vscode-coi=

运行 Hello World

下面的屏幕截图显示了在浏览器中执行一个简单的 Python 程序。该程序由存储在本地文件系统上的两个文件 app.pyhello.py 组成。

Execution of Python code stored on a local disk

启动 REPL

该扩展附带一个集成的 Python REPL。要激活它,请运行命令 Python WASM: Start REPL

Start Python Repl

调试

Web 上支持调试 Python 文件,并且其用户界面与 VS Code 桌面版 调试 相同。目前支持的功能有

  • 设置断点
  • 步入和步出函数
  • 跨模块调试
  • 在调试控制台中评估变量
  • 在集成终端中调试程序

下面的屏幕截图显示了一个活动的调试会话。这些文件直接托管在此 示例仓库 的 GitHub 上。

Debugging a Python program

创建自己的 Python 环境

该扩展使用基于 CPython WebAssembly 构建 的预配置 Python 环境。使用的构建版本是 Python-3.11.0-wasm32-wasi-16.zip

你可以按照以下步骤创建自己的 Python 环境,包括 source wheel Python 包

  • 创建一个新的 GitHub 仓库。

  • cpython-wasm-test/releases 下载一个 wasm-wasi-16 构建,并将其解压到仓库的根目录。

  • 要添加 source wheel 包,请执行以下操作

    • 在根目录中创建一个 site-packages 文件夹。
    • 使用以下命令安装包 pip install my_package --target ./site-packages。请注意,你的操作系统中需要安装包含 pip 的 Python。
  • 提交更改。

  • 更改 python.wasm.runtime 设置,使其指向你的 GitHub 仓库。例如

    {
      "python.wasm.runtime": "https://github.com/dbaeumer/python-3.11.0"
    }
    

限制

Web 上的 Python 支持不像在本地机器上运行源代码那样提供所有功能。Python 解释器的主要限制有

  • 不支持 socket。
  • 不支持线程。因此,也不支持异步。
  • 不支持 pip。
  • 不支持原生 Python 模块。

致谢

这项工作离不开 Python 社区的支持,他们正在构建和维护 CPython 必需的 WASM 文件。

反馈

如果你在使用 Web 上的 Python 扩展时遇到问题,可以在 vscode-python-web-wasm 仓库中提交问题。