Day19 - Astro Series: RSS Endpoint

Astro 系列文第十九日：RSS 端点

@ Astro

一個漂亮的漸層背景上面有一句標題：「RSS 端點」

前言

前面章节我们学会了如何使用 Markdown 或 MDX，以及在内容集合中定义数据格式与获取数据。本章节将解释如何在 Astro 中创建端点来提供不同类型的数据，并通过实现生成一个 RSS 文件作为练习。

端点

什么是端点（EndPoint）？在静态模式的网站中，端点就是一个会生成各种类型文件的 .ts 或 .js 文件；而在 SSR 模式下，端点则会成为实时的服务器 API。

什么是 RSS

RSS 是一种标准化的方式，本质上是一种特定格式的 XML 文件，用来向网站用户推送最新信息。用户如果想知道网站是否有更新，通常需要手动访问网站，这会比较麻烦；因此使用 RSS 有选择性地推送网站内容给用户，是一种很方便的功能。

简单来说，你需要在网站根目录提供一个 RSS 的 XML 文件，里面存放你想发送的数据，用户就可以通过这个文件来追踪网站的最新动态。而这个目标正好可以通过创建端点与 RSS 插件来实现。

静态文件端点（生成一个 JSON 文件）

第一步：创建端点

在 /pages 目录中添加 .js 或 .ts 文件。文件扩展名会在构建过程中被移除，因此需要在文件名中包含你希望生成的静态文件扩展名。例如：src/pages/data.json.ts 会生成 src/pages/data.json。

第二步：导出 GET 函数

这样，在 /foobar.json 路径下就会生成一个内容为：{"message":"Hello World"} 的 JSON 文件。使用端点来创建文件就是这么简单。

foobar.json.ts
export async function GET() {
  return new Response(
    JSON.stringify({
      message: 'Hello World',
    }),
  );
}

制作 RSS

第一步：安装与配置 RSS 集成

Astro 提供了自动生成 RSS 文件的集成工具。首先需要安装：@astrojs/rss，并在 astro.config 文件中设置 Site🔗 参数（Astro RSS 会用这个参数来生成内容）。

Terminal window
npm install @astrojs/rss

第二步：创建端点

与前面的示例相同，在 /pages 目录中添加 .js 或 .ts 文件。这次我们希望生成 XML 格式的文件，因此文件名为：rss.xml.ts。在该文件中借助 @astrojs/rss 集成，并结合从内容集合中获取的数据，就可以快速自动生成整个网站的 RSS XML 文件：

import rss from '@astrojs/rss';
import { getCollection } from 'astro:content';


export const GET = async (context) => {
  const posts = await getCollection('post');
  const avaliablePosts = posts.filter((post) => !post.data.isDraft);


  const rssContent = await rss({
    title: '自定义标题',
    description: '自定义说明',
    site: context.site,
    items: avaliablePosts.map((post) => ({
      title: post.data.titleTC,
      description: post.data.excerpt,
      pubDate: post.data.publishDate,
      link: `post/${post.slug}`,
    })),
  });


  return new Response(rssContent.body);
};

总结

如果你的网站更新不频繁，或者用户并不怎么使用 RSS，那么就没有制作 RSS 的必要。不过这仍然是一个很好的练习，值得尝试。下一章节我们会通过创建端点实现更多实际功能，敬请期待！

最后建议亲自动手实践，如果过程中遇到问题，可以参考我的示例🔗：

  • 尝试创建一个静态端点
  • 尝试构建自己网站的 RSS Feed

延伸阅读