前面兩篇文章介紹了 Cloudflare Pages,了解通過(guò) wrangler 或控制臺(tái)部署項(xiàng)目,最近想給自己的公眾號(hào)文章生成一個(gè) RSS 接口,一方面需要數(shù)據(jù)庫(kù),另外一方面需要一個(gè)接口。
在 Cloudflare 產(chǎn)品中,數(shù)據(jù)庫(kù)可以選用 D1 數(shù)據(jù)庫(kù)。Cloudflare Pages 雖然主要生成HTML、CSS、JS,但內(nèi)置的 Functions 可以寫(xiě)一些接口,類似于 Node.js,在 Cloudflare Workers 中運(yùn)行。
開(kāi)干吧,本文全程通過(guò) wrangler 命令行操作。
在《手把手教你使用免費(fèi)Cloudflare Pages部署靜態(tài)網(wǎng)站》這篇文章中已經(jīng)使用 wrangler 部署了一個(gè)項(xiàng)目,其中核心的 wrangler.jsonc 文件如下:
{
"name": "my-blog",
"compatibility_date": "2026-01-13",
"pages_build_output_dir": "./dist"
}
大概的意思就是定義了項(xiàng)目的名稱,會(huì)對(duì)應(yīng)到自己的 Cloudflare Pages 項(xiàng)目中。
文本后續(xù)的操作會(huì)更新該文件內(nèi)容。
首先使用 wrangler 創(chuàng)建 D1 數(shù)據(jù)庫(kù):
npx wrangler@latest d1 create rss_feeds_d1
會(huì)交互式要求要求綁定名稱,代碼中會(huì)引用它,最終生成 wrangler.jsonc:
{
"d1_databases": [
{
"binding": "rss_feeds",
"database_name": "rss_feeds_d1",
"database_id": ""
}
],
"name": "my-blog",
"compatibility_date": "2026-01-13",
"pages_build_output_dir": "./dist"
}
其中 rss_feeds_d1 是數(shù)據(jù)庫(kù)名稱,rss_feeds 是綁定名稱,可以通過(guò) wrangler.jsonc 定義綁定名稱,也可以在控制臺(tái)中操作。
寫(xiě)一個(gè) SQL 文件,包括創(chuàng)建表、插入記錄,schema.sql 內(nèi)容如下:
DROP TABLE IF EXISTS rss_feeds_d1;
CREATE TABLE IF NOT EXISTS rss_feeds_d1 (
id INTEGER PRIMARY KEY AUTOINCREMENT,
title TEXT NOT NULL,
url TEXT UNIQUE NOT NULL,
description TEXT,
created_at DATETIME DEFAULT CURRENT_TIMESTAMP
);
INSERT INTO rss_feeds_d1 (title, url, description,created_at) VALUES ('test', 'https://me.ywdblog.com', 'hello world','2024-01-01 10:00:00');
然后在 rss_feeds_d1 數(shù)據(jù)中重建表、插入記錄:
npx wrangler d1 execute rss_feeds_d1 --local --file=./schema.sql
注意 --local 會(huì)在本地執(zhí)行生成表和記錄,先開(kāi)發(fā)測(cè)試。
日后命令行查詢數(shù)據(jù):
npx wrangler d1 execute rss_feed --local --command="SELECT * FROM rss_feeds_d1"
接下去就是寫(xiě) Function 代碼了,所有的代碼默認(rèn)要放到 function 目錄下,文件名就是接口名。
比如 function/rss.xml.js 對(duì)應(yīng)的接口就是 /rss.xml。
內(nèi)容如下:
export async function onRequest(context) {
const { env } = context;
const { results } = await env.rss_feeds
.prepare("SELECT * FROM rss_feeds_d1 ORDER BY created_at DESC Limit 10 ")
.all();
const itemsXml = results.map(item => `
<item>
<title><![CDATA[${item.title}]]></title>
<link>${item.url}</link>
<guid>${item.url}</guid>
<description><![CDATA[${item.description || ""}]]></description>
<pubDate>${new Date(item.created_at).toUTCString()}</pubDate>
</item>
`).join("");
const rssXml = `<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0">
<channel>
<title>虞大膽的嘰嘰喳喳</title>
<link>https://me.ywdblog.com</link>
<description>虞大膽的嘰嘰喳喳的 RSS</description>
<language>zh-cn</language>
${itemsXml}
</channel>
</rss>`;
return new Response(rssXml, {
headers: {
"Content-Type": "application/xml; charset=utf-8",
"Cache-Control": "max-age=300"
}
});
}
代碼非常簡(jiǎn)單哈,然后啟動(dòng)測(cè)試:
npx wrangler pages dev
測(cè)試沒(méi)問(wèn)題后,就在正式環(huán)境中生成D1數(shù)據(jù):
npx wrangler d1 execute rss_feeds_d1 --remote --file=./schema.sql
npx wrangler@latest d1 list
然后推送到 Cloudflare Page 上:
npx wrangler pages deploy
最后訪問(wèn) https://me.ywdblog.com/rss.xml 看看效果。
相關(guān)文章:

