Next.js API marshrutlari: Bekendingizni osonlik bilan qurish

Next.js o'zining kuchli xususiyatlari va intuitiv tuzilishi bilan front-end ishlab chiqishda inqilob qildi. Ammo uning backend ishlab chiqishni ham sezilarli darajada soddalashtirishi mumkinligini bilasizmi? Next.js API marshrutlari sizga to'g'ridan-to'g'ri Next.js ilovangiz ichida serverless API endpointlarini yaratish imkonini beradi, bu esa ko'p hollarda alohida backend serveriga bo'lgan ehtiyojni yo'qotadi. Ushbu keng qamrovli qo'llanma sizga Next.js API marshrutlaridan foydalangan holda mustahkam va kengaytiriladigan backend qurish jarayonini ko'rsatib beradi.

Next.js API marshrutlari nima?

API marshrutlari bu sizning Next.js loyihangizdagi /pages/api katalogida yaratadigan serverless funksiyalardir. Bu funksiyalar an'anaviy backend API kabi kiruvchi HTTP so'rovlariga ishlov beradi va javob qaytaradi. Asosiy farq shundaki, ular serverless funksiyalar sifatida joylashtiriladi, ya'ni serverlar yoki infratuzilmani boshqarishingiz shart emas.

Ularni Next.js front-endingiz bilan uzluksiz integratsiyalashgan yengil, talab bo'yicha ishlaydigan backend funksiyalari deb o'ylang.

Next.js API marshrutlaridan foydalanishning afzalliklari

• Soddalashtirilgan ishlab chiqish: Front-end va backend kodingizni bir loyihada, JavaScript yoki TypeScript yordamida yozing. Turli loyihalar va texnologiyalar o'rtasida kontekstni almashtirishga hojat yo'q.
• Serverless arxitektura: Serverless hisoblashning kengaytiriluvchanligi, ishonchliligi va iqtisodiy samaradorligidan foydalaning. Faqat iste'mol qilgan resurslaringiz uchun to'lang.
• Oson joylashtirish: Vercel yoki Netlify kabi platformalar yordamida butun ilovangizni (front-end va backend) bitta buyruq bilan joylashtiring.
• O'rnatilgan xavfsizlik: Next.js va serverless platformalar API endpointlaringizni himoya qilish uchun o'rnatilgan xavfsizlik xususiyatlarini taqdim etadi.
• Yaxshilangan unumdorlik: API marshrutlari foydalanuvchilaringizga yaqinroq joylashtirilishi mumkin, bu esa kechikishni kamaytiradi va unumdorlikni yaxshilaydi, ayniqsa global miqyosdagi foydalanuvchilar uchun foydalidir.
• Kodni qayta ishlatish imkoniyati: Front-end va backend o'rtasida kodni bo'lishing, bu kod takrorlanishini kamaytiradi va kodni saqlashni osonlashtiradi.

Next.js API marshrutlari bilan ishlashni boshlash

Keling, JSON javobini qaytaradigan oddiy API marshrutini yarataylik. Avvalo, sizda Next.js loyihasi sozlanga ishonch hosil qiling. Agar yo'q bo'lsa, quyidagi buyruq yordamida yarating:

            npx create-next-app my-app
cd my-app
            

              
                Copy
              
            
          

Endi, /pages/api katalogi ichida hello.js nomli fayl yarating:

            // pages/api/hello.js
export default function handler(req, res) {
  res.status(200).json({ name: 'John Doe' })
}

            

              
                Copy
              
            
          

Bu kod "John Doe" ismini o'z ichiga olgan JSON ob'ekti bilan javob beradigan oddiy API marshrutini belgilaydi. Ushbu API marshrutiga kirish uchun Next.js ishlab chiqish serveringizni ishga tushiring:

            npm run dev
            

              
                Copy
              
            
          

Keyin, brauzeringizni oching va http://localhost:3000/api/hello manziliga o'ting. Siz quyidagi JSON javobini ko'rishingiz kerak:

            {"name": "John Doe"}
            

              
                Copy
              
            
          

API marshrutining ishlov beruvchisini (handler) tushunish

API marshrutingizdagi handler funksiyasi ikkita argumentni qabul qiladi:

• req: http.IncomingMessage namunasi, u kiruvchi so'rov haqidagi ma'lumotlarni, masalan, so'rov usuli, sarlavhalar va tanasini o'z ichiga oladi.
• res: http.ServerResponse namunasi, u sizga mijozga javob yuborish imkonini beradi.

Siz bu ob'ektlardan turli xil so'rovlarga ishlov berish, so'rov tanasidan ma'lumotlarni o'qish, javob sarlavhalarini o'rnatish va turli xil javoblarni yuborish uchun foydalanishingiz mumkin.

Turli HTTP usullariga ishlov berish

Kiruvchi so'rovning HTTP usulini aniqlash va turli usullarga muvofiq ishlov berish uchun req.method xususiyatidan foydalanishingiz mumkin. Masalan:

            // pages/api/method.js
export default function handler(req, res) {
  if (req.method === 'GET') {
    // GET so'roviga ishlov berish
    res.status(200).json({ message: 'Bu GET so\'rovi' })
  } else if (req.method === 'POST') {
    // POST so'roviga ishlov berish
    res.status(200).json({ message: 'Bu POST so\'rovi' })
  } else {
    // Boshqa usullarga ishlov berish
    res.status(405).json({ message: 'Usulga ruxsat etilmagan' })
  }
}

            

              
                Copy
              
            
          

Ushbu misolda API marshruti ham GET, ham POST so'rovlariga ishlov beradi. Agar so'rov usuli GET bo'lsa, u "Bu GET so'rovi" xabarini o'z ichiga olgan JSON ob'ekti bilan javob beradi. Agar so'rov usuli POST bo'lsa, u "Bu POST so'rovi" xabarini o'z ichiga olgan JSON ob'ekti bilan javob beradi. Agar so'rov usuli boshqa bo'lsa, u 405 Method Not Allowed xatosi bilan javob beradi.

So'rov tanasidan ma'lumotlarni o'qish

POST, PUT va PATCH so'rovlari uchun siz ko'pincha so'rov tanasidan ma'lumotlarni o'qishingiz kerak bo'ladi. Next.js JSON va URL-kodlangan so'rov tanalarini tahlil qilish uchun o'rnatilgan qo'llab-quvvatlashni taqdim etadi. JSON so'rov tanasini tahlil qilish uchun req.body xususiyatidan foydalanishingiz mumkin. Masalan:

            // pages/api/post.js
export default async function handler(req, res) {
  if (req.method === 'POST') {
    const { name, email } = req.body

    // Ma'lumotlarga ishlov berish
    console.log('Ism:', name)
    console.log('Email:', email)

    res.status(200).json({ message: 'Ma\'lumotlar muvaffaqiyatli qabul qilindi' })
  } else {
    res.status(405).json({ message: 'Usulga ruxsat etilmagan' })
  }
}

            

              
                Copy
              
            
          

Ushbu API marshrutini sinab ko'rish uchun Postman yoki curl kabi vosita yordamida JSON tanasi bilan POST so'rovini yuborishingiz mumkin:

            curl -X POST -H "Content-Type: application/json" -d '{"name": "Jane Doe", "email": "jane.doe@example.com"}' http://localhost:3000/api/post
            

              
                Copy
              
            
          

Javob sarlavhalarini o'rnatish

Javob sarlavhalarini o'rnatish uchun res.setHeader() usulidan foydalanishingiz mumkin. Bu kontent turi, keshni boshqarish va boshqa muhim ma'lumotlarni o'rnatish uchun foydalidir. Masalan:

            // pages/api/headers.js
export default function handler(req, res) {
  res.setHeader('Content-Type', 'application/json')
  res.setHeader('Cache-Control', 's-maxage=3600')
  res.status(200).json({ message: 'Salom, dunyo!' })
}

            

              
                Copy
              
            
          

Ushbu misolda API marshruti Content-Type sarlavhasini application/json ga o'rnatadi, bu javobning JSON ob'ekti ekanligini bildiradi. Shuningdek, u Cache-Control sarlavhasini s-maxage=3600 ga o'rnatadi, bu brauzer va CDN ga javobni 1 soatgacha keshda saqlashni aytadi.

Xatoliklarga ishlov berish

API marshrutlaringizda xatoliklarga to'g'ri ishlov berish muhimdir. Istisnolarni ushlash va mijozga tegishli xato javoblarini yuborish uchun try-catch bloklaridan foydalanishingiz mumkin. Masalan:

            // pages/api/error.js
export default async function handler(req, res) {
  try {
    // Xatolikni simulyatsiya qilish
    throw new Error('Nimadir noto\'g\'ri ketdi')
  } catch (error) {
    console.error(error)
    res.status(500).json({ message: 'Ichki server xatoligi' })
  }
}

            

              
                Copy
              
            
          

Ushbu misolda API marshruti yangi Error ob'ektini tashlash orqali xatolikni simulyatsiya qiladi. Catch bloki xatoni ushlaydi, uni konsolga yozadi va mijozga 500 Ichki Server Xatoligi javobini yuboradi. Ishlab chiqarish muhitlari uchun Sentry yoki Datadog kabi mustahkam loglash tizimidan foydalanishni o'ylab ko'ring.

Ma'lumotlar bazasiga ulanish

API marshrutlari uchun eng keng tarqalgan foydalanish holatlaridan biri bu ma'lumotlar bazasiga ulanishdir. Next.js API marshrutlari turli ma'lumotlar bazalari bilan uzluksiz integratsiyalanadi, jumladan:

• MongoDB: Moslashuvchan va tuzilmalanmagan ma'lumotlar uchun juda mos keladigan mashhur NoSQL ma'lumotlar bazasi.
• PostgreSQL: Ishonchliligi va ma'lumotlar yaxlitligi bilan tanilgan kuchli va ochiq manbali relyatsion ma'lumotlar bazasi.
• MySQL: Veb-ilovalar uchun keng qo'llaniladigan yana bir mashhur ochiq manbali relyatsion ma'lumotlar bazasi.
• Firebase: Real vaqt rejimida ishlaydigan ma'lumotlar bazasi va boshqa xizmatlarni taqdim etadigan bulutli platforma.
• FaunaDB: Global ilovalar uchun mo'ljallangan serverless ma'lumotlar bazasi.

Quyida Next.js API marshrutida MongoDB ma'lumotlar bazasiga qanday ulanish mumkinligi haqida misol keltirilgan:

            // pages/api/mongodb.js
import { MongoClient } from 'mongodb'

const uri = process.env.MONGODB_URI
const options = {}

let client
let clientPromise

if (!process.env.MONGODB_URI) {
  throw new Error('Iltimos, Mongo URI manzilingizni .env.local fayliga qo\'shing')
}

if (process.env.NODE_ENV === 'development') {
  // Ishlab chiqish rejimida, qiymat HMR (Hot Module Replacement) tufayli
  // modulni qayta yuklashlar davomida saqlanib qolishi uchun global o'zgaruvchidan foydalaning.
  if (!global._mongoClientPromise) {
    client = new MongoClient(uri, options)
    global._mongoClientPromise = client.connect()
  }
  clientPromise = global._mongoClientPromise
} else {
  // Ishlab chiqarish rejimida global o'zgaruvchidan foydalanmaslik yaxshiroq.
  client = new MongoClient(uri, options)
  clientPromise = client.connect()
}

// Modul doirasidagi MongoClient promisini eksport qilish. Buni alohida
// modulda bajarish orqali mijozni bir nechta funksiyalar bo'ylab xavfsiz 
// qayta ishlatish mumkin. Qarang: https://github.com/vercel/next.js/blob/canary/examples/with-mongodb/lib/mongodb.js
export default async function handler(req, res) {
  try {
    const client = await clientPromise
    const db = client.db(process.env.MONGODB_DB)
    const collection = db.collection('users')

    const users = await collection.find({}).toArray()

    res.status(200).json({ users })
  } catch (e) {
    console.error(e)
    res.status(500).json({ message: 'Foydalanuvchilarni olishda xatolik yuz berdi' })
  }
}

            

              
                Copy
              
            
          

Ushbu kodni ishga tushirishdan oldin, sizda mongodb paketi o'rnatilganiga ishonch hosil qiling:

            npm install mongodb
            

              
                Copy
              
            
          

Shuningdek, MONGODB_URI va MONGODB_DB muhit o'zgaruvchilarini o'rnatishingiz kerak. Bu o'zgaruvchilar sizning .env.local faylingizda (yoki ishlab chiqarish uchun xosting provayderingizning muhit o'zgaruvchilari sozlamalarida) aniqlanishi kerak. MONGODB_URI sizning MongoDB ma'lumotlar bazangizga ulanish satrini o'z ichiga oladi, va MONGODB_DB esa ma'lumotlar bazasi nomini belgilaydi.

Autentifikatsiya va Avtorizatsiya

API marshrutlaringizni himoya qilish xavfsizlik uchun juda muhimdir. Next.js API marshrutlari turli autentifikatsiya va avtorizatsiya usullari yordamida himoyalanishi mumkin, jumladan:

• JSON Web Tokens (JWT): Tomonlar o'rtasida ma'lumotni JSON ob'ekti sifatida xavfsiz uzatish standarti.
• API Kalitlari: API endpointlaringizga kirishni cheklashning oddiy usuli.
• OAuth: Foydalanuvchilarga o'zlarining hisob ma'lumotlarini bo'lishmasdan uchinchi tomon ilovalariga o'z resurslariga kirish huquqini berish imkonini beruvchi delegatsiya protokoli.
• NextAuth.js: Next.js ilovalari uchun to'liq ochiq manbali autentifikatsiya yechimi.

Quyida JWT autentifikatsiyasi yordamida API marshrutini qanday himoya qilish haqida misol keltirilgan:

            // pages/api/protected.js
import jwt from 'jsonwebtoken'

const secret = process.env.JWT_SECRET

export default function handler(req, res) {
  const token = req.headers.authorization?.split(' ')[1]

  if (!token) {
    return res.status(401).json({ message: 'Ruxsatsiz' })
  }

  try {
    const decoded = jwt.verify(token, secret)
    // "decoded" ob'ekti tokenga joylashtirilgan foydalanuvchi ma'lumotlarini o'z ichiga oladi
    // Masalan: const userId = decoded.userId;

    // So'rovni qayta ishlashni davom ettirish
    res.status(200).json({ message: 'Himoyalangan resursga muvaffaqiyatli kirildi' })
  } catch (error) {
    return res.status(401).json({ message: 'Yaroqsiz token' })
  }
}

            

              
                Copy
              
            
          

Ushbu kodni ishga tushirishdan oldin, sizda jsonwebtoken paketi o'rnatilganiga ishonch hosil qiling:

            npm install jsonwebtoken
            

              
                Copy
              
            
          

Shuningdek, JWT_SECRET muhit o'zgaruvchisini o'rnatishingiz kerak. Bu JWT larni imzolash va tekshirish uchun ishlatiladigan kuchli, tasodifiy yaratilgan maxfiy kalit bo'lishi kerak. Buni xavfsiz saqlang va hech qachon mijoz tomonidagi kodingizda fosh qilmang.

Middleware

Next.js API marshrutlari uchun Express.js kabi an'anaviy middleware taklif qilmasa-da, siz API marshruti ishlov beruvchilarini qayta ishlatiladigan funksiyalar bilan o'rash orqali o'xshash funksionallikka erishishingiz mumkin. Bu sizga quyidagi vazifalarni bajarishga imkon beradi:

• Autentifikatsiya: API endpointlariga kirishga ruxsat berishdan oldin foydalanuvchi hisob ma'lumotlarini tekshirish.
• Avtorizatsiya: Foydalanuvchining ma'lum bir harakatni bajarish uchun zarur ruxsatlarga ega ekanligini tekshirish.
• Loglash: Audit va nosozliklarni tuzatish maqsadida kiruvchi so'rovlar va chiquvchi javoblarni loglash.
• Validatsiya: So'rov ma'lumotlarining ma'lum mezonlarga javob berishini ta'minlash uchun ularni tekshirish.
• So'rovlarni cheklash (Rate Limiting): Foydalanuvchining ma'lum bir vaqt oralig'ida qila oladigan so'rovlar sonini cheklash orqali API-ni suiiste'moldan himoya qilish.

Quyida oddiy loglash middleware-ni qanday yaratish haqida misol keltirilgan:

            // utils/middleware.js
export function withLogging(handler) {
  return async function(req, res) {
    console.log(`[${new Date().toISOString()}] ${req.method} ${req.url}`)
    return handler(req, res)
  }
}

            

              
                Copy
              
            
          

Ushbu middleware-dan foydalanish uchun shunchaki API marshruti ishlov beruvchisini withLogging funksiyasi bilan o'rang:

            // pages/api/logged.js
import { withLogging } from '../../utils/middleware'

async function handler(req, res) {
  res.status(200).json({ message: 'Bu so\'rov loglandi' })
}

export default withLogging(handler)

            

              
                Copy
              
            
          

Next.js API marshrutlarini qurish uchun eng yaxshi amaliyotlar

• API marshrutlaringizni kichik va aniq maqsadli qilib saqlang. Har bir API marshruti ma'lum bir vazifa yoki resursga ishlov berishi kerak.
• Maxfiy ma'lumotlar uchun muhit o'zgaruvchilaridan foydalaning. Hech qachon maxfiy kalitlar yoki API kalitlarini kodingizda qattiq kodlamang.
• Xavfsizlik zaifliklarini oldini olish uchun so'rov ma'lumotlarini tekshiring. So'rov tanalarini tekshirish uchun Joi yoki Yup kabi kutubxonalardan foydalaning.
• Xatoliklarga to'g'ri ishlov bering va ma'lumot beruvchi xato xabarlarini taqdim eting. Try-catch bloklaridan foydalaning va xatolarni markaziy joyga loglang.
• Unumdorlikni oshirish uchun keshlashdan foydalaning. Ma'lumotlar bazasi yukini kamaytirish uchun tez-tez murojaat qilinadigan ma'lumotlarni keshlang.
• API marshrutlaringizni unumdorlik va xatolar uchun kuzatib boring. API-ning holatini kuzatish uchun Sentry yoki Datadog kabi monitoring vositasidan foydalaning.
• API marshrutlaringizni Swagger yoki OpenAPI kabi vosita yordamida hujjatlashtiring. Bu boshqa ishlab chiquvchilarga sizning API-dan foydalanishni osonlashtiradi.
• Turlar xavfsizligi uchun TypeScript-dan foydalanishni o'ylab ko'ring. TypeScript xatolarni erta aniqlashga yordam beradi va kodingizni saqlashni osonlashtiradi.
• Boshidanoq xalqarolashtirish (i18n) haqida o'ylang. Agar ilovangiz turli mamlakatlardagi foydalanuvchilar tomonidan ishlatilsa, API marshrutlaringizni bir nechta tillar va valyutalarni qo'llab-quvvatlaydigan qilib loyihalashtiring. Masalan, elektron tijorat uchun API endpointlari foydalanuvchining joylashuviga qarab turli soliq stavkalari va yetkazib berish xarajatlarini hisobga olishi kerak bo'lishi mumkin.
• To'g'ri CORS (Cross-Origin Resource Sharing) konfiguratsiyasini amalga oshiring. API-ga Next.js ilovangizdan farqli domendan kirilganda bu juda muhim. Faqat ruxsat etilgan manbalarga API resurslaringizga kirishga imkon berish uchun CORS-ni ehtiyotkorlik bilan sozlang.

Ilg'or usullar

Fon vazifalari (Background Jobs)

API javobini bloklamasligi kerak bo'lgan uzoq davom etadigan vazifalar uchun fon vazifalaridan foydalanishni o'ylab ko'ring. Fon vazifalaringizni boshqarish va ularni asinxron ravishda qayta ishlash uchun BullMQ yoki Bree kabi kutubxonalardan foydalanishingiz mumkin.

WebSockets

Real vaqt rejimida ishlaydigan ilovalar uchun siz Next.js API marshrutlaringizda WebSockets-dan foydalanishingiz mumkin. Socket.IO va ws kabi kutubxonalar mijoz va server o'rtasida doimiy ulanishlarni o'rnatishni osonlashtiradi.

GraphQL

Agar sizga ma'lumotlarni olishning yanada moslashuvchan va samarali usuli kerak bo'lsa, GraphQL-dan foydalanishni o'ylab ko'ring. Next.js ilovangizda GraphQL API endpointini yaratish uchun Apollo Server yoki Yoga kabi kutubxonalardan foydalanishingiz mumkin.

Xulosa

Next.js API marshrutlari to'g'ridan-to'g'ri Next.js ilovangizda serverless bekendlarni qurish uchun kuchli va qulay usulni taqdim etadi. Serverless arxitekturaning afzalliklaridan foydalangan holda, siz ishlab chiqishni soddalashtirishingiz, unumdorlikni oshirishingiz va xarajatlarni kamaytirishingiz mumkin. Oddiy aloqa formasini yoki murakkab elektron tijorat platformasini quryapsizmi, Next.js API marshrutlari sizga osonlik bilan mustahkam va kengaytiriladigan backend yaratishga yordam beradi. Asoslarni puxta tushunish va eng yaxshi amaliyotlarni qo'llash orqali siz ushbu kuchli vositadan samarali, xavfsiz va global miqyosda foydalanish mumkin bo'lgan ilovalarni yaratish uchun foydalanishingiz mumkin.