ಕನ್ನಡ

Next.js ಮಿಡಲ್‌ವೇರ್ ಬಳಸಿ ಸುಧಾರಿತ ರಿಕ್ವೆಸ್ಟ್ ಮಾಡಿಫಿಕೇಶನ್ ತಂತ್ರಗಳನ್ನು ಅನ್ವೇಷಿಸಿ. ದೃಢವಾದ ವೆಬ್ ಅಪ್ಲಿಕೇಶನ್‌ಗಳಿಗಾಗಿ ಸಂಕೀರ್ಣ ರೂಟಿಂಗ್, ದೃಢೀಕರಣ, A/B ಪರೀಕ್ಷೆ ಮತ್ತು ಸ್ಥಳೀಕರಣ ತಂತ್ರಗಳನ್ನು ನಿರ್ವಹಿಸಲು ಕಲಿಯಿರಿ.

Next.js ಮಿಡಲ್‌ವೇರ್ ಎಡ್ಜ್ ಕೇಸ್‌ಗಳು: ರಿಕ್ವೆಸ್ಟ್ ಮಾಡಿಫಿಕೇಶನ್ ಪ್ಯಾಟರ್ನ್‌ಗಳನ್ನು ಕರಗತ ಮಾಡಿಕೊಳ್ಳುವುದು

Next.js ಮಿಡಲ್‌ವೇರ್ ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್‌ನ ರೂಟ್‌ಗಳನ್ನು ತಲುಪುವ ಮೊದಲು ರಿಕ್ವೆಸ್ಟ್‌ಗಳನ್ನು ತಡೆಹಿಡಿಯಲು ಮತ್ತು ಮಾರ್ಪಡಿಸಲು ಒಂದು ಶಕ್ತಿಯುತ ವ್ಯವಸ್ಥೆಯನ್ನು ಒದಗಿಸುತ್ತದೆ. ಈ ಸಾಮರ್ಥ್ಯವು ಸರಳ ದೃಢೀಕರಣ ಪರಿಶೀಲನೆಗಳಿಂದ ಹಿಡಿದು ಸಂಕೀರ್ಣ A/B ಪರೀಕ್ಷಾ ಸನ್ನಿವೇಶಗಳು ಮತ್ತು ಅಂತರರಾಷ್ಟ್ರೀಕರಣ ತಂತ್ರಗಳವರೆಗೆ ವ್ಯಾಪಕ ಶ್ರೇಣಿಯ ಸಾಧ್ಯತೆಗಳನ್ನು ತೆರೆಯುತ್ತದೆ. ಆದಾಗ್ಯೂ, ಮಿಡಲ್‌ವೇರ್ ಅನ್ನು ಪರಿಣಾಮಕಾರಿಯಾಗಿ ಬಳಸಿಕೊಳ್ಳಲು ಅದರ ಎಡ್ಜ್ ಕೇಸ್‌ಗಳು ಮತ್ತು ಸಂಭಾವ್ಯ ಅಪಾಯಗಳ ಬಗ್ಗೆ ಆಳವಾದ ತಿಳುವಳಿಕೆ ಅಗತ್ಯ. ಈ ಸಮಗ್ರ ಮಾರ್ಗದರ್ಶಿ ಸುಧಾರಿತ ರಿಕ್ವೆಸ್ಟ್ ಮಾಡಿಫಿಕೇಶನ್ ಪ್ಯಾಟರ್ನ್‌ಗಳನ್ನು ಪರಿಶೋಧಿಸುತ್ತದೆ, ದೃಢವಾದ ಮತ್ತು ಕಾರ್ಯಕ್ಷಮತೆಯುಳ್ಳ Next.js ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ನಿರ್ಮಿಸಲು ನಿಮಗೆ ಸಹಾಯ ಮಾಡಲು ಪ್ರಾಯೋಗಿಕ ಉದಾಹರಣೆಗಳು ಮತ್ತು ಕ್ರಿಯಾತ್ಮಕ ಒಳನೋಟಗಳನ್ನು ಒದಗಿಸುತ್ತದೆ.

Next.js ಮಿಡಲ್‌ವೇರ್‌ನ ಮೂಲಭೂತ ಅಂಶಗಳನ್ನು ಅರ್ಥಮಾಡಿಕೊಳ್ಳುವುದು

ಸುಧಾರಿತ ಪ್ಯಾಟರ್ನ್‌ಗಳನ್ನು ಪರಿಶೀಲಿಸುವ ಮೊದಲು, Next.js ಮಿಡಲ್‌ವೇರ್‌ನ ಮೂಲಭೂತ ಅಂಶಗಳನ್ನು ಪುನರಾವಲೋಕಿಸೋಣ. ಒಂದು ರಿಕ್ವೆಸ್ಟ್ ಪೂರ್ಣಗೊಳ್ಳುವ ಮೊದಲು ಮಿಡಲ್‌ವೇರ್ ಫಂಕ್ಷನ್‌ಗಳು ಕಾರ್ಯಗತಗೊಳ್ಳುತ್ತವೆ, ಇದು ನಿಮಗೆ ಇವುಗಳನ್ನು ಮಾಡಲು ಅನುಮತಿಸುತ್ತದೆ:

ಮಿಡಲ್‌ವೇರ್ ಫಂಕ್ಷನ್‌ಗಳು ನಿಮ್ಮ /pages ಅಥವಾ /app ಡೈರೆಕ್ಟರಿಯಲ್ಲಿ (ನಿಮ್ಮ Next.js ಆವೃತ್ತಿ ಮತ್ತು ಸೆಟಪ್ ಅನ್ನು ಅವಲಂಬಿಸಿ) middleware.js ಅಥವಾ middleware.ts ಫೈಲ್‌ನಲ್ಲಿ ಇರುತ್ತವೆ. ಅವುಗಳು ಒಳಬರುವ ರಿಕ್ವೆಸ್ಟ್ ಅನ್ನು ಪ್ರತಿನಿಧಿಸುವ NextRequest ಆಬ್ಜೆಕ್ಟ್ ಅನ್ನು ಸ್ವೀಕರಿಸುತ್ತವೆ ಮತ್ತು ನಂತರದ ನಡವಳಿಕೆಯನ್ನು ನಿಯಂತ್ರಿಸಲು NextResponse ಆಬ್ಜೆಕ್ಟ್ ಅನ್ನು ಹಿಂತಿರುಗಿಸಬಹುದು.

ಉದಾಹರಣೆ: ಮೂಲಭೂತ ದೃಢೀಕರಣ ಮಿಡಲ್‌ವೇರ್

ಈ ಉದಾಹರಣೆಯು ಸರಳವಾದ ದೃಢೀಕರಣ ಪರಿಶೀಲನೆಯನ್ನು ಪ್ರದರ್ಶಿಸುತ್ತದೆ. ಬಳಕೆದಾರರು ದೃಢೀಕರಿಸದಿದ್ದರೆ (ಉದಾಹರಣೆಗೆ, ಕುಕೀಯಲ್ಲಿ ಮಾನ್ಯವಾದ ಟೋಕನ್ ಇಲ್ಲದಿದ್ದರೆ), ಅವರನ್ನು ಲಾಗಿನ್ ಪುಟಕ್ಕೆ ಮರುನಿರ್ದೇಶಿಸಲಾಗುತ್ತದೆ.


import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'

export function middleware(request: NextRequest) {
  const authToken = request.cookies.get('authToken')

  if (!authToken) {
    return NextResponse.redirect(new URL('/login', request.url))
  }

  return NextResponse.next()
}

export const config = {
  matcher: ['/protected/:path*'],
}

ಈ ಮಿಡಲ್‌ವೇರ್ ಕೇವಲ /protected/:path* ಗೆ ಹೊಂದಿಕೆಯಾಗುವ ರೂಟ್‌ಗಳಿಗಾಗಿ ಮಾತ್ರ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ. ಇದು authToken ಕುಕೀಯ ಅಸ್ತಿತ್ವವನ್ನು ಪರಿಶೀಲಿಸುತ್ತದೆ. ಕುಕೀ ಕಾಣೆಯಾಗಿದ್ದರೆ, ಬಳಕೆದಾರರನ್ನು /login ಪುಟಕ್ಕೆ ಮರುನಿರ್ದೇಶಿಸಲಾಗುತ್ತದೆ. ಇಲ್ಲದಿದ್ದರೆ, NextResponse.next() ಬಳಸಿ ರಿಕ್ವೆಸ್ಟ್ ಸಾಮಾನ್ಯವಾಗಿ ಮುಂದುವರಿಯಲು ಅನುಮತಿಸಲಾಗುತ್ತದೆ.

ಸುಧಾರಿತ ರಿಕ್ವೆಸ್ಟ್ ಮಾಡಿಫಿಕೇಶನ್ ಪ್ಯಾಟರ್ನ್‌ಗಳು

ಈಗ, Next.js ಮಿಡಲ್‌ವೇರ್‌ನ ನಿಜವಾದ ಶಕ್ತಿಯನ್ನು ಪ್ರದರ್ಶಿಸುವ ಕೆಲವು ಸುಧಾರಿತ ರಿಕ್ವೆಸ್ಟ್ ಮಾಡಿಫಿಕೇಶನ್ ಪ್ಯಾಟರ್ನ್‌ಗಳನ್ನು ಅನ್ವೇಷಿಸೋಣ.

1. ಕುಕೀಗಳೊಂದಿಗೆ A/B ಪರೀಕ್ಷೆ

A/B ಪರೀಕ್ಷೆಯು ಬಳಕೆದಾರರ ಅನುಭವಗಳನ್ನು ಉತ್ತಮಗೊಳಿಸಲು ಒಂದು ಪ್ರಮುಖ ತಂತ್ರವಾಗಿದೆ. ಮಿಡಲ್‌ವೇರ್ ಅನ್ನು ಬಳಕೆದಾರರನ್ನು ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್‌ನ ವಿವಿಧ ಆವೃತ್ತಿಗಳಿಗೆ ಯಾದೃಚ್ಛಿಕವಾಗಿ ನಿಯೋಜಿಸಲು ಮತ್ತು ಅವರ ನಡವಳಿಕೆಯನ್ನು ಟ್ರ್ಯಾಕ್ ಮಾಡಲು ಬಳಸಬಹುದು. ಈ ಪ್ಯಾಟರ್ನ್ ಬಳಕೆದಾರರಿಗೆ ನಿಯೋಜಿಸಲಾದ ವೇರಿಯಂಟ್ ಅನ್ನು ಉಳಿಸಿಕೊಳ್ಳಲು ಕುಕೀಗಳ ಮೇಲೆ ಅವಲಂಬಿತವಾಗಿದೆ.

ಉದಾಹರಣೆ: ಲ್ಯಾಂಡಿಂಗ್ ಪೇಜ್‌ನ A/B ಪರೀಕ್ಷೆ


import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'

const VARIANT_A = 'variantA'
const VARIANT_B = 'variantB'

export function middleware(request: NextRequest) {
  let variant = request.cookies.get('variant')?.value

  if (!variant) {
    // Randomly assign a variant
    variant = Math.random() < 0.5 ? VARIANT_A : VARIANT_B
    const response = NextResponse.next()
    response.cookies.set('variant', variant)
    return response
  }

  if (variant === VARIANT_A) {
    return NextResponse.rewrite(new URL('/variant-a', request.url))
  } else if (variant === VARIANT_B) {
    return NextResponse.rewrite(new URL('/variant-b', request.url))
  }

  return NextResponse.next()
}

export const config = {
  matcher: ['/'],
}

ಈ ಉದಾಹರಣೆಯಲ್ಲಿ, ಬಳಕೆದಾರರು ಮೊದಲ ಬಾರಿಗೆ ರೂಟ್ ಪಾತ್ (/) ಗೆ ಭೇಟಿ ನೀಡಿದಾಗ, ಮಿಡಲ್‌ವೇರ್ ಯಾದೃಚ್ಛಿಕವಾಗಿ ಅವರನ್ನು variantA ಅಥವಾ variantB ಗೆ ನಿಯೋಜಿಸುತ್ತದೆ. ಈ ವೇರಿಯಂಟ್ ಅನ್ನು ಕುಕೀಯಲ್ಲಿ ಸಂಗ್ರಹಿಸಲಾಗುತ್ತದೆ. ಅದೇ ಬಳಕೆದಾರರಿಂದ ನಂತರದ ರಿಕ್ವೆಸ್ಟ್‌ಗಳನ್ನು ಅವರ ನಿಯೋಜಿತ ವೇರಿಯಂಟ್‌ಗೆ ಅನುಗುಣವಾಗಿ /variant-a ಅಥವಾ /variant-b ಗೆ ಪುನಃ ಬರೆಯಲಾಗುತ್ತದೆ. ಇದು ನಿಮಗೆ ವಿಭಿನ್ನ ಲ್ಯಾಂಡಿಂಗ್ ಪುಟಗಳನ್ನು ಒದಗಿಸಲು ಮತ್ತು ಯಾವುದು ಉತ್ತಮವಾಗಿ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ ಎಂಬುದನ್ನು ಟ್ರ್ಯಾಕ್ ಮಾಡಲು ಅನುಮತಿಸುತ್ತದೆ. ನಿಮ್ಮ Next.js ಅಪ್ಲಿಕೇಶನ್‌ನಲ್ಲಿ /variant-a ಮತ್ತು /variant-b ಗಾಗಿ ರೂಟ್‌ಗಳನ್ನು ನೀವು ವ್ಯಾಖ್ಯಾನಿಸಿದ್ದೀರಿ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ.

ಜಾಗತಿಕ ಪರಿಗಣನೆಗಳು: A/B ಪರೀಕ್ಷೆಯನ್ನು ನಡೆಸುವಾಗ, ಪ್ರಾದೇಶಿಕ ವ್ಯತ್ಯಾಸಗಳನ್ನು ಪರಿಗಣಿಸಿ. ಉತ್ತರ ಅಮೆರಿಕಾದಲ್ಲಿ ಇಷ್ಟವಾಗುವ ವಿನ್ಯಾಸವು ಏಷ್ಯಾದಲ್ಲಿ ಅಷ್ಟೇ ಪರಿಣಾಮಕಾರಿಯಾಗಿರದಿರಬಹುದು. ನಿರ್ದಿಷ್ಟ ಪ್ರದೇಶಗಳಿಗೆ A/B ಪರೀಕ್ಷೆಯನ್ನು ಸರಿಹೊಂದಿಸಲು ನೀವು ಜಿಯೋಲೊಕೇಶನ್ ಡೇಟಾವನ್ನು (IP ವಿಳಾಸ ಹುಡುಕಾಟ ಅಥವಾ ಬಳಕೆದಾರರ ಆದ್ಯತೆಗಳ ಮೂಲಕ ಪಡೆದ) ಬಳಸಬಹುದು.

2. URL ಪುನಃ ಬರೆಯುವಿಕೆಗಳೊಂದಿಗೆ ಸ್ಥಳೀಕರಣ (i18n)

ಅಂತರರಾಷ್ಟ್ರೀಕರಣ (i18n) ಜಾಗತಿಕ ಪ್ರೇಕ್ಷಕರನ್ನು ತಲುಪಲು ಅತ್ಯಗತ್ಯ. ಮಿಡಲ್‌ವೇರ್ ಅನ್ನು ಬಳಕೆದಾರರ ಆದ್ಯತೆಯ ಭಾಷೆಯನ್ನು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಪತ್ತೆಹಚ್ಚಲು ಮತ್ತು ಅವರನ್ನು ನಿಮ್ಮ ಸೈಟ್‌ನ ಸೂಕ್ತವಾದ ಸ್ಥಳೀಯ ಆವೃತ್ತಿಗೆ ಮರುನಿರ್ದೇಶಿಸಲು ಬಳಸಬಹುದು.

ಉದಾಹರಣೆ: `Accept-Language` ಹೆಡರ್ ಆಧಾರದ ಮೇಲೆ ಮರುನಿರ್ದೇಶಿಸುವುದು


import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'

const SUPPORTED_LANGUAGES = ['en', 'fr', 'es', 'de']
const DEFAULT_LANGUAGE = 'en'

function getPreferredLanguage(request: NextRequest): string {
  const acceptLanguage = request.headers.get('accept-language')
  if (!acceptLanguage) {
    return DEFAULT_LANGUAGE
  }

  const languages = acceptLanguage.split(',').map((lang) => lang.split(';')[0].trim())

  for (const lang of languages) {
    if (SUPPORTED_LANGUAGES.includes(lang)) {
      return lang
    }
  }

  return DEFAULT_LANGUAGE
}

export function middleware(request: NextRequest) {
  const pathname = request.nextUrl.pathname

  // Check if there's an existing locale in the pathname
  if (
    SUPPORTED_LANGUAGES.some(
      (locale) => pathname.startsWith(`/${locale}/`) || pathname === `/${locale}`
    )
  ) {
    return NextResponse.next()
  }

  const preferredLanguage = getPreferredLanguage(request)

  return NextResponse.redirect(
    new URL(`/${preferredLanguage}${pathname}`, request.url)
  )
}

export const config = {
  matcher: [
    '/((?!api|_next/static|_next/image|favicon.ico).*)'
  ],
}

ಈ ಮಿಡಲ್‌ವೇರ್ ರಿಕ್ವೆಸ್ಟ್‌ನಿಂದ Accept-Language ಹೆಡರ್ ಅನ್ನು ಹೊರತೆಗೆದು ಬಳಕೆದಾರರ ಆದ್ಯತೆಯ ಭಾಷೆಯನ್ನು ನಿರ್ಧರಿಸುತ್ತದೆ. URL ಈಗಾಗಲೇ ಭಾಷೆಯ ಪೂರ್ವಪ್ರತ್ಯಯವನ್ನು ಹೊಂದಿಲ್ಲದಿದ್ದರೆ (ಉದಾ., /en/about), ಮಿಡಲ್‌ವೇರ್ ಬಳಕೆದಾರರನ್ನು ಸೂಕ್ತವಾದ ಸ್ಥಳೀಯ URL ಗೆ ಮರುನಿರ್ದೇಶಿಸುತ್ತದೆ (ಉದಾ., ಫ್ರೆಂಚ್‌ಗಾಗಿ /fr/about). ನಿಮ್ಮ `/pages` ಅಥವಾ `/app` ಡೈರೆಕ್ಟರಿಯಲ್ಲಿ ವಿವಿಧ ಸ್ಥಳೀಯತೆಗಳಿಗಾಗಿ ಸೂಕ್ತವಾದ ಫೋಲ್ಡರ್ ರಚನೆಯನ್ನು ಹೊಂದಿರುವಿರೆಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ. ಉದಾಹರಣೆಗೆ, ನಿಮಗೆ `/pages/en/about.js` ಮತ್ತು `/pages/fr/about.js` ಫೈಲ್‌ಗಳು ಬೇಕಾಗುತ್ತವೆ.

ಜಾಗತಿಕ ಪರಿಗಣನೆಗಳು: ನಿಮ್ಮ i18n ಅನುಷ್ಠಾನವು ಬಲದಿಂದ ಎಡಕ್ಕೆ ಬರೆಯುವ ಭಾಷೆಗಳನ್ನು (ಉದಾ., ಅರೇಬಿಕ್, ಹೀಬ್ರೂ) ಸರಿಯಾಗಿ ನಿರ್ವಹಿಸುತ್ತದೆ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ. ಅಲ್ಲದೆ, ನಿಮ್ಮ ಬಳಕೆದಾರರಿಗೆ ಹತ್ತಿರವಿರುವ ಸರ್ವರ್‌ಗಳಿಂದ ಸ್ಥಳೀಯ ಸ್ವತ್ತುಗಳನ್ನು ಒದಗಿಸಲು ಕಂಟೆಂಟ್ ಡೆಲಿವರಿ ನೆಟ್‌ವರ್ಕ್ (CDN) ಬಳಸುವುದನ್ನು ಪರಿಗಣಿಸಿ, ಇದು ಕಾರ್ಯಕ್ಷಮತೆಯನ್ನು ಸುಧಾರಿಸುತ್ತದೆ.

3. ಫೀಚರ್ ಫ್ಲ್ಯಾಗ್‌ಗಳು

ಫೀಚರ್ ಫ್ಲ್ಯಾಗ್‌ಗಳು ಹೊಸ ಕೋಡ್ ಅನ್ನು ನಿಯೋಜಿಸದೆ ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್‌ನಲ್ಲಿ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ಸಕ್ರಿಯಗೊಳಿಸಲು ಅಥವಾ ನಿಷ್ಕ್ರಿಯಗೊಳಿಸಲು ನಿಮಗೆ ಅನುಮತಿಸುತ್ತದೆ. ಇದು ಹೊಸ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ಹಂತಹಂತವಾಗಿ ಬಿಡುಗಡೆ ಮಾಡಲು ಅಥವಾ ಉತ್ಪಾದನೆಯಲ್ಲಿ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ಪರೀಕ್ಷಿಸಲು ವಿಶೇಷವಾಗಿ ಉಪಯುಕ್ತವಾಗಿದೆ. ಮಿಡಲ್‌ವೇರ್ ಅನ್ನು ವೈಶಿಷ್ಟ್ಯದ ಫ್ಲ್ಯಾಗ್‌ನ ಸ್ಥಿತಿಯನ್ನು ಪರಿಶೀಲಿಸಲು ಮತ್ತು ಅದಕ್ಕೆ ಅನುಗುಣವಾಗಿ ರಿಕ್ವೆಸ್ಟ್ ಅನ್ನು ಮಾರ್ಪಡಿಸಲು ಬಳಸಬಹುದು.

ಉದಾಹರಣೆ: ಬೀಟಾ ಫೀಚರ್ ಅನ್ನು ಸಕ್ರಿಯಗೊಳಿಸುವುದು


import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'

const BETA_FEATURE_ENABLED = process.env.BETA_FEATURE_ENABLED === 'true'

export function middleware(request: NextRequest) {
  if (BETA_FEATURE_ENABLED && request.nextUrl.pathname.startsWith('/new-feature')) {
    return NextResponse.next()
  }

  // Optionally redirect to a "feature unavailable" page
  return NextResponse.rewrite(new URL('/feature-unavailable', request.url))
}

export const config = {
  matcher: ['/new-feature/:path*'],
}

ಈ ಮಿಡಲ್‌ವೇರ್ BETA_FEATURE_ENABLED ಎನ್ವಿರಾನ್ಮೆಂಟ್ ವೇರಿಯೇಬಲ್‌ನ ಮೌಲ್ಯವನ್ನು ಪರಿಶೀಲಿಸುತ್ತದೆ. ಅದನ್ನು true ಗೆ ಹೊಂದಿಸಿದ್ದರೆ ಮತ್ತು ಬಳಕೆದಾರರು /new-feature ಅಡಿಯಲ್ಲಿನ ರೂಟ್‌ಗೆ ಪ್ರವೇಶಿಸಲು ಪ್ರಯತ್ನಿಸುತ್ತಿದ್ದರೆ, ರಿಕ್ವೆಸ್ಟ್ ಮುಂದುವರಿಯಲು ಅನುಮತಿಸಲಾಗುತ್ತದೆ. ಇಲ್ಲದಿದ್ದರೆ, ಬಳಕೆದಾರರನ್ನು /feature-unavailable ಪುಟಕ್ಕೆ ಮರುನಿರ್ದೇಶಿಸಲಾಗುತ್ತದೆ. ವಿವಿಧ ಪರಿಸರಗಳಿಗೆ (ಡೆವಲಪ್‌ಮೆಂಟ್, ಸ್ಟೇಜಿಂಗ್, ಪ್ರೊಡಕ್ಷನ್) ಎನ್ವಿರಾನ್ಮೆಂಟ್ ವೇರಿಯೇಬಲ್‌ಗಳನ್ನು ಸೂಕ್ತವಾಗಿ ಕಾನ್ಫಿಗರ್ ಮಾಡಲು ಮರೆಯದಿರಿ.

ಜಾಗತಿಕ ಪರಿಗಣನೆಗಳು: ಫೀಚರ್ ಫ್ಲ್ಯಾಗ್‌ಗಳನ್ನು ಬಳಸುವಾಗ, ಎಲ್ಲಾ ಪ್ರದೇಶಗಳಲ್ಲಿನ ನಿಯಮಗಳಿಗೆ ಅನುಗುಣವಾಗಿರದ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ಸಕ್ರಿಯಗೊಳಿಸುವುದರ ಕಾನೂನುಬದ್ಧ ಪರಿಣಾಮಗಳನ್ನು ಪರಿಗಣಿಸಿ. ಉದಾಹರಣೆಗೆ, ಡೇಟಾ ಗೌಪ್ಯತೆಗೆ ಸಂಬಂಧಿಸಿದ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ಕೆಲವು ದೇಶಗಳಲ್ಲಿ ನಿಷ್ಕ್ರಿಯಗೊಳಿಸಬೇಕಾಗಬಹುದು.

4. ಸಾಧನ ಪತ್ತೆ ಮತ್ತು ಅಡಾಪ್ಟಿವ್ ರೂಟಿಂಗ್

ಆಧುನಿಕ ವೆಬ್ ಅಪ್ಲಿಕೇಶನ್‌ಗಳು ರೆಸ್ಪಾನ್ಸಿವ್ ಆಗಿರಬೇಕು ಮತ್ತು ವಿಭಿನ್ನ ಸ್ಕ್ರೀನ್ ಗಾತ್ರಗಳು ಮತ್ತು ಸಾಧನದ ಸಾಮರ್ಥ್ಯಗಳಿಗೆ ಹೊಂದಿಕೊಳ್ಳಬೇಕು. ಮಿಡಲ್‌ವೇರ್ ಅನ್ನು ಬಳಕೆದಾರರ ಸಾಧನದ ಪ್ರಕಾರವನ್ನು ಪತ್ತೆಹಚ್ಚಲು ಮತ್ತು ಅವರನ್ನು ನಿಮ್ಮ ಸೈಟ್‌ನ ಆಪ್ಟಿಮೈಸ್ ಮಾಡಿದ ಆವೃತ್ತಿಗಳಿಗೆ ಮರುನಿರ್ದೇಶಿಸಲು ಬಳಸಬಹುದು.

ಉದಾಹರಣೆ: ಮೊಬೈಲ್ ಬಳಕೆದಾರರನ್ನು ಮೊಬೈಲ್-ಆಪ್ಟಿಮೈಸ್ಡ್ ಸಬ್‌ಡೊಮೇನ್‌ಗೆ ಮರುನಿರ್ದೇಶಿಸುವುದು


import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'
import { device } from 'detection'

export function middleware(request: NextRequest) {
  const userAgent = request.headers.get('user-agent')

  if (userAgent) {
    const deviceType = device(userAgent)

    if (deviceType.type === 'phone') {
      const mobileUrl = new URL(request.url)
      mobileUrl.hostname = 'm.example.com'
      return NextResponse.redirect(mobileUrl)
    }
  }

  return NextResponse.next()
}

export const config = {
  matcher: ['/'],
}

ಈ ಉದಾಹರಣೆಯು User-Agent ಹೆಡರ್ ಅನ್ನು ಆಧರಿಸಿ ಬಳಕೆದಾರರ ಸಾಧನದ ಪ್ರಕಾರವನ್ನು ನಿರ್ಧರಿಸಲು `detection` ಲೈಬ್ರರಿಯನ್ನು ಬಳಸುತ್ತದೆ. ಬಳಕೆದಾರರು ಮೊಬೈಲ್ ಫೋನ್‌ನಲ್ಲಿದ್ದರೆ, ಅವರನ್ನು m.example.com ಸಬ್‌ಡೊಮೇನ್‌ಗೆ ಮರುನಿರ್ದೇಶಿಸಲಾಗುತ್ತದೆ (ನೀವು ಅಲ್ಲಿ ನಿಮ್ಮ ಸೈಟ್‌ನ ಮೊಬೈಲ್-ಆಪ್ಟಿಮೈಸ್ ಮಾಡಿದ ಆವೃತ್ತಿಯನ್ನು ಹೋಸ್ಟ್ ಮಾಡಿದ್ದೀರಿ ಎಂದು ಭಾವಿಸಲಾಗಿದೆ). `detection` ಪ್ಯಾಕೇಜ್ ಅನ್ನು ಸ್ಥಾಪಿಸಲು ಮರೆಯದಿರಿ: `npm install detection`.

ಜಾಗತಿಕ ಪರಿಗಣನೆಗಳು: ನಿಮ್ಮ ಸಾಧನ ಪತ್ತೆ ತರ್ಕವು ಸಾಧನ ಬಳಕೆಯಲ್ಲಿನ ಪ್ರಾದೇಶಿಕ ವ್ಯತ್ಯಾಸಗಳನ್ನು ಗಣನೆಗೆ ತೆಗೆದುಕೊಳ್ಳುತ್ತದೆ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ. ಉದಾಹರಣೆಗೆ, ಕೆಲವು ಅಭಿವೃದ್ಧಿಶೀಲ ರಾಷ್ಟ್ರಗಳಲ್ಲಿ ಫೀಚರ್ ಫೋನ್‌ಗಳು ಇನ್ನೂ ಪ್ರಚಲಿತದಲ್ಲಿವೆ. ಹೆಚ್ಚು ದೃಢವಾದ ಪರಿಹಾರಕ್ಕಾಗಿ ಯೂಸರ್-ಏಜೆಂಟ್ ಪತ್ತೆ ಮತ್ತು ರೆಸ್ಪಾನ್ಸಿವ್ ವಿನ್ಯಾಸ ತಂತ್ರಗಳ ಸಂಯೋಜನೆಯನ್ನು ಬಳಸುವುದನ್ನು ಪರಿಗಣಿಸಿ.

5. ರಿಕ್ವೆಸ್ಟ್ ಹೆಡರ್ ಸಮೃದ್ಧೀಕರಣ

ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್ ರೂಟ್‌ಗಳಿಂದ ಪ್ರಕ್ರಿಯೆಗೊಳ್ಳುವ ಮೊದಲು ಮಿಡಲ್‌ವೇರ್ ರಿಕ್ವೆಸ್ಟ್ ಹೆಡರ್‌ಗಳಿಗೆ ಮಾಹಿತಿಯನ್ನು ಸೇರಿಸಬಹುದು. ಇದು ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್ ತರ್ಕದಿಂದ ಬಳಸಬಹುದಾದ ಬಳಕೆದಾರ ಪಾತ್ರಗಳು, ದೃಢೀಕರಣ ಸ್ಥಿತಿ, ಅಥವಾ ರಿಕ್ವೆಸ್ಟ್ ID ಗಳಂತಹ ಕಸ್ಟಮ್ ಮೆಟಾಡೇಟಾವನ್ನು ಸೇರಿಸಲು ಉಪಯುಕ್ತವಾಗಿದೆ.

ಉದಾಹರಣೆ: ರಿಕ್ವೆಸ್ಟ್ ID ಸೇರಿಸುವುದು


import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'
import { v4 as uuidv4 } from 'uuid'

export function middleware(request: NextRequest) {
  const requestId = uuidv4()
  const response = NextResponse.next()
  response.headers.set('x-request-id', requestId)
  return response
}

export const config = {
  matcher: ['/api/:path*'], // Only apply to API routes
}

ಈ ಮಿಡಲ್‌ವೇರ್ uuid ಲೈಬ್ರರಿಯನ್ನು ಬಳಸಿ ಒಂದು ಅನನ್ಯ ರಿಕ್ವೆಸ್ಟ್ IDಯನ್ನು ರಚಿಸುತ್ತದೆ ಮತ್ತು ಅದನ್ನು x-request-id ಹೆಡರ್‌ಗೆ ಸೇರಿಸುತ್ತದೆ. ಈ ID ಅನ್ನು ನಂತರ ಲಾಗಿಂಗ್, ಟ್ರೇಸಿಂಗ್, ಮತ್ತು ಡೀಬಗ್ಗಿಂಗ್ ಉದ್ದೇಶಗಳಿಗಾಗಿ ಬಳಸಬಹುದು. uuid ಪ್ಯಾಕೇಜ್ ಅನ್ನು ಸ್ಥಾಪಿಸಲು ಮರೆಯದಿರಿ: `npm install uuid`.

ಜಾಗತಿಕ ಪರಿಗಣನೆಗಳು: ಕಸ್ಟಮ್ ಹೆಡರ್‌ಗಳನ್ನು ಸೇರಿಸುವಾಗ, ಹೆಡರ್ ಗಾತ್ರದ ಮಿತಿಗಳ ಬಗ್ಗೆ ಗಮನವಿರಲಿ. ಈ ಮಿತಿಗಳನ್ನು ಮೀರಿದರೆ ಅನಿರೀಕ್ಷಿತ ದೋಷಗಳಿಗೆ ಕಾರಣವಾಗಬಹುದು. ಅಲ್ಲದೆ, ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್ ರಿವರ್ಸ್ ಪ್ರಾಕ್ಸಿ ಅಥವಾ CDN ಹಿಂದೆ ಇದ್ದರೆ, ಹೆಡರ್‌ಗಳಿಗೆ ಸೇರಿಸಲಾದ ಯಾವುದೇ ಸೂಕ್ಷ್ಮ ಮಾಹಿತಿಯನ್ನು ಸರಿಯಾಗಿ ರಕ್ಷಿಸಲಾಗಿದೆಯೆ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ.

6. ಭದ್ರತಾ ಸುಧಾರಣೆಗಳು: ರೇಟ್ ಲಿಮಿಟಿಂಗ್

ಮಿಡಲ್‌ವೇರ್ ರೇಟ್ ಲಿಮಿಟಿಂಗ್ ಅನ್ನು ಕಾರ್ಯಗತಗೊಳಿಸುವ ಮೂಲಕ ದುರುದ್ದೇಶಪೂರಿತ ದಾಳಿಗಳ ವಿರುದ್ಧ ಮೊದಲ ರಕ್ಷಣಾ ರೇಖೆಯಾಗಿ ಕಾರ್ಯನಿರ್ವಹಿಸಬಹುದು. ಇದು ನಿರ್ದಿಷ್ಟ ಸಮಯದ ಚೌಕಟ್ಟಿನೊಳಗೆ ಕ್ಲೈಂಟ್ ಮಾಡಬಹುದಾದ ರಿಕ್ವೆಸ್ಟ್‌ಗಳ ಸಂಖ್ಯೆಯನ್ನು ಸೀಮಿತಗೊಳಿಸುವ ಮೂಲಕ ದುರುಪಯೋಗವನ್ನು ತಡೆಯುತ್ತದೆ.

ಉದಾಹರಣೆ: ಸರಳ ಸ್ಟೋರ್ ಬಳಸಿ ಮೂಲಭೂತ ರೇಟ್ ಲಿಮಿಟಿಂಗ್


import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'

const requestCounts: { [ip: string]: number } = {}
const WINDOW_SIZE_MS = 60000; // 1 minute
const MAX_REQUESTS_PER_WINDOW = 100;

export function middleware(request: NextRequest) {
  const clientIP = request.ip || '127.0.0.1' // Get client IP, default to localhost for local testing

  if (!requestCounts[clientIP]) {
    requestCounts[clientIP] = 0;
  }

  requestCounts[clientIP]++;

  if (requestCounts[clientIP] > MAX_REQUESTS_PER_WINDOW) {
    return new NextResponse(
      JSON.stringify({ message: 'Too many requests' }),
      { status: 429, headers: { 'Content-Type': 'application/json' } }
    );
  }

  // Reset count after window
  setTimeout(() => {
    requestCounts[clientIP]--;
    if (requestCounts[clientIP] <= 0) {
        delete requestCounts[clientIP];
    }
  }, WINDOW_SIZE_MS);

  return NextResponse.next();
}

export const config = {
  matcher: ['/api/:path*'], // Apply to all API routes
}

ಈ ಉದಾಹರಣೆಯು ಪ್ರತಿ IP ವಿಳಾಸದಿಂದ ಬರುವ ರಿಕ್ವೆಸ್ಟ್‌ಗಳ ಸಂಖ್ಯೆಯನ್ನು ಟ್ರ್ಯಾಕ್ ಮಾಡಲು ಸರಳವಾದ ಇನ್-ಮೆಮೊರಿ ಸ್ಟೋರ್ (requestCounts) ಅನ್ನು ನಿರ್ವಹಿಸುತ್ತದೆ. ಕ್ಲೈಂಟ್ WINDOW_SIZE_MS ಒಳಗೆ MAX_REQUESTS_PER_WINDOW ಅನ್ನು ಮೀರಿದರೆ, ಮಿಡಲ್‌ವೇರ್ 429 Too Many Requests ದೋಷವನ್ನು ಹಿಂತಿರುಗಿಸುತ್ತದೆ. ಪ್ರಮುಖ: ಇದು ಒಂದು ಸರಳೀಕೃತ ಉದಾಹರಣೆಯಾಗಿದ್ದು, ಇದು ಸ್ಕೇಲ್ ಆಗುವುದಿಲ್ಲ ಮತ್ತು ಡಿನೈಯಲ್-ಆಫ್-ಸರ್ವೀಸ್ ದಾಳಿಗೆ ಗುರಿಯಾಗುವುದರಿಂದ ಪ್ರೊಡಕ್ಷನ್ ಪರಿಸರಕ್ಕೆ ಸೂಕ್ತವಲ್ಲ. ಪ್ರೊಡಕ್ಷನ್ ಬಳಕೆಗಾಗಿ, ರೆಡಿಸ್ ಅಥವಾ ಮೀಸಲಾದ ರೇಟ್-ಲಿಮಿಟಿಂಗ್ ಸೇವೆಯಂತಹ ಹೆಚ್ಚು ದೃಢವಾದ ರೇಟ್-ಲಿಮಿಟಿಂಗ್ ಪರಿಹಾರವನ್ನು ಬಳಸುವುದನ್ನು ಪರಿಗಣಿಸಿ.

ಜಾಗತಿಕ ಪರಿಗಣನೆಗಳು: ರೇಟ್-ಲಿಮಿಟಿಂಗ್ ತಂತ್ರಗಳು ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್‌ನ ನಿರ್ದಿಷ್ಟ ಗುಣಲಕ್ಷಣಗಳು ಮತ್ತು ನಿಮ್ಮ ಬಳಕೆದಾರರ ಭೌಗೋಳಿಕ ವಿತರಣೆಗೆ ಅನುಗುಣವಾಗಿರಬೇಕು. ವಿವಿಧ ಪ್ರದೇಶಗಳು ಅಥವಾ ಬಳಕೆದಾರ ವಿಭಾಗಗಳಿಗೆ ವಿಭಿನ್ನ ರೇಟ್ ಮಿತಿಗಳನ್ನು ಬಳಸುವುದನ್ನು ಪರಿಗಣಿಸಿ.

ಎಡ್ಜ್ ಕೇಸ್‌ಗಳು ಮತ್ತು ಸಂಭಾವ್ಯ ಅಪಾಯಗಳು

ಮಿಡಲ್‌ವೇರ್ ಒಂದು ಶಕ್ತಿಯುತ ಸಾಧನವಾಗಿದ್ದರೂ, ಅದರ ಮಿತಿಗಳು ಮತ್ತು ಸಂಭಾವ್ಯ ಅಪಾಯಗಳ ಬಗ್ಗೆ ತಿಳಿದಿರುವುದು ಅತ್ಯಗತ್ಯ:

Next.js ಮಿಡಲ್‌ವೇರ್ ಬಳಸಲು ಉತ್ತಮ ಅಭ್ಯಾಸಗಳು

Next.js ಮಿಡಲ್‌ವೇರ್‌ನ ಪ್ರಯೋಜನಗಳನ್ನು ಗರಿಷ್ಠಗೊಳಿಸಲು ಮತ್ತು ಸಂಭಾವ್ಯ ಸಮಸ್ಯೆಗಳನ್ನು ತಪ್ಪಿಸಲು, ಈ ಉತ್ತಮ ಅಭ್ಯಾಸಗಳನ್ನು ಅನುಸರಿಸಿ:

ತೀರ್ಮಾನ

Next.js ಮಿಡಲ್‌ವೇರ್ ರಿಕ್ವೆಸ್ಟ್‌ಗಳನ್ನು ಮಾರ್ಪಡಿಸಲು ಮತ್ತು ಎಡ್ಜ್‌ನಲ್ಲಿ ನಿಮ್ಮ ಅಪ್ಲಿಕೇಶನ್‌ನ ನಡವಳಿಕೆಯನ್ನು ಕಸ್ಟಮೈಸ್ ಮಾಡಲು ಒಂದು ಶಕ್ತಿಯುತ ಮಾರ್ಗವನ್ನು ನೀಡುತ್ತದೆ. ಈ ಮಾರ್ಗದರ್ಶಿಯಲ್ಲಿ ಚರ್ಚಿಸಲಾದ ಸುಧಾರಿತ ರಿಕ್ವೆಸ್ಟ್ ಮಾಡಿಫಿಕೇಶನ್ ಪ್ಯಾಟರ್ನ್‌ಗಳನ್ನು ಅರ್ಥಮಾಡಿಕೊಳ್ಳುವ ಮೂಲಕ, ನೀವು ದೃಢವಾದ, ಕಾರ್ಯಕ್ಷಮತೆಯುಳ್ಳ, ಮತ್ತು ಜಾಗತಿಕವಾಗಿ ಅರಿವುಳ್ಳ Next.js ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ನಿರ್ಮಿಸಬಹುದು. ಎಡ್ಜ್ ಕೇಸ್‌ಗಳು ಮತ್ತು ಸಂಭಾವ್ಯ ಅಪಾಯಗಳನ್ನು ಎಚ್ಚರಿಕೆಯಿಂದ ಪರಿಗಣಿಸಲು ಮರೆಯದಿರಿ, ಮತ್ತು ನಿಮ್ಮ ಮಿಡಲ್‌ವೇರ್ ಫಂಕ್ಷನ್‌ಗಳು ವಿಶ್ವಾಸಾರ್ಹ ಮತ್ತು ನಿರ್ವಹಣೆಗೆ ಯೋಗ್ಯವಾಗಿವೆ ಎಂದು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ಮೇಲೆ ವಿವರಿಸಿದ ಉತ್ತಮ ಅಭ್ಯಾಸಗಳನ್ನು ಅನುಸರಿಸಿ. ಅಸಾಧಾರಣ ಬಳಕೆದಾರ ಅನುಭವಗಳನ್ನು ರಚಿಸಲು ಮತ್ತು ನಿಮ್ಮ ವೆಬ್ ಅಪ್ಲಿಕೇಶನ್‌ಗಳಿಗಾಗಿ ಹೊಸ ಸಾಧ್ಯತೆಗಳನ್ನು ಅನ್ಲಾಕ್ ಮಾಡಲು ಮಿಡಲ್‌ವೇರ್‌ನ ಶಕ್ತಿಯನ್ನು ಅಳವಡಿಸಿಕೊಳ್ಳಿ.