在Cloudflare上部署实时热门新闻网站

前期准备

1. Cloudflare的账号：Cloudflare Dashboard | Manage Your Account（必须）
2. Github的账号：GitHub · Build and ship software on a single, collaborative platform · GitHub（必须）
3. 一个域名（必须）

创建Github项目

github的项目地址：项目直达

1. 点击Fork的按钮
2. 然后点击create Frok的按钮
3. 创建一个github的仓库。

Cloudflare部署

1. 登录Cloudflare的网站
2. 点击左侧计算Workers
3. 选择创建Pages项目
4. 在点击连接到Git的按钮
5. 然后登录一个GIthub的账号

然后选择刚才Fork的项目

输入如下命令进行项目部署：

• Build 命令：pnpm run build
• 输出目录：dist/output/public

自定义域名

部署完成之后，需要自定义域名才能访问，通过部署的地址是无法访问的。

输入自定义域名，因为我这是免费的域名需要，在添加一下CNAME的记录。

在自己域名下添加一下，域名解析记录。

等待一会，就能正常访问了。

GIthub登录授权设置

生成授权ID和密钥

我个人觉着这没有什么必要

1. 返回githu网站
2. 点击用户头像 —>settings —>Developer Settings
3. 在左侧选项中选择OAuth apps，点击New OAuth APP的按钮
4. 输入自定义程序名称，Homepage URL填写自己刚才设置的自定义域名
5. Authorization callback URL输入框，输入https://your-domain.com/api/oauth/github
6. 最后，点击注册的按钮

1. 记录一下client ID值
2. 点击 ”Generate a new client secret“生成密钥

Cloudflare的环境变量

输入如下配置参数

# Github Client ID
G_CLIENT_ID=Ov23likwhug4iuzrn8ie
# Github Client Secret
G_CLIENT_SECRET=d4088892acf7a1a24a3c343ff91ebe85ba24c493
# JWT Secret, usually the same as Client Secret
JWT_SECRET=d4088892acf7a1a24a3c343ff91ebe85ba24c493
# Initialize database, must be set to true on first run, can be turned off afterward
INIT_TABLE=true
# Whether to enable cache
ENABLE_CACHE=true

创建D1数据库并绑定

创建D1数据库，名称自定义。

数据库变量名称输入NEWSNOW_DB值，然后选择刚才创建的D1数据库。

重新部署

绑定之后，重新部署一下项目

这时出现github账号登录的按钮了。