Back to blogs

How Next js Middleware Works Simple Examples for Authentication SEO and More

June 3, 2025
3 min read
How Next js Middleware Works Simple Examples for Authentication SEO and More

Here’s a simple explanation of how middleware works in Next.js, with real-world examples you can use right away.


What is Middleware in Next.js?


Think of middleware as a security guard at the entrance of your website. Every time someone tries to visit a page, the middleware checks their request before letting them in. You can use it to protect pages, redirect visitors, add headers, or even show different content to people in different countries.


Example 1: Protecting Pages with Authentication


Let’s say you want to make sure only logged-in users can see your dashboard. Here’s how you can do it:


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

export function middleware(request: NextRequest) {
// Check if the user has a session cookie
const isLoggedIn = request.cookies.get('session')?.value

// If not logged in and trying to visit the dashboard, send to login page
if (!isLoggedIn && request.nextUrl.pathname.startsWith('/dashboard')) {
return NextResponse.redirect(new URL('/login', request.url))
}

// If everything is fine, just let them through
return NextResponse.next()
}

// This tells Next.js which pages to run the middleware on
export const config = {
matcher: ['/dashboard/:path*']
}


Example 2: Show Different Content to Bots (like Google)


Sometimes you want to show a special page to search engines. Here’s how:


export function middleware(request: NextRequest) {
// If a search engine bot is visiting, show a special page
if (request.ua?.isBot) {
return NextResponse.rewrite(new URL('/seo-page', request.url))
}

// For everyone else, show the usual page
return NextResponse.next()
}


Example 3: Redirect Users Based on Country


Want to send people from Germany to a German version of your site? Easy!


export function middleware(request: NextRequest) {
const country = request.geo?.country || 'US'

if (country === 'DE') {
return NextResponse.redirect('https://de.yoursite.com')
}

return NextResponse.next()
}


Example 4: Clean Up URLs for SEO


Search engines like clean URLs. Here’s how to remove trailing slashes and make URLs lowercase:


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

// Remove trailing slash (except for the homepage)
if (path.endsWith('/') && path !== '/') {
return NextResponse.redirect(path.slice(0, -1))
}

// Make URL lowercase
if (path !== path.toLowerCase()) {
return NextResponse.redirect(path.toLowerCase())
}

return NextResponse.next()
}


Why Use Middleware?


  1. Protect private pages (like your dashboard)
  2. Improve SEO by cleaning up URLs or showing special pages to bots
  3. Show different content based on where someone is visiting from
  4. Add security headers or other custom logic


Middleware in Next.js is like your website’s bouncer: checking every visitor and making sure they see exactly what you want them to see. It’s simple to set up, and super useful for all kinds of websites!

Next.jsmiddlewareNext.js tutorialauthentication in Next.jshow Next.js middleware worksprotect routes in Next.jsNext.js middleware examplesSEO optimization in Next.jsredirect users in Next.jsNext.js routingserver-side rendering in Next.jsweb development with Next.jsclean URLs in Next.js