Encodera

Спасибо, что читаете!

Пожертвуйте сайту, мы стараемся ради вас.

Оглавление

RSS-лента

RSS-лента — файл XML со списком последних статей. Читатели добавляют его адрес в программу для чтения лент и узнают о новых публикациях без визита на сайт. В Astro ленту делает пакет @astrojs/rss: вы передаёте ему статьи, а он формирует правильный XML.

Установка

npm install @astrojs/rss

Это обычный пакет, а не интеграция, поэтому настройки менять не нужно. Ленте нужен site в astro.config.mjs — его задали в уроке о SEO.

Файл ленты

Лента — эндпоинт, который возвращает XML. Создайте src/pages/rss.xml.js:

// src/pages/rss.xml.js
import rss from '@astrojs/rss';
import { getCollection } from 'astro:content';
 
export async function GET(context) {
  const posts = await getCollection('blog', ({ data }) => !data.draft);
 
  return rss({
    title: 'Блог Анны',
    description: 'Статьи о веб-разработке',
    site: context.site,
    items: posts.map((post) => ({
      title: post.data.title,
      description: post.data.description,
      pubDate: post.data.pubDate,
      link: `/posts/${post.id}/`,
    })),
  });
}

Откройте http://localhost:4321/rss.xml — браузер покажет XML с элементом <item> для каждой статьи. Функция rss() сама превратит относительные ссылки в полные, используя context.site.

Поля статьи в ленте

ПолеЧто в нём
titleЗаголовок статьи
descriptionКраткое описание
pubDateДата публикации, объект Date
linkАдрес статьи на сайте
contentНеобязательно: полный текст статьи в HTML

Поля совпадают с полями схемы коллекции, поэтому ничего не приходится вычислять — только переложить.

Ссылка на ленту

Чтобы браузеры и программы для чтения находили ленту сами, добавьте в <head> макета src/layouts/BaseLayout.astro:

<link
  rel="alternate"
  type="application/rss+xml"
  title="Блог Анны"
  href={new URL('rss.xml', Astro.site)}
/>

Видимую ссылку «RSS» можно поставить в подвал: <a href="/rss.xml">RSS</a>. Она подойдёт для слота sidebar из урока о макетах.

Частая ошибка

Называют файл src/pages/rss.astro. Тогда Astro ждёт разметку страницы, а не функцию GET, и лента не появится. Файл ленты должен быть эндпоинтом: расширение .js или .ts, а в имени — итоговое расширение адреса, rss.xml.js.

Спасибо, что читаете!

Пожертвуйте сайту, мы стараемся ради вас.