前一講我們簡單聊過 SEO，包含網址層級、提升效能、速度等策略，這一講則針對其中兩個必選題：Sitemap 及 robots.txt 來開始整合我們的 Astro 專案。

網站地圖 Sitemap

所謂網站地圖（Sitemap）就是列出網站中頁面、影片、檔案等資訊，及他們之間關聯的檔案，目的主要是為了讓搜尋引擎能夠夠容易的爬取網站中的頁面和資訊。

雖然說搜尋引擎能夠根據你頁面中的連結和按鈕依序爬取資訊，但是有提供 Sitemap 的話，能夠讓搜尋引擎更有效率的為你的網站 Indexing。

一個網站的 Sitemap 可分成兩個部分

• Sitemap Index，一份網站地圖的目錄，根節點為 <sitemapindex>
• URL Sitemap，一份 URL 的清單，根節點為 <urlset>

Sitemap Index 的範例如下，內容由多個 <sitemap> 組成，裡面包含 <loc> 和 <lastmod> 等資訊，其中 <loc> 就表示 URL Sitemap 的連結。

<sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <sitemap>
    <loc>https://my.website/sitemap-0.xml</loc>
    <lastmod>2025-09-01T00:00:00.000Z</lastmod>
  </sitemap>
</sitemapindex>

至於 URL Sitemap 的根目錄 <urlset> 底下則包含多個 <url>，也就是多個頁面的連結；每個 URL 下面則包含 <loc> 指向頁面位置、<lastmod> 代表最後修改時間（Last Modified）。

<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://my.website/</loc>
    <lastmod>2025-09-01T00:00:00.000Z</lastmod>
    <changefreq>daily</changefreq>
    <priority>1.0</priority>
  </url>
  <url>
  <loc>https://my.website/about/</loc>
    <lastmod>2025-09-01T00:00:00.000Z</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
</urlset>

<lastmod> 的欄位是 Google 重點建議的，用來反映內容的重要更新時間，能幫助 Google 優先重新抓取這些有更新的頁面，至於 <changefreq> 和 <priority> 反倒是在 2023 年的公告中說明會忽略這兩個資訊。

Astro 整合 Sitemap

有了基本的認識之後，我們來看看在 Astro 裡面要怎麼簡單的產生一個 Sitemap？

首先是透過安裝 Astro Sitemap 的 Plugin，執行 npm install @astrojs/sitemap。

接著在 astro.config.ts 裡面修改以下內容，加上 site: "https://my.website"（填入我們屆時上線的網址）

import { defineConfig } from "astro/config";
import sitemap from "@astrojs/sitemap";

export default defineConfig({
  site: "https://my.website", // Required
  integrations: [sitemap()],
});

這是最基本的設定，稍微進階一些的設定可以在 sitemap() 中傳入 { ... }，較為常用的包含

1. Filter，過濾頁面，例如隱藏某些不要的頁面 { filter: (page) => page !== "https://my.website/secret-page" }
2. Custom Pages，自訂不是由 Astro 產出的頁面，例如後端生成的（雖然在我們的情境中不太會出現）
3. i18n，如果有多語系的話才需要額外設定，會對齊我們語系的路由

都設定完畢之後，最後透過 npm run build 再來 npm run preview，就能夠在測試環境中查看 http://localhost:4321/sitemap-index.xml 及 http://localhost:4321/sitemap-0.xml，來瀏覽目前的 Sitemap（裡面的主要 Domain 會根據我們設定 site: "https://my.website" 來顯示）。

robots.txt

上一講提過 robots.txt 的目的是在於讓爬蟲知道哪些能爬、哪些不能爬，我們先來看看其主要的資訊有哪些：

1. User-agent，指定給什麼爬蟲，例如 User-agent: Google-Image（只給 Google 抓圖片的爬蟲），但我們預設給所有爬蟲其實就好，用 User-agent: *
2. Disallow，哪些頁面不能爬，例如 Disallow: /admin/ 則表示 /admin/ 路徑下的所有頁面都不會爬。但這畢竟只是一份文件中的設定，只能防君子不防小人，大型搜尋引擎的爬蟲基本上會遵守，但只要我們的頁面是公開的，就無法避免被人或是其他爬蟲讀取
3. Allow，可和 Disallow 一起使用，例如我們不讓爬蟲在 /admin/ 路徑下抓取資料，但是加上 /admin/help.html，就能告知爬蟲特別讀取此頁面
4. Sitemap，上個段落提到的 Sitemap 就可以放在 robots.txt 中了，讓爬蟲更快找到頁面

最後來看看在 Astro 中要怎麼設定 robots.txt，最簡單的方式就是在 public/ 目錄下新增 public/robots.txt。

User-agent: *
Allow: /

Sitemap: https://my.website/sitemap-index.xml

但這僅僅是一份純文件，如果想和我們在 Sitemap 中的設定同步，可以在 src/pages 下新增 src/pages/robots.txt.ts：

import type { APIRoute } from 'astro';

const getRobotsTxt = (sitemapURL: URL) => `\
User-agent: *
Allow: /

Sitemap: ${sitemapURL.href}
`;

export const GET: APIRoute = ({ site }) => {
  const sitemapURL = new URL('sitemap-index.xml', site);
  return new Response(getRobotsTxt(sitemapURL));
};

執行 npm run dev 後就能在 http://localhost:4321/robots.txt 看到結果了。

參考資料

1. Astro - @astrojs/sitemap
2. Google Search Central - Learn about sitemaps
3. Google Search Central - Build and Submit a Sitemap
4. Google Search Central - Sitemaps ping endpoint is going away / changefreq and priority