企业官网建设流程全解析

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 请求工具，也是 Postman 的免费替代：在浏览器里发 REST、GraphQL、WebSocket 请求，还能把请求整理成集合。本教程带你把它装到本地，从空白终端走到发出第一个真实 API 请求。

为什么可以试试用 Hoppscotch 替代 Postman

先用 Postman 的你，常见的不满集中在两点：免费版功能限制越来越多，数据默认存在对方云端。Hoppscotch 把这两点反过来了——它完全开源免费，代码就放在你手上，想自托管就自托管，请求数据可以只留在本机。

如果你只需要"发请求、看响应、存下来"，Hoppscotch 是更轻的选择；如果重度依赖它的企业级流程，可以两边并行。

先把环境准备好

Hoppscotch 是 pnpm 管理的多包仓库，所以只需备齐三样东西：

• Node.js 18 或更高版本（官方开发容器用的就是 Node 18，更新版本没问题）
• pnpm（仓库要求 10.x，装 Node 后可用corepack enable自动带出对应版本）
• Git（用来拉代码）

装完后在终端跑一下版本检查：

node -v && pnpm -v

成功标志：终端输出两个版本号，Node 不低于 18.x，pnpm 有正常输出。到这一步，后面所有命令都能直接用。

10 分钟在本地跑起 Hoppscotch 网页版

这是最省事的路径：不编译桌面端（桌面端需要额外的 Rust/Tauri 环境，日常使用直接装官方发布的安装包或打开官网即可），而是把 Web 版跑在你自己的机器上。

第一步，克隆仓库到本地：

git clone https://gitcode.com/GitHub_Trending/ho/hoppscotch cd hoppscotch

第二步，初始化配置文件。仓库根目录的.env.example是配置模板，本地开发不需要改动，复制一份作为.env即可：

cp .env.example .env

第三步，安装依赖：

pnpm install

这一步会花几分钟，因为仓库里有十几个工作区，还包含 canvas、argon2 这类需要编译原生模块的依赖。成功标志：终端没有红色报错，最后自动跑了一次 GraphQL 代码生成（看到 gql-codegen 相关输出），说明依赖装好了。

第四步，启动开发服务器：

pnpm dev

成功标志：终端出现 Vite 的 ready 提示，浏览器打开http://localhost:3000能看到 Hoppscotch 的主界面——顶部是请求栏，左侧是集合和标签页，这就是它的标准工作台。

如果你的设备也装了 Hoppscotch 桌面客户端，界面长得差不多，只是多了一层本地存储，离线也能用。

发出第一个 API 请求并把它存下来

现在界面已经在了，做一次完整闭环：发请求、看结果、存下来。

1. 在顶部 URL 输入框里填https://httpbin.org/get，请求方式保持默认的 GET。
2. 按回车（或点 Send）。下方会立刻返回结果。
3. 检查两处：状态码是200，响应体是一段 JSON，里面包含你发起请求时的 IP 和 User-Agent。看到这两样，说明请求真的从你机器发出去、绕了一圈回来了。

把这次请求留下来：点响应区右侧的Save，它会弹出一个保存面板，起个名字、选个集合（没有就先建一个叫First的集合）。保存成功后，左侧集合树里会出现这条请求，以后双击就能重发。

顺手再试一个更实用的动作：如果你手上有从同事那里拿到的 curl 命令，点右上角的Import curl，把整段贴进去，方法、URL、Header、Body 会自动拆好填进界面，不用手工翻译。

想更进一步

• 别的协议：左侧标签栏切到 GraphQL，填一个带 schema 的端点后会自动拉取字段，可以点选拼查询；WebSocket、MQTT、Socket.IO、SSE 也都是同样的切标签方式。
• 团队协作：仓库自带后端，用docker compose --profile default up就能把前后端和数据库一起拉起来，Web 应用仍然在 3000 端口，这时注册账号后集合、环境、历史就都存在你自己的服务器上了。
• 命令行：仓库里的packages/hoppscotch-cli/是一个独立 CLI（命令名叫hopp），把集合变成脚本化测试就跑在那里。

新手最容易卡住的 3 个情况

npm install 直接报错现象：还没装完就跳出 "Only pnpm is allowed" 之类的错误。 原因：仓库的 preinstall 钩子强制要求用 pnpm，防止包管理不一致。 解法：别用 npm/yarn，统一pnpm install；没有 pnpm 就先corepack enable。

3000 端口被占用现象：pnpm dev后浏览器打开 3000 端口，看到的不是 Hoppscotch 而是别的东西。 原因：本机已有其他服务占了 3000 端口。 解法：lsof -i :3000找到占用进程，关掉它或修改packages/hoppscotch-selfhost-web/里 Vite 配置的端口。

依赖安装特别慢或中途失败现象：装了几十分钟，最后卡在某个原生模块上。 原因：工作区多、原生依赖重，加上网络波动。 解法：先pnpm store prune清理缓存再pnpm install重试；如果反复失败，优先检查 Node 版本是否达到 18。

走到这里，你已经完成了从克隆到发出第一个请求的全过程，Hoppscotch 的日常用法基本就是"发请求—存集合—换环境"这个循环。下一步建议：把现有的 Postman 或 Insomnia 集合直接导入进来（右上角有导入入口），它会自动转成 Hoppscotch 的格式，旧工作流可以无缝接上。

【免费下载链接】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