वर्सेल एज और अपस्टैश रेडिस के साथ नेक्स्ट.जेएस में रेट लिमिटिंग लागू करें

वर्सेल एज का उपयोग करने के लाभ

• इसे आपके बैकएंड से अलग कर दिया गया है, जिससे आप ट्रैफ़िक को बैकएंड तक पहुंचने से पहले किनारे वाले स्थान पर रोक सकते हैं।
• यह तेज़ है और इसमें कोल्ड स्टार्ट की समस्या नहीं है, जिसके परिणामस्वरूप न्यूनतम ओवरहेड होता है।
• यह सर्वर रहित कार्यों की तुलना में अधिक लागत प्रभावी है।

@upstash/ratelimit क्यों?

• @upstash/ratelimit एक दर सीमित करने वाली लाइब्रेरी है जिसे विशेष रूप से एज फ़ंक्शंस के लिए डिज़ाइन और परीक्षण किया गया है।
• यह किनारे के स्थानों से इष्टतम विलंबता के लिए बहु-क्षेत्र रेडिस का समर्थन करता है।
• अपस्टैश रेडिस एकमात्र प्रबंधित रेडिस है जिसे इसके REST API की बदौलत एज फ़ंक्शंस से एक्सेस किया जा सकता है।

चरण 1:रेडिस सेटअप

चरण 2:Next.js सेटअप

npx create-next-app@latest --typescript

npm i @upstash/ratelimit

import { NextFetchEvent, NextRequest, NextResponse } from "next/server";
 
import { Ratelimit } from "@upstash/ratelimit";
import { Redis } from "@upstash/redis";
 
const redis = new Redis({
 url: "https://us1-merry-snake-32728.upstash.io",
 token: "AX_sAdsdfsgODM5ZjExZGEtMmmVjNmE345445kGVmZTk5MzQ=",
});
 
const ratelimit = new Ratelimit({
 redis: redis,
 limiter: Ratelimit.slidingWindow(5, "10 s"),
});
 
export default async function middleware(
 request: NextRequest,
 event: NextFetchEvent,
): Promise<Response | undefined> {
 const ip = request.ip ?? "127.0.0.1";
 const { success, pending, limit, reset, remaining } =
 await ratelimit.limit(ip);
 return success
 ? NextResponse.next()
 : NextResponse.redirect(new URL("/blocked", request.url));
}
 
export const config = {
 matcher: "/",
};

import styles from "@/styles/Home.module.css";
 
export default function Blocked() {
 return (
 <div>
 <main className={styles.main}>
 <h3>Access blocked.</h3>
 </main>
 </div>
 );
}

कैशिंग के साथ कम रिमोट कॉल

दर सीमित एल्गोरिदम

मल्टी रीजन रेडिस

लिंक