ข้ามไปเนื้อหาหลัก

Astro Middleware — intercept requests ก่อนถึง page

Astro middleware รันก่อน page/endpoint render — ใช้ set headers, redirect, inject data หรือ protect routes

// src/middleware.ts
import { defineMiddleware } from 'astro:middleware';

export const onRequest = defineMiddleware(async (context, next) => {
  // อ่านจาก request
  const url = context.url;
  const cookies = context.cookies;

  // inject data เข้า locals (ใช้ได้ใน page)
  context.locals.user = await getUser(cookies.get('token')?.value);

  // redirect ถ้าไม่ได้ล็อกอิน
  if (url.pathname.startsWith('/admin') && !context.locals.user) {
    return context.redirect('/login');
  }

  return next();  // ให้ request ผ่านต่อ
});

ใช้ใน page:

---
// src/pages/admin.astro
const { user } = Astro.locals;
---
<p>สวัสดี {user.name}</p>

Middleware chain — เรียงลำดับด้วย sequence():

import { sequence } from 'astro:middleware';
import { auth } from './middleware/auth';
import { logger } from './middleware/logger';

export const onRequest = sequence(logger, auth);

ใช้ได้กับ Astro SSR mode เท่านั้น (output: ‘server’ หรือ ‘hybrid’) — static site ไม่มี runtime จึงไม่รองรับ