This demo shows how to use
@happykit/flags in Next.js Middleware.
You have been served the "
short" checkout variant.
This example uses a
_middleware file at
pages/demo/middleware to statically render different variants for the
/demo/middleware path. The different variants live under
The middleware loads the flags and rewrites the incoming request either to
variant-full.tsx depending on the resolved flag variant.
Since resulting page is served statically from the edge, rendering will use no visitor key. This is necessary as the concept of a visitor does not exist during static site generation. Thus all rules and percentage-based rollouts targeting a visitor resolve to
The middleware loads the flags purely to decide where to rewrite the request to. It does not send any resolved flags into the application itself.
You are however free to call
useFlags() on the client and combine this approach with the middleware.