📁 文件路由

Astro 使用基于文件的路由系统，pages 目录下的文件自动映射为路由：

文件路径URL
src/pages/index.astro/
src/pages/about.astro/about
src/pages/blog/index.astro/blog
src/pages/blog/[slug].astro/blog/:slug

🔀 动态路由

参数路由

astro (src/pages/blog/[slug].astro)
---
const { slug } = Astro.params;
const post = await getPost(slug);
---

<h1>{post.title}</h1>
<p>{post.content}</p>

静态路径生成

astro
---
export async function getStaticPaths() {
  const posts = await getAllPosts();
  return posts.map(post => ({
    params: { slug: post.slug },
    props: { post },
  }));
}

const { post } = Astro.props;
---

<h1>{post.title}</h1>

Rest 参数

astro (src/pages/[...path].astro)
---
const { path } = Astro.params;
// 匹配 /a/b/c 等
---

🔌 API 路由

typescript (src/pages/api/hello.ts)
export async function GET() {
  return new Response(JSON.stringify({ message: 'Hello' }), {
    headers: { 'Content-Type': 'application/json' },
  });
}

export async function POST({ request }) {
  const body = await request.json();
  return new Response(JSON.stringify(body));
}

🔀 重定向

astro
---
return Astro.redirect('/new-page');
---