- 安装 wrangler-cli
npm i @cloudflare/wrangler -g
根据文档登录 cloudflare 账号:
wrangler login
执行上面的命令后,会在浏览器打开一个页面,跳转到 cloudflare 的登录页面,然后点击授权登录,然后会跳转到一个页面,然后在终端输入 wrangler whoami
,如果显示你的用户名,说明登录成功了。
- 安装依赖
# 安装后端依赖
yarn install
# 安装前端依赖
cd static
yarn install
- 在 cloudflare 里创建 kv namespace
我们这里创建了一个 kv,用来存储文字,取名为 PB
,其实名字无所谓,重点是要记住 id,后面会用到;再创建一个 r2,用来存储文件,取名为 pastes
,
- 修改 wrangler.toml
name= "pastebin-worker"
compatibility_date = "2023-11-28"
account_id= "<account_id>" # 这里改成你自己的 account_id
main = "src/index.ts"
workers_dev = false
vars = { ENVIRONMENT = "production" }
route = { pattern = "<your domain>", custom_domain = true }
kv_namespaces = [
{ binding = "PB", id = "<PB kv id>" },
]
[site]
bucket = "./static/dist"
[[r2_buckets]]
binding = 'BUCKET'
bucket_name = 'pastes'
其中 account_id
,route
, kv_namespaces
需要根据自己的情况修改,我们这里用到了两个 kv,一个存储文件,一个存储文字。如果不需要自定义域名,注释掉 route
这行即可。
account_id
可以在 cloudflare 的 dashboard 中找到, route
是你的 worker 的路由(也就是自定义域名),kv_namespaces
是你创建的 kv 的 id
- 开发
# 启动后端
wrangler dev
# 启动前端
cd static
yarn dev
服务器启动后,后端的地址是 http://localhost:8787
,前端的地址是 http://localhost:5173
,如果想测试前端打包后的情况,直接在 static 目录执行 yarn build
,然后访问 http://localhost:8787
就可以了
获取你的 cloudflare 账号的 api key,然后设置为 github aciton 的 secret,名字为CF_API_TOKEN
,这样每次 push 代码到 main 分支,就会自动部署到 cloudflare
然后点击 Create Token
:
选择 worker 的模版创建成功即可获取 api token
在这里设置你的 api token,而后每次 push 代码到 main 分支,就会自动部署到 cloudflare
点击上面的 Deploy with Workers
按钮,然后根据提示操作即可。