Nuxt'da (Nitro) server API routes qanday tuzilgan?

SeniorNuxt.js #nuxt #nitro #server-api

Savol

Nuxt'da serverdagi API-endpointlar qanday yaratiladi va ular tagida qanday ishlaydi?

Qisqa javob

Nuxt Nitro deb nomlangan server dvigatelidan foydalanadi: server/api/ ichidagi har qanday fayl alohida backend-freymvorksiz, mos keladigan yo'l orqali mavjud bo'lgan HTTP-endpointga aylanadi.

Batafsil javob

Struktura marshrut va metodni belgilaydi:

  • server/api/users.get.ts → GET /api/users
  • server/api/users.post.ts → POST /api/users
  • server/api/users/[id].ts → GET /api/users/:id (qo'shimchasiz — istalgan metod)

Har bir fayl defineEventHandler orqali yaratilgan event handlerni eksport qiladi. Ichida h3dan (Nitro qurilgan dvigatel) utilitalar mavjud:

  • getRouterParam(event, 'id') — dinamik marshrutning parametrlari.
  • getQuery(event) — query-parametrlar.
  • readBody(event) — so'rov tanasi.
  • createError({ statusCode, message }) — kerakli status-kod bilan xatolikni tashlash.
  • setResponseStatus(event, 201) — javob statusini aniq o'rnatish.

Nitro — universal dvigatel: bir xil kodni o'zgartirishlarsiz Node.js-serverga, serverless-funksiyalarga (Vercel, AWS Lambda) yoki edge-muhitlarga deploy qilish mumkin.

Misol

// server/api/users/[id].get.ts
export default defineEventHandler(async (event) => {
  const id = getRouterParam(event, 'id')

  const user = await findUserById(id)
  if (!user) {
    throw createError({ statusCode: 404, statusMessage: 'Foydalanuvchi topilmadi' })
  }

  return user
})
<script setup>
// Klientda — oddiygina useFetch, Nuxt SSR yoki CSR-so'rov ekanini o'zi hal qiladi
const { data: user } = await useFetch(`/api/users/${route.params.id}`)
</script>

Qo'shimcha savollar

  • server/api server/routesdan nimasi bilan farq qiladi?
  • Server route'da atrof-muhit o'zgaruvchilariga xavfsiz qanday kirish mumkin?
  • Server middleware nima va u route middleware'dan nimasi bilan farq qiladi?