2022-06-09 13:10:21 +02:00
|
|
|
# Removed req.ua from Middleware API
|
|
|
|
|
|
|
|
#### Why This Error Occurred
|
|
|
|
|
|
|
|
Your middleware is interacting with `req.ua` and this feature needs to opt-in.
|
|
|
|
|
|
|
|
```typescript
|
|
|
|
// middleware.ts
|
|
|
|
import { NextRequest, NextResponse } from 'next/server'
|
|
|
|
|
|
|
|
export function middleware(request: NextRequest) {
|
|
|
|
const url = request.nextUrl
|
|
|
|
const viewport = request.ua.device.type === 'mobile' ? 'mobile' : 'desktop'
|
|
|
|
url.searchParams.set('viewport', viewport)
|
2022-06-24 22:45:02 +02:00
|
|
|
return NextResponse.rewrite(url)
|
2022-06-09 13:10:21 +02:00
|
|
|
}
|
|
|
|
```
|
|
|
|
|
|
|
|
#### Possible Ways to Fix It
|
|
|
|
|
|
|
|
To parse the user agent, import `userAgent` function from `next/server` and give it your request:
|
|
|
|
|
|
|
|
```typescript
|
|
|
|
// middleware.ts
|
|
|
|
import { NextRequest, NextResponse, userAgent } from 'next/server'
|
|
|
|
|
|
|
|
export function middleware(request: NextRequest) {
|
|
|
|
const url = request.nextUrl
|
|
|
|
const { device } = userAgent(request)
|
|
|
|
const viewport = device.type === 'mobile' ? 'mobile' : 'desktop'
|
|
|
|
url.searchParams.set('viewport', viewport)
|
2022-06-24 22:45:02 +02:00
|
|
|
return NextResponse.rewrite(url)
|
2022-06-09 13:10:21 +02:00
|
|
|
}
|
|
|
|
```
|