企业官网建设流程全解析

Hoppscotch 完整手把手：一条命令部署开源 API 调试工具

【免费下载链接】hoppscotchOpen-Source API Development Ecosystem • https://hoppscotch.io • Offline, On-Prem & Cloud • Web, Desktop & CLI • Open-Source Alternative to Postman, Insomnia项目地址: https://gitcode.com/GitHub_Trending/ho/hoppscotch

Hoppscotch 是一个开源的 API 开发生态，用来构建、测试和管理 REST、GraphQL、WebSocket 等请求。适合后端开发者和需要私有化部署的团队。本文讲如何用 Docker 把它跑起来、代码怎么组织、配置改哪里。

定位：Hoppscotch 和同类工具有什么区别

它是 Postman 和 Insomnia 的开源替代，支持 Web、桌面、CLI 三种形态，可完全离线运行。和同类工具的差别在于，整套系统（含后端、数据库、管理面板）都能部署在你自己的服务器上。

• 多端：如果你是开发，想在浏览器发请求、在桌面端同步数据、在 CLI 里批量执行，一套集合三端通用。
• 私有：如果你有数据不出内网的要求，请求集合、环境、历史记录都存在自己的服务器上。
• 脚本：如果你是测试工程师，可以在隔离沙箱里写 Pre-request 和 Post-response 脚本。

最小部署命令：一条 Docker 命令启动 Hoppscotch

主推路径是 Docker 自托管。docker-compose.yml 里的defaultprofile 一次拉起 All-in-One 服务、PostgreSQL 数据库和自动迁移。三条命令：

• git clone：把代码克隆到本地目录
• cd hoppscotch && cp .env.example .env：进入目录，把配置模板复制成正式配置文件
• docker compose --profile default up：启动应用、后端、数据库和管理面板

git clone https://gitcode.com/GitHub_Trending/ho/hoppscotch cd hoppscotch && cp .env.example .env docker compose --profile default up

备选路径是本地开发：在仓库根目录执行pnpm install和pnpm dev，各子包并行启动 Vite 开发服务器，用于读改代码。桌面端也可以在左上角切换实例，连接到你的自托管服务。

如何确认成功：访问http://localhost:3000，应看到请求编辑页；在 REST 标签页输入GET https://echo.hoppscotch.io点 Send，响应区出现Status: 200即部署正常。管理面板在http://localhost:3100。

项目地图：按入口、核心、服务、数据四层读源码

• 入口：packages/hoppscotch-selfhost-web 是 Web 端 Vite 入口，负责打包 common 包并对接后端地址。
• 核心逻辑：packages/hoppscotch-common 放所有 UI 组件、请求发送逻辑和脚本执行，Web 与桌面共用。
• 服务：packages/hoppscotch-backend 是 NestJS + Prisma + PostgreSQL 写的后端，提供 GraphQL 接口，管用户、团队和集合同步。
• 数据：packages/hoppscotch-data 定义请求、集合、环境等数据模型；packages/hoppscotch-js-sandbox 在隔离沙箱里执行前后置脚本。

读源码的建议路线：从 selfhost-web 入口进 common 的请求发送逻辑，再顺helpers/backend/里的 GraphQL 文件看它怎么调后端。

部署前必改配置：.env 与 Docker Compose

• .env.example（复制为.env）：DATA_ENCRYPTION_KEY是敏感数据落库的 32 位加密密钥，示例值必须改；DATABASE_URL指向 PostgreSQL；VITE_BACKEND_GQL_URL等一组变量决定前端连哪个后端。每次部署、换端口都要改它。
• docker-compose.yml：用 profile 控制启动范围，default全起，已有外部数据库用default-no-db，backend/app/admin可单独起；3000 / 3100 / 3170 的端口映射也改在这里。
• gql-codegen.yml：GraphQL 代码生成配置，装依赖时自动生成类型；手动改过后端 schema 遇到类型报错，先重跑生成。

跑起来之后的下一步

1. 导入一个现有 Postman 集合，熟悉集合、文件夹和环境变量。
2. 修改.env里的DATA_ENCRYPTION_KEY和数据库密码，别用示例值。
3. 执行pnpm dev起本地开发环境，重点读 hoppscotch-common。
4. 用 packages/hoppscotch-cli 把请求集合当测试用例批量跑，接进 CI。
5. 读 hoppscotch-js-sandbox 的源码，弄清脚本隔离是怎么实现的，这是进阶方向。

目录结构、端口与配置项以仓库最新版本为准。

【免费下载链接】hoppscotchOpen-Source API Development Ecosystem • https://hoppscotch.io • Offline, On-Prem & Cloud • Web, Desktop & CLI • Open-Source Alternative to Postman, Insomnia项目地址: https://gitcode.com/GitHub_Trending/ho/hoppscotch