构建基于网页的 Python 与 C# 代码运行器

Source: Dev.to

工作原理

该项目由一个 Fastify + TypeScript 后端和一个简易的 HTML/JS 前端组成。

前端

• 用户从下拉框中选择语言（Python 或 C#）。
• 编辑器会自动填入对应语言的函数模板。
• 用户编写函数后点击 Run。

后端

• 通过 POST 请求到 /run 接收代码和所选语言。
• 将用户代码包装在 测试运行器 中，以执行预定义的测试用例。
• 在 Docker 容器 中运行代码，以确保安全。
• 将可读的通过/失败结果返回给前端。

测试运行器

• Python – 动态创建脚本，调用提交的函数并传入测试用例，打印结果。
• C# – 在临时文件夹生成一个控制台应用，通过 Docker 运行并捕获输出。

为什么使用 Docker

直接在服务器上运行用户代码非常危险。Docker 为每次执行提供了隔离的沙箱，防止任何系统访问或破坏。它还使以后通过启动不同的 Docker 镜像来添加更多语言变得简单。

我的收获

• 使用 Docker 实现安全代码执行和沙箱化。
• 构建 Fastify + TypeScript 后端。
• 为多语言动态生成测试运行器。
• 使用语言特定模板创建简洁的交互式前端。
• 协调后端与前端返回结构化、可读的输出。

我计划如何在 MathHacks 中使用它

MathHacks 是一个可以 解决计算机科学 × 数学编程挑战 的网站。这个代码运行器将成为平台的核心部分，使用户能够：

• 使用多种语言解决挑战。
• 通过自动化测试用例即时获得反馈。
• 在不需要本地安装任何东西的情况下安全实验。

如果你感兴趣并想抢先体验，请加入 等待名单： mathhacks waitlist

目标是让学习编程 互动、有趣且安全。

下一步

• 添加更多语言（例如 JavaScript、Java）。
• 允许为每个挑战自定义测试用例。
• 使用语法高亮和更丰富的编辑器功能改进前端用户体验。
• 将运行器完整集成到 MathHacks 平台。

功能

• 在浏览器中直接运行 Python 和 C# 函数。
• 自动化测试用例，提供可读的通过/失败输出。
• 在 Docker 容器内安全执行。
• 使用 Fastify 构建轻量级 API。
• 交互式前端，提供语言特定模板。

工具与技术

• Node.js 与 Fastify – 后端 API。
• Docker – 沙箱化代码执行。
• TypeScript – 类型安全的后端代码。
• HTML/JS – 简单的交互式前端。
• (可选) React 或其他框架用于未来的 UI 增强。

环境要求

• 已安装 Docker。
• Node.js ≥ 20。
• npm 或 yarn。

安装

git clone https://github.com/VulcanWM/code-runner.git
cd code-runner
npm install

启动服务器

npm start
# The server will run on http://[::1]:8080

使用方法

1. 在浏览器中打开 http://[::1]:8080。
2. 从下拉框中选择语言（Python 或 C#）。
3. 在编辑器中编写函数代码。
4. 点击 Run 查看预定义测试用例的通过/失败结果。