rsnext/errors/middleware-parse-user-agent.md
Balázs Orbán b292bdc293
fix(ts): Middleware type tweaks (#38625)
* fix internal type

* allow `void` to be returned from Middleware

* mark deprecated APIs in JSDoc

* fix typo

* add missing error page

* remove unused import
2022-08-08 09:40:44 -05:00

1,008 B

Removed parsed User Agent from Middleware API

Why This Error Occurred

Your application is interacting with req.ua which has been deprecated.

// middleware.ts
import { NextRequest, NextResponse } from 'next/server'

export function middleware(request: NextRequest) {
  const viewport = request.ua.device.type === 'mobile' ? 'mobile' : 'desktop'

  request.nextUrl.searchParams.set('viewport', viewport)
  return NextResponse.rewrites(request.nextUrl)
}

Possible Ways to Fix It

The internal logic has been moved into a separate userAgent function that you can import from next/server and wrap your request instead.

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

export function middleware(request: NextRequest) {
  const { device } = userAgent(request)
  const viewport = device.type === 'mobile' ? 'mobile' : 'desktop'

  request.nextUrl.searchParams.set('viewport', viewport)
  return NextResponse.rewrites(request.nextUrl)
}