อัตราการ จำกัด เส้นทาง API ของ Next.js โดยใช้ Upstash Redis

ในบทความนี้ เราจะแสดงวิธีการจำกัดเส้นทาง API ของ Next.js โดยใช้ SDK ขีดจำกัดอัตราอัพสแตช

การตั้งค่าฐานข้อมูล

สร้างฐานข้อมูล Redis โดยใช้ Upstash Console หรือ Upstash CLI คัดลอก UPSTASH_REDIS_REST_URL และ UPSTASH_REDIS_REST_TOKEN สำหรับขั้นตอนต่อไป

การตั้งค่าโครงการ

เราจะสร้างแอปพลิเคชัน Next.js และปรับใช้กับ Vercel

npx create-next-app@latest

ติดตั้ง @upstash/ratelimit:

npm install @upstash/ratelimit @upstash/redis

เดอะโค้ด

อัปเดต pages/api/hello.js . ของคุณ ด้านล่างและแทนที่ UPSTASH_REDIS_REST_URL และ UPSTASH_REDIS_REST_TOKEN .

import {Ratelimit} from "@upstash/ratelimit";
import {Redis} from "@upstash/redis";


const redis = new Redis({
  url: 'UPSTASH_REDIS_REST_URL',
  token: 'UPSTASH_REDIS_REST_TOKEN',
})

// Create a new ratelimiter, that allows 5 requests per 5 seconds
const ratelimit = new Ratelimit({
  redis: redis,
  limiter: Ratelimit.fixedWindow(5, "5 s"),
});

export default async function handler(req, res) {
// Use a constant string to limit all requests with a single ratelimit
// Or use a userID, apiKey or ip address for individual limits.
  const identifier = "api";
  const result = await ratelimit.limit(identifier);
  res.setHeader('X-RateLimit-Limit', result.limit)
  res.setHeader('X-RateLimit-Remaining', result.remaining)

  if (!result.success) {
    res.status(200).json({message: 'The request has been rate limited.', rateLimitState: result})
    return
  }

  res.status(200).json({name: 'John Doe', rateLimitState: result})
}

ที่นี่ เราอนุญาต 5 คำขอต่อ 5 วินาที

วิ่ง

เรียกใช้แอปด้วย npm run dev . รีเฟรชเบราว์เซอร์มากกว่า 5 ครั้งแล้วคุณจะเห็นการจำกัดอัตราในการดำเนินการ

{"message":"The request has been rate limited.","rateLimitState":{"success":false,"limit":5,"remaining":-1,"reset":1654546770000,"pending":{}}}

การปรับปรุงที่เป็นไปได้

• ใช้รหัสผู้ใช้หรือที่อยู่ IP ของคุณเป็นตัวระบุเพื่อจำกัดการใช้งานต่อผู้ใช้

   const identifier = getClientIp(req);
   const result = await ratelimit.limit(identifier);

• ใช้อัลกอริธึมหน้าต่างบานเลื่อนเพื่อประสบการณ์การจำกัดอัตราที่ราบรื่นยิ่งขึ้น (แต่แพงกว่า)

 const ratelimit = new Ratelimit({
  redis: redis,
  limiter: Ratelimit.slidingWindow(10, "10 s"),
});

• ใช้ Token Bucket Algorithm เพื่อทนต่อการเพิ่มขึ้นอย่างรวดเร็ว

 const ratelimit = new Ratelimit({
  redis: redis,
  limiter: Ratelimit.tokenBucket(5, "10 s", 10),
});

• ใช้ Redis หลายรายการในภูมิภาคต่างๆ หากแอปพลิเคชัน Next.js ของคุณถูกปรับใช้ในภูมิภาคต่างๆ วิธีนี้จะช่วยให้คุณลดเวลาในการตอบสนองของสถานที่ต่างๆ ให้เหลือน้อยที่สุด

• เก็บและอ่านข้อมูลประจำตัว Upstash Redis จากตัวแปรสภาพแวดล้อมหรือที่เก็บข้อมูลลับ