Edge Middleware Overview
Learn how you can use Edge Middleware, code that executes before a request is processed on a site, to provide speed and personalization to your users.Edge Middleware is available on all plans
Edge Middleware is code that executes before a request is processed on a site. Based on the request, you can modify the response. Because it runs before the cache, using Middleware is an effective way of providing personalization to statically generated content. Depending on the incoming request, you can execute custom logic, rewrite, redirect, add headers and more, before returning a response.
Middleware uses the Edge runtime, which exposes and extends a subset of Web Standard APIs such FetchEvent
, Response
, and Request
. To learn more about writing Middleware, see the Middleware API docs.
You can use Edge Middleware with any framework. To add Middleware to your app, you need to create a middleware.ts
file at your project's root directory.
The middleware.ts
file should be at the same
level as your app
or pages
directory (even if you're using a src
directory). See
the Quickstart guide for more
information.
Modifying Request Headers in Middleware
Learn to add/update/delete request headers in a middleware.
A/B Testing with Google Optimize
Learn to use Google Optimize as an A/B testing solution for experimentation at the edge.
Hypertune Integration example
Learn to use Hypertune, a powerful feature flag, A/B testing, analytics and app configuration platform.
Bot Protection with DataDome
DataDome can provide real-time bot protection and other security protections to any website. In this template we'll be using it at the edge.
JWT Authentication
Learn how to do JWT authentication at the edge.
IP Blocking with DataDome
DataDome can provide real-time bot protection, ip blocking, custom rules protection and other security protections to any website.
Edge Middleware has full support for the console
API, including time
, debug
, timeEnd
, etc. Logs will appear inside your Vercel project by clicking View Functions Logs next to the deployment.
If your Edge Middleware depends on a database far away from one of our Edge regions, the overall latency of API requests could be slower than expected. To avoid this issue, use a global database. Vercel has multiple global storage products, including Edge Config, Vercel KV, and Vercel Blob. See our storage docs to learn which option is best for you.
Learn more about Edge Middleware by exploring the following resources:
Deploy an Edge Middleware template
Deploy a project setup with Edge Middleware.
Edge Middleware API
Learn about the available APIs when working with Edge Middleware.
Usage and pricing
Learn about usage and pricing for using Edge Middleware with Vercel.
Limitations
Learn about the limitations of using Edge Middleware with Vercel.
Was this helpful?