Shield WAF reference
Arcjet Shield WAF protects your application against common attacks, including the OWASP Top 10.
Configuration
Section titled “Configuration”Shield is configured by specifying which mode you want it to run in.
The arcjet client can be configured with one or more Shield rules, which are
constructed with the shield(options: ShieldOptions) function and configured by
ShieldOptions:
type ShieldOptions = { mode?: ArcjetMode | undefined;};type ArcjetMode = "LIVE" | "DRY_RUN";Per route versus middleware
Shield can be configured in two ways:
- Per API route: The rule is defined in the API route itself. This allows you to configure the rule alongside the code it is protecting which is useful if you want to use the decision to add context to your own code. However, it means rules are not located in a single place.
- Middleware: The rule is defined in the middleware. This lets you configure rules in a single place or apply them globally to all routes, but it means the rules are not located alongside the code they are protecting.
Per route
import arcjet, { shield } from "@arcjet/next";
const aj = arcjet({ key: process.env.ARCJET_KEY, rules: [ shield({ mode: "LIVE", }), ],});
export default async function handler(req, res) { const decision = await aj.protect(req);
if (decision.isDenied() && decision.reason.isShield()) { return res.status(403).json({ error: "You are suspicious!" }); // Returning the reason is useful for debugging, but don't return it to the // client in production // .json({ error: "You are suspicious!", reason: decision.reason }); }
res.status(200).json({ name: "Hello world" });}import arcjet, { shield } from "@arcjet/next";import type { NextApiRequest, NextApiResponse } from "next";
const aj = arcjet({ key: process.env.ARCJET_KEY!, rules: [ shield({ mode: "LIVE", }), ],});
export default async function handler( req: NextApiRequest, res: NextApiResponse,) { const decision = await aj.protect(req);
if (decision.isDenied() && decision.reason.isShield()) { return res.status(403).json({ error: "You are suspicious!" }); // Returning the reason is useful for debugging, but don't return it to the // client in production // .json({ error: "You are suspicious!", reason: decision.reason }); }
res.status(200).json({ name: "Hello world" });}import arcjet, { shield } from "@arcjet/next";import { NextResponse } from "next/server";
const aj = arcjet({ key: process.env.ARCJET_KEY!, rules: [ shield({ mode: "LIVE", }), ],});
export async function GET(req: Request) { const decision = await aj.protect(req);
if (decision.isDenied() && decision.reason.isShield()) { return NextResponse.json( { error: "You are suspicious!", // Useful for debugging, but don't return it to the client in // production //reason: decision.reason, }, { status: 403 }, ); }
return NextResponse.json({ message: "Hello world", });}import arcjet, { shield } from "@arcjet/next";import { NextResponse } from "next/server";
const aj = arcjet({ key: process.env.ARCJET_KEY, rules: [ shield({ mode: "LIVE", }), ],});
export async function GET(req) { const decision = await aj.protect(req);
if (decision.isDenied() && decision.reason.isShield()) { return NextResponse.json( { error: "You are suspicious!", // Useful for debugging, but don't return it to the client in // production //reason: decision.reason, }, { status: 403 }, ); }
return NextResponse.json({ message: "Hello world", });}Middleware
This runs on every request to your Next.js app, except for static assets
(configured in the matcher - see the Next.js
docs
for details).
Create a file called proxy.ts in your project root (at the same level as
pages or app or inside src):
import arcjet, { createMiddleware, shield } from "@arcjet/next";export const config = { // matcher tells Next.js which routes to run the middleware on. // This runs the middleware on all routes except for static assets. matcher: ["/((?!_next/static|_next/image|favicon.ico).*)"],};const aj = arcjet({ key: process.env.ARCJET_KEY!, // Get your site key from https://console.arcjet.com rules: [ // Protect against common attacks with Arcjet Shield shield({ mode: "LIVE", // will block requests. Use "DRY_RUN" to log only }), ],});// Pass any existing middleware with the optional existingMiddleware propexport default createMiddleware(aj);Create a file called proxy.js in your project root (at the same level as
pages or app or inside src):
import arcjet, { createMiddleware, shield } from "@arcjet/next";export const config = { // matcher tells Next.js which routes to run the middleware on. // This runs the middleware on all routes except for static assets. matcher: ["/((?!_next/static|_next/image|favicon.ico).*)"],};const aj = arcjet({ key: process.env.ARCJET_KEY, // Get your site key from https://console.arcjet.com rules: [ // Protect against common attacks with Arcjet Shield shield({ mode: "LIVE", // will block requests. Use "DRY_RUN" to log only }), ],});// Pass any existing middleware with the optional existingMiddleware propexport default createMiddleware(aj);Avoid double protection with middleware
If you use Arcjet in middleware and individual routes, you need to be careful that Arcjet is not running multiple times per request. This can be avoided by excluding the API route from the middleware matcher.
For example, if you already have a shield rule defined in the API route
at /api/hello, you can exclude it from the middleware by specifying a matcher
in /proxy.ts:
import arcjet, { createMiddleware, shield } from "@arcjet/next";export const config = { // The matcher prevents the middleware executing on static assets and the // /api/hello API route because you already installed Arcjet directly matcher: ["/((?!_next/static|_next/image|favicon.ico|api/hello).*)"],};const aj = arcjet({ key: process.env.ARCJET_KEY!, rules: [ shield({ mode: "LIVE", }), ],});// Pass any existing middleware with the optional existingMiddleware propexport default createMiddleware(aj);Pages and server actions
Arcjet can be used inside Next.js middleware, API routes, pages, server components, and server actions. Client components cannot be protected because they run on the client only.
See the Next.js SDK reference for examples of pages and page components and server actions.
Decision
Section titled “Decision”Arcjet provides a single protect function that is used to execute your
protection rules. This requires a RequestEvent property which is the event
context as passed to the request handler.
This function returns a Promise that resolves to an
ArcjetDecision object. This contains the following properties:
id(string) – The unique ID for the request. This can be used to look up the request in the Arcjet dashboard. It is prefixed withreq_for decisions involving the Arcjet cloud API. For decisions taken locally, the prefix islreq_.conclusion(ArcjetConclusion) – The final conclusion based on evaluating each of the configured rules. If you wish to accept Arcjet’s recommended action based on the configured rules then you can use this property.reason(ArcjetReason) – An object containing more detailed information about the conclusion.results(ArcjetRuleResult[]) – An array ofArcjetRuleResultobjects containing the results of each rule that was executed.ip(ArcjetIpDetails) – An object containing Arcjet’s analysis of the client IP address. For more information, see the SDK reference.
To check whether a shield rule returned a deny conclusion, use
decision.isDenied() and decision.reason.isShield() (JS) /
decision.is_denied() and decision.reason_v2.type == "SHIELD" (Python).
You can iterate through the results and check whether a shield rule was applied:
for (const result of decision.results) { console.log("Rule Result", result);}for result in decision.results: print("Rule Result", result)This example logs the full result as well as the shield rule:
import arcjet, { fixedWindow, shield } from "@arcjet/next";import { NextResponse } from "next/server";
const aj = arcjet({ key: process.env.ARCJET_KEY!, rules: [ fixedWindow({ mode: "LIVE", window: "1h", max: 60, }), shield({ mode: "LIVE", }), ],});
export async function POST(req: Request) { const decision = await aj.protect(req);
for (const result of decision.results) { console.log("Rule Result", result);
if (result.reason.isRateLimit()) { console.log("Rate limit rule", result); }
if (result.reason.isShield()) { console.log("Shield rule", result); } }
if (decision.isDenied()) { return NextResponse.json({ error: "Forbidden" }, { status: 403 }); }
return NextResponse.json({ message: "Hello world", });}import arcjet, { fixedWindow, shield } from "@arcjet/next";import { NextResponse } from "next/server";
const aj = arcjet({ key: process.env.ARCJET_KEY, rules: [ fixedWindow({ mode: "LIVE", window: "1h", max: 60, }), shield({ mode: "LIVE", }), ],});
export async function POST(req) { const decision = await aj.protect(req);
for (const result of decision.results) { console.log("Rule Result", result);
if (result.reason.isRateLimit()) { console.log("Rate limit rule", result); }
if (result.reason.isShield()) { console.log("Shield rule", result); } }
if (decision.isDenied()) { return NextResponse.json({ error: "Forbidden" }, { status: 403 }); }
return NextResponse.json({ message: "Hello world", });}import arcjet, { fixedWindow, shield } from "@arcjet/next";
const aj = arcjet({ key: process.env.ARCJET_KEY, rules: [ fixedWindow({ mode: "LIVE", window: "1h", max: 60, }), shield({ mode: "LIVE", }), ],});
export default async function handler(req, res) { const decision = await aj.protect(req); console.log("Decision", decision);
for (const result of decision.results) { console.log("Rule Result", result);
if (result.reason.isRateLimit()) { console.log("Rate limit rule", result); }
if (result.reason.isShield()) { console.log("Shield rule", result); } }
if (decision.isDenied()) { return res .status(403) .json({ error: "Forbidden", reason: decision.reason }); }
res.status(200).json({ name: "Hello world" });}import arcjet, { fixedWindow, shield } from "@arcjet/next";import type { NextApiRequest, NextApiResponse } from "next";
const aj = arcjet({ key: process.env.ARCJET_KEY!, rules: [ fixedWindow({ mode: "LIVE", window: "1h", max: 60, }), shield({ mode: "LIVE", }), ],});
export default async function handler( req: NextApiRequest, res: NextApiResponse,) { const decision = await aj.protect(req); console.log("Decision", decision);
for (const result of decision.results) { console.log("Rule Result", result);
if (result.reason.isRateLimit()) { console.log("Rate limit rule", result); }
if (result.reason.isShield()) { console.log("Shield rule", result); } }
if (decision.isDenied()) { return res .status(403) .json({ error: "Forbidden", reason: decision.reason }); }
res.status(200).json({ name: "Hello world" });}Error handling
Section titled “Error handling”Arcjet is designed to fail open so that a service issue or misconfiguration does not block all requests. The SDK also times out and fails open after 2000 ms by default. However, in most cases, the response time is less than 20 ms to 30 ms.
If there is an error condition when processing the rule, Arcjet returns an
ERROR result for that rule and you can check the message property on the
rule’s error result for more information.
If all other rules that were run returned an ALLOW result, then the final
Arcjet conclusion is ERROR.
import arcjet, { shield } from "@arcjet/next";
const aj = arcjet({ key: process.env.ARCJET_KEY, rules: [ shield({ mode: "LIVE", }), ],});
export default async function handler(req, res) { const decision = await aj.protect(req);
for (const { reason } of decision.results) { if (reason.isError()) { // Fail open by logging the error and continuing console.warn("Arcjet error", reason.message); // You could also fail closed here for very sensitive routes //return res.status(503).json({ error: "Service unavailable" }); } }
if (decision.isDenied()) { return res.status(403).json({ error: "You are suspicious!", }); }
res.status(200).json({ name: "Hello world" });}import arcjet, { shield } from "@arcjet/next";import type { NextApiRequest, NextApiResponse } from "next";
const aj = arcjet({ key: process.env.ARCJET_KEY!, rules: [ shield({ mode: "LIVE", }), ],});
export default async function handler( req: NextApiRequest, res: NextApiResponse,) { const decision = await aj.protect(req);
for (const { reason } of decision.results) { if (reason.isError()) { // Fail open by logging the error and continuing console.warn("Arcjet error", reason.message); // You could also fail closed here for very sensitive routes //return res.status(503).json({ error: "Service unavailable" }); } }
if (decision.isDenied()) { return res.status(403).json({ error: "You are suspicious!", }); }
res.status(200).json({ name: "Hello world" });}import arcjet, { shield } from "@arcjet/next";import { NextResponse } from "next/server";
const aj = arcjet({ key: process.env.ARCJET_KEY!, rules: [ shield({ mode: "LIVE", }), ],});
export async function GET(req: Request) { const decision = await aj.protect(req);
for (const { reason } of decision.results) { if (reason.isError()) { // Fail open by logging the error and continuing console.warn("Arcjet error", reason.message); // You could also fail closed here for very sensitive routes //return NextResponse.json({ error: "Service unavailable" }, { status: 503 }); } }
if (decision.isDenied()) { return NextResponse.json( { error: "You are suspicious!", // Useful for debugging, but don't return it to the client in // production //reason: decision.reason, }, { status: 403, }, ); }
return NextResponse.json({ message: "Hello world", });}import arcjet, { shield } from "@arcjet/next";import { NextResponse } from "next/server";
const aj = arcjet({ key: process.env.ARCJET_KEY, rules: [ shield({ mode: "LIVE", }), ],});
export async function GET(req) { const decision = await aj.protect(req);
for (const { reason } of decision.results) { if (reason.isError()) { // Fail open by logging the error and continuing console.warn("Arcjet error", reason.message); // You could also fail closed here for very sensitive routes //return NextResponse.json({ error: "Service unavailable" }, { status: 503 }); } }
if (decision.isDenied()) { return NextResponse.json( { error: "You are suspicious!", // Useful for debugging, but don't return it to the client in // production //reason: decision.reason, }, { status: 403 }, ); }
return NextResponse.json({ message: "Hello world", });}Testing
Section titled “Testing”Arcjet runs the same in any environment, including locally and in CI. You can
use the mode set to DRY_RUN to log the results of rule execution without
blocking any requests.
We have an example test framework you can use to automatically test your rules. Arcjet can also be triggered based using a sample of your traffic.
For details, see the Testing section of the docs.