NGU3rd Score Edit

本项目和 NGU3rd Score Final 搭配使用，本项目为后台页面，用于对于NGU分数数据库的增删改查，目的是在直播中当分数牌使用。

本项目包括

• index.html：目前主要的html文件，目前本项目仅为一个能工作的demo，正式的ui将会在后日修改。
• worker.js：Cloudflare Worker 脚本，为后端，处理前端请求并将请求反映在前台的前端和数据库中
• readme.md：这份文档

使用方式

说明

本项目全部围绕 Cloudflare 的产品使用 Serverless 方式进行构建。

• 前端：Cloudflare Pages
• 后端：Cloudflare Worker
• 数据库托管（SQLite）：Cloudflare D1

数据库（Cloudflare D1）

1. 在账户内创建一个数据库：命名为ngu3rd_score
2. 在控制台初始化表 CREATE TABLE rounds ( round INTEGER PRIMARY KEY, is_current BOOLEAN, team1 INTEGER, team2 INTEGER, song1 TEXT, song1_is_dx BOOLEAN, song2 TEXT, song2_is_dx BOOLEAN, song3 TEXT, song3_is_dx BOOLEAN, song4 TEXT, song4_is_dx BOOLEAN, team1_perc1 REAL, team2_perc1 REAL, team1_perc2 REAL, team2_perc2 REAL, team1_perc3 REAL, team2_perc3 REAL, team1_perc4 REAL, team2_perc4 REAL, team1_score1 INTEGER, team2_score1 INTEGER, team1_score2 INTEGER, team2_score2 INTEGER, team1_score3 INTEGER, team2_score3 INTEGER, team1_score4 INTEGER, team2_score4 INTEGER, is_team1_win INTEGER ); CREATE TABLE team ( id INTEGER PRIMARY KEY, name TEXT );

注意事项：创建数据库时名称请务必使用下划线(_)而不要使用连字符(-)。

前端部署（Cloudflare Pages）

具体的Pages部署和绑定域名在此不做叙述。 在本文档中，后台的前端域名将会使用https://score-edit-ngu3rd.mpam-lab.xyz/，前台的前端域名将会使用https://score-final-ngu3rd.mpam-lab.xyz/

后端部署（Cloudflare Worker）

1. 创建一个worker，worker内代码使用本repo内的 worker.js
2. 在设置->变量和机密 新建一个类型为纯文本的全局变量，名称为API_KEY，值请使用自己生成的内容，我使用的是UUID生成器。
3. 设置->绑定处绑定已经创建的D1数据库，名称为ngu3rd_score（注意事项：绑定使用的名称请务必使用下划线(_)而不要使用连字符(-)。）
4. 设置->域和路由处添加两个api地址进行路由，添加->路由，区域写自己的域名（在本项目中使用 mpam-lab.xyz），路由在本项目中为https://score-final-ngu3rd.mpam-lab.xyz/api/* 和 https://score-edit-ngu3rd.mpam-lab.xyz/api/*失败模式使用失败时自动关闭（阻止）