狸村 Mystic Web · 狸村
目录

互动组件

本页同时打开了三个组件:评论区、葡萄捐赠、用户协议。它们都需要配套后端 (kalin-web-workers),前端通过构建时注入的 API_BASE 找到它。

页面里是怎么打开的

指令写成 HTML 注释,放在文件的任意位置都生效(大小写不敏感),构建时会被删掉。 下面代码块里看到的是语法说明,本页真正生效的是文件开头那三行:

<!-- comments -->   显示评论区
<!-- grape -->      显示葡萄捐赠
<!-- consent -->    互动前需要先签署用户协议

构建时要注入后端地址

API_BASE=https://your-worker.example.com node prebuild.js

没注入的话,组件会退回到同源相对路径 /api/...,并在构建日志里给出提示。

还需要后端配合

环节 配置位置
前端指向后端 构建时注入 API_BASE
后端放行前端 Worker 的 ALLOWED_ORIGINS
评论白名单 config/comment-allowed-pages.json,由后端按页面 URL 读取

注意:白名单里目前只有 /,所以本页即使打开了评论区,后端仍可能拒绝。 想在测试页上真正发评论,得先把 /test/03_互动组件.html 这类路径加进白名单。