Sukka 写前端、网络和基础设施时，习惯先把边界和代价摊开。把「Bilibili 2020「1024 程序员节」CTF Write Up | Sukka's Blog」整理成可落地的中文笔记：问题在哪、默认做法会踩什么坑、该怎么选。原站导航和广告已去掉。

页面的背后是什么 & 真正的秘密只有特殊的设备才能看到

10 月 24 日不睡觉、凌晨两点钟我还在水群，结果在 USTC@LUG 的群里看见有人在打 Bilibili 的 CTF。我刚刚好一年（指 370 天）没有打过 CTF 了（上一次打正式的 CTF 还是去年参加的 USTC Hackergame 2019 ），所以想着来玩玩。虽然 CTF 结束之前不应该分享和公开 Write Up 和题解，不过 Bilibili 这 CTF 既然这么离谱，那我也没必要按照常理出牌。

由于这次 Bilibili 的 CTF 题实在没有什么存档研究的必要，我的 Write Up 里就留一些代码片段和截图，大家也没有复盘的必要。

密码是啥？

curl 太慢了而且没有代码高亮、直接在地址栏通过 view-source: 看看源码，把 JavaScript 拿出来：

$ . ajax ( { url : "api/admin" , type : "get" , success : function ( data ) { //console.log(data); if ( data . code == 200 ) { // 如果有值：前端跳转 var input = document . getElementById ( "flag1" ) ; input . value = String ( data . data ) ; } else { // 如果没值 $ ( '#flag1' ) . html ( "接口异常，请稍后再试～" ) ; } } } ) 所以第一题的 Flag 就是 GET /api/admin 了。在页面上 #flag1 元素是被包裹在一个 display: none 的容器里的，不过审查元素或者直接请求访问 API 都能拿到第一题的 Flag。

对不起，权限不足～

$ . ajax ( { url : "api/ctf/2" , type : "get" , success : function ( data ) { //console.log(data); if ( data . code == 200 ) { // 如果有值：前端跳转 $ ( '#flag2' ) . html ( "flag2: " + data . data ) ; } else { // 如果没值 $ ( '#flag2' ) . html ( "需要使用bilibili Security Browser浏览器访问～" ) ; } } } ) 第二题要求用「bilibili Security Browser」访问，有没有让你想起来前年 USTC Hackergame 2018 的「黑曜石浏览器」？

直接用 bilibili Security Browser 作为 User-Agent 请求 API 即可获得 Flag，注意别忘了带上 Session 这个 Cookie，这个是 Bilibili 账户登录状态。

别人的秘密

Chromium Based 浏览器本身内置了修改了 User-Agent 的功能。打开 DevTools 的设置菜单、在「Devices」里添加一个新的设备，此处可以指定 User-Agent：

$ . ajax ( { url : "api/ctf/4" , type : "get" , success : function ( data ) { console . log ( data ) ; if ( data . code == 200 ) { // 如果有值：前端跳转 $ ( '#flag' ) . html ( "欢迎超级管理员登陆～答案是 : {{ " + data . data + " }}" . toLowerCase ( ) ) } else { // 如果没值 $ ( '#flag' ) . html ( "有些秘密只有超级管理员才能看见哦~" ) } } } ) 又是 API 返回 flag，用手指头想都知道鉴权是 Cookie 做的，打开 F12 查看 Cookie：

结束亦是开始

两个 Cookie，一个是 session ，是 Bilibili 账户登录状态的 cookie；另一个是 role ，毫无疑问就是我们下手的对象：

role=ee11cbb19052e40b07aac0ca060c23ee 打 CTF 的人应该早就把这一串刻进 DNA 里了。即使不知道这串字符是什么东西，丢进搜索引擎后也会知道这是 user 的 MD5。接下来思路就很清晰了，通过将 role 的 Cookie 改成另一串 MD5 即可。

第八题

不过这就是这道题离谱的地方了，这道题要把 role 改成 Administrator 的 MD5（你没有看错，首字母是大写的）：

role=7b7bc2512ee1fedcd76bdc68926d4f7b 改好 Cookie 刷新页面就可以拿到 flag 了。

落地时建议先做的 5 件事

1. 用自己的流量和设备测，不要只抄厂商推荐最小配置。
2. DNS、CDN、代理分流先画清 Fake IP 和 Real IP 的边界。
3. 前端性能看 CLS、白屏和重复渲染，而不是只看打包体积。
4. 基础设施变更走 Git，能复现、能回滚。
5. 结论写成可检查的清单：接口、超时、失败样本、回滚版本。

和智能体产品怎么接

龙虾PRO做 OpenClaw 落地时，网络、DNS 和前端性能笔记最有用的是「边界」：哪一层该加速、哪一层不该假装智能。数字员工调用外部能力前，先把超时和失败路径写死。

本文侧重全链路风控方法论。落地时请用自身业务单据做回放验证，不要把示例阈值直接当生产策略。 相关：风控体检 · 方案资源