Capítulo 192 de 456

userAgent

Core Idea

Helper that extends the Web Request API with parsed user-agent information (browser, device, engine, OS, CPU) — used typically inside a proxy.ts middleware-equivalent to branch behavior by device.

Key Concepts

  • userAgent(request): Retorna { isBot, browser, device, engine, os, cpu }.
  • device.type: 'mobile' | 'tablet' | 'console' | 'smarttv' | 'wearable' | 'embedded' | undefined (undefined = desktop).

Code Examples

import { NextRequest, NextResponse, userAgent } from 'next/server'

export function proxy(request: NextRequest) {
  const url = request.nextUrl
  const { device } = userAgent(request)
  const viewport = device.type || 'desktop'
  url.searchParams.set('viewport', viewport)
  return NextResponse.rewrite(url)
}
  • O que demonstra: Reescreve a URL adicionando um search param baseado no tipo de dispositivo detectado.

Reference Tables

CampoPropriedades
browsername, version
devicemodel, type, vendor
enginename (Amaya, Blink, EdgeHTML, Flow, Gecko, Goanna, iCab, KHTML, Links, Lynx, NetFront, NetSurf, Presto, Tasman, Trident, w3m, WebKit), version
osname, version
cpuarchitecture (68k, amd64, arm, arm64, armhf, avr, ia32, ia64, irix, irix64, mips, mips64, pa-risc, ppc, sparc, sparc64)

Key Takeaways

  1. Importa de next/server, junto com NextRequest/NextResponse.
  2. isBot permite branch simples para bots conhecidos sem parsing manual de header.
  3. Qualquer campo pode ser undefined quando não identificável — trate com fallback (ex. device.type || 'desktop').

Connects To

  • NextRequest / NextResponse: usados junto no mesmo arquivo proxy.ts.
AnterioruseSelectedLayoutSegmentsPróximoConfiguration