server目录

Nuxt 针对该目录下的文件，也会有一套自动化的处理。假设有如下的目录结构：

-| server/
---| api/
-----| hello.ts

Nuxt 会自动扫描这些目录内的文件，然后自动注册具有 HMR 支持的 API 接口。每个文件，需要导出一个 defineEventHandler 方法，该方法可以直接返回一个 json 或者 promise，之后就可以在组件中请求该 api.

export default defineEventHandler(() => {
  return {
    name: '张三',
  }
})

await useFetch('/api/hello')

restful api

在 Nuxt 中，通过约定式实现 restful 请求。不同的请求方式，只需要在文件名后面添加后缀即可，例如：

• index.get.ts: 表示一个 get 请求
• index.post.ts：表示一个 post 请求

如果需要接受参数，则类似于动态路由文件的写法：

• [id].get.ts
• [id].delete.ts

在发送请求之前，有一些常见的操作，例如获取 params、query、body 数据，然后随着请求一起发送给服务器。获取方式如下：

获取 params 数据

export default defineEventHandler((event) => {
  const name = getRouterParam(event, 'name')
  return name
})

获取 query 数据

export default defineEventHandler((event) => {
  const query = getQuery(event)
  return query
})

获取 body 数据

export default defineEventHandler(async (event) => {
  const body = await readBody(event)
  return body
})

课堂练习

完成《用户管理系统》请求数据部分的业务逻辑。

-EOF-