01写一个简单的API服务

任务:用 Hono 写 API 服务,通过 @hono/node-server 适配器,让 API 服务跑在 Node.js 原生的 HTTP 服务器上。

第一步, 环境是node.js,安装环境。去官网下载node.js软件就好了

第二步, 创建目录,mkdir my-api 进入目录,cd my-api 初始化项目,npm init -y 安装适配器,npm install hono @hono/node-server

其他(可选) 如果使用TypeScript语言写,还需要安装 tsx 、typescript、类型声明文件: npm install -D typescript tsx @types/node

说明 typescript 是编译器,typescript 包提供了 tsc 命令,它就是真正把 .ts 编译成 .js 的编译器。过程中做了两件事1、类型检查 2、转译/编译

tsx 是一个运行器,它让你能直接运行 TS 文件,而不需要先手动编译。开发时直接跑 .ts 文件,底层用 esbuild 转译,快,但不做类型检查。

@types/node不是工具,是类型声明文件。是社区维护的Node.js API 的类型描述。它只在开发/编译阶段用来做类型检查,运行时根本不需要。

-D 说明放在devDependencies,只在开发/编译阶段用。

第三步, 创建文件 index.ts 在文件 index.ts里面编写 API 服务代码

typescript 复制代码
// 引入hono和 hono的node适配器
import { serve } from '@hono/node-server'
import { Hono } from 'hono'

// 1. 创建 Hono 应用实例
const app = new Hono()

// 2. 定义一个简单的 GET 接口,返回文本
app.get('/', (c) => {
  return c.text('Hono API is running on Node.js!')
})

// 3. 定义一个返回 JSON 的接口
app.get('/api/hello', (c) => {
  return c.json({
    message: 'Hello from Hono!',
    timestamp: new Date().toISOString(),
  })
})

// 4. 带路径参数的 GET 接口
app.get('/api/users/:id', (c) => {
  const userId = c.req.param('id')
  return c.json({
    id: userId,
    name: `User ${userId}`,
    email: `user${userId}@example.com`,
  })
})

// 5. 处理 POST 请求,解析 JSON 请求体
app.post('/api/users', async (c) => {
  const body = await c.req.json()
  return c.json(
    {
      message: 'User created successfully',
      user: body,
    },
    201 // 状态码
  )
})

// 6. 启动服务器
const port = 3000
console.log(`Server is running on http://localhost:${port}`)

serve({
  fetch: app.fetch,
  port,
})

第四步启动服务

为了简便,package.json 中加一行启动脚本

js 复制代码
{
  "scripts": {
    "dev": "tsx index.ts"
  }
}

启动服务、npm run dev

也可以,npm run tsx index.ts

第五步测试服务

bash 复制代码
# 测试根路径
curl http://localhost:3000/

# 测试 JSON 接口
curl http://localhost:3000/api/hello

# 测试路径参数
curl http://localhost:3000/api/users/42

# 测试 POST 请求
curl -X POST http://localhost:3000/api/users \
  -H "Content-Type: application/json" \
  -d '{"name":"张三","email":"zhangsan@example.com"}'
  
  

后续在index.ts 文件上面 用hono规范 继续修改为不同的API路由逻辑。

相关推荐
志尊宝1 小时前
Vue3 零基础每日笔记(081):富文本编辑器集成 wangEditor 5——封装
前端·javascript·vue.js·笔记·信息可视化·echarts
志尊宝2 小时前
Vue3 零基础每日笔记(080):Vue3 + ECharts 数据可视化——封装可复用图表组件
前端·javascript·vue.js·笔记·信息可视化·echarts
2603_965896622 小时前
JS ES6常用新特性|let/const、解构赋值、展开运算符
前端·javascript·es6
衡石科技2 小时前
一个门户只保留一个智能助理:衡石嵌入式 Data Agent 的运行与渲染边界
前端·javascript·html·data agent
Hilaku2 小时前
一个前端工程师除了写代码,还能靠什么赚钱?
前端·javascript·程序员
我先测了2 小时前
Midscene.js 全栈学习指南:从入门到精通的 AI 视觉自动化框架
javascript·人工智能·自动化·agent·midscene
程序员Sunday3 小时前
JavaScript 闭包是什么?为什么变量没有被释放,什么时候会内存泄漏?
前端·javascript
程序员Sunday3 小时前
React 的 useEffect 怎么工作?依赖数组、清理函数和重复执行如何理解?
前端·javascript
程序员Sunday4 小时前
Vue 3 响应式原理是什么?Proxy、ref 和 reactive 有什么区别?
前端·javascript