docs(learn): web and reverse (#4)

Author: Cnily03

docs/guide/2024/index.md

@@ -10,30 +10,30 @@ aside: false
 
 ## 赛事介绍
 
-NewStar CTF 2024 是由 13 所高效联合发起的新生入门赛事，比赛持续五周时间，每周更新赛题，以个人赛形式展现，并分设公开赛道和校内赛道。
+NewStar CTF 2024 是由 13 所高校联合发起的新生入门赛事，比赛持续五周时间，每周更新赛题，以个人赛形式展现，并分设公开赛道和校内赛道。
 
 在此之前，NewStar 网络安全新生赛已连续举办多届，并一直为各高校提供高质量的新生选拔方案。本届赛事联手春秋杯，以新生的探索能力、知识面、网络安全素养等综合素质为培养目标，致力于挖掘和培养适应新时代新趋势的网络安全新兴力量。本届比赛将取过往之精华，优化比赛难度，使之随时间呈阶梯式上升，并通过题目逐步引导等方式，避免选手大海捞针的情况，以使其能够更专注于知识和技能水平的锻炼。
 
-比赛采用网络安全靶场赛的形式<span style="color: #7c7c7c">（传统 Jeopardy 解题模式）</span>。赛题涵盖 Web、Crypto、Pwn、Reverse、Misc 五大方向，题目的考察范围亦在传统的基础上增加了一些近年来新的构想和思路，做到与时俱进、不断创新。比赛期待各位选手的光临，诚邀任何有兴趣的同学参与。
+比赛采用网络安全靶场赛的形式<span style="color: #7c7c7c">（传统 Jeopardy 解题模式）</span>，动态计分。赛题涵盖 Web、Crypto、Pwn、Reverse、Misc 五大方向，题目的考察范围亦在传统的基础上增加了一些近年来新的构想和思路，做到与时俱进、不断创新。比赛期待各位选手的光临，诚邀任何有兴趣的同学参与。
 
 ## 赛事时间
 
 公开赛道：2024 年 9 月 30 日 09:00 - 2024 年 11 月 3 日 21:00
 
 校内赛道：2024 年 9 月 23 日 09:00 - 2024 年 10 月 27 日 21:00
 
+## 赛事群
+
+公开赛道 QQ 群：1169651901<span style="color: #7c7c7c">（①群）</span>、806733185<span style="color: #7c7c7c">（②群）</span>
+
+校内赛道 QQ 群：<span style="color: #7c7c7c">（请联系各校赛事负责人）</span>
+
 ## 组织方式
 
-### 发起方
+### 发起方（战队）
 
 西安工业大学、中国矿业大学、中国人民公安大学、东北大学秦皇岛分校、海南大学、南京理工大学、广东工业大学、江南大学、浙江师范大学、福建师范大学、中山大学、太原理工大学、中国人民警察大学<span style="color: #7c7c7c">（以上排名不分先后）</span>
 
 ### 赞助支持
 
 i 春秋、京东安全
-
-## 赛事群
-
-公开赛道 QQ 群：1169651901<span style="color: #7c7c7c">（①群）</span>；806733185<span style="color: #7c7c7c">（②群）</span>
-
-校内赛道 QQ 群：<span style="color: #7c7c7c">（请联系各校赛事负责人）</span>

docs/guide/index.md

@@ -1,11 +1,11 @@
 ---
 layout: home
-title: 赛事信息
+title: 参考文档
 titleTemplate: ':title - NewStar CTF'
 
 hero:
   name: NewStar CTF
-  text: 赛事信息
+  text: 参考文档
   tagline: 赛事信息 赛题指导和建议 降低学习门槛
 
 features:

docs/learn/index.md

@@ -2,7 +2,59 @@
 title: 快速入门
 titleTemplate: ':title - NewStar CTF'
 ---
+<script setup>
+import Container from '@/components/docs/Container.vue'
+import Link from '@/components/docs/Link.vue'
+import { ElTag } from 'element-plus'
+import 'element-plus/es/components/tag/style/css'
+</script>
 
 # 快速入门
 
 如果你曾经从未接触过 CTF，或者对该赛事还不是很熟悉，这份文档可能会帮助到你。
+
+## 什么是 CTF
+
+CTF 是一种比赛形式，你会得到一个题面<span style="color: #7c7c7c">（可能是一段话、一个压缩包、一张图片、一个网站、一个链接、一份源码、一个程序等）</span>，你需要根据题面，通过各种手法找到或得到诸如 `flag{xxx}` 的内容，这便是此题的答案。
+
+## 走出洞穴的第一步
+
+如果你此前从未接触过 CTF，你可能需要先了解其形式，即通过一些在线靶场或新生赛的低门槛题目进行适应。下面的一些公益新生赛事或平台或许会对你有所帮助：
+
+- <ElTag type="primary" size="small">赛事</ElTag> <Link icon="external" theme="plain" href="https://ctf.xidian.edu.cn/">西电 MoeCTF</Link>
+- <ElTag type="primary" size="small">赛事</ElTag> <Link icon="external" theme="plain" href="https://basectf.fun/">BaseCTF</Link>
+- <ElTag type="info" size="small">平台</ElTag> <Link icon="external" theme="plain" href="https://www.ctfhub.com/">CTFHub</Link>
+- <ElTag type="info" size="small">平台</ElTag> <Link icon="external" theme="plain" href="https://ctf.show/">CTFSHOW</Link>
+- <ElTag type="info" size="small">平台</ElTag> <Link icon="external" theme="plain" href="https://buuoj.cn">BUUOJ</Link>
+- <ElTag type="info" size="small">平台</ElTag> <Link icon="external" theme="plain" href="https://www.nssctf.cn">NSSCTF</Link>
+
+随后，你应当选定一个方向，作为你主攻方向。例如，对网络感兴趣、有基础的同学可能更适合 Web 方向，而对程序运行底层逻辑、二进制感兴趣的可能更适合逆向（Reverse）和 Pwn，等等。
+
+然后，当你接触到特定的题目时，你会遇到特定的知识点。设计得当的引导会控制好你所接触的「新事物」的量。这个时候，辅以实践，你再通过搜索、询问等各种方式学习知识细节，或许会轻松许多。
+
+对于自己无能为力的题，记得在赛后根据题解（WriteUp）进行复现。温故而知新，可以为师矣。
+
+## 我还没有准备好
+
+<Container type='warning'>
+参与 CTF 赛事，是一个不断在历练中成长的过程，是对自我螺旋上升式的提升，是理论与实践相结合的又一深入尝试。请时刻铭记：<strong>充分发挥自己的主观能动性，在实践中成长。</strong>
+</Container>
+
+搜索引擎是你生涯中最重要的伙伴之一，请珍爱并善于使用它。如何高效使用搜索引擎是对信息搜集和快速查找知识的考察，你需要通过大量实践和碰壁以养成该能力。推荐的搜索引擎有：
+
+- 必应（Bing）国际版
+- Google 搜索
+- DuckDuckGo
+- 带有联网或搜索功能的 AI（Bing Copilot、SearchGPT）
+
+此外，BiliBili 也是不错的选择。
+
+常见的搜索技巧有：
+
+- 搜索时采用关键词搜素，以便能最大限度匹配到需要的内容
+- 中文无法搜素到资源时考虑使用英文关键词
+- 借用 AI 得知具体的搜索方向和关键词
+
+此外，必备的知识迁移能力和动手尝试（试错）能力是不可或缺的。
+
+在这趟旅途中，请收藏对你帮助巨大或需要日后查阅的链接或文档。值得一提的是，偶尔的旅途记录或许将在某些时刻发挥意想不到的作用。

docs/learn/reverse.md

@@ -0,0 +1,45 @@
+---
+titleTemplate: ':title | 快速入门 - NewStar CTF'
+---
+<script setup>
+import Link from '@/components/docs/Link.vue'
+</script>
+
+# Reverse
+
+逆向工程通常是在没有源代码的情况下对软件进行分析，相对于正向的代码编程来说，逻辑通常是反过来的，需要有好的代码分析和反向思维能力。
+
+## 0x01. 学习 C 语言代码
+
+C 语言是逆向工程的基础，务必重点学习以下内容。
+
+1. 流程控制: if、switch、goto、break
+2. 指针操作: 引用，解引用，取地址，数组与指针转化
+3. 数据类型: 熟记 char、int、int64 等类型大小
+4. 可逆运算: 异或运算、算数运算、移位与循环移位运算
+
+## 0x02. 学习常见加密
+
+加密是逆向工程对抗的核心,务必熟记加密算法原理和特征,这样在面对混淆和魔改加密时才能游刃有余。
+
+1. TEA 系列加密: TEA、XTEA、XXTEA
+2. RC4 加密
+3. AES/DES加密
+4. 16进制编码
+5. Base64编码
+
+加密特征识别可参阅：<Link icon="external" theme="underline blink" href="https://pangbai.work/IT/re/ctf_encode/">常见加密算法特征识别</Link>
+
+常见加密不是一成不变的模板，死记硬背不可能通杀，请务必读懂加密过程和大致原理。
+
+## 0x03. 脚本代码编写
+
+脚本编写是一项很重要的能力，你需要熟悉 C 语言和 Python，并且减少代码出错的可能性。平时的解题脚本一定要收集好，并找时间整理，比赛争分夺秒，好的解题模板可以帮你快速夺得一血。
+
+## 0x04. 逆向工具的使用
+
+1. IDA: 二进制方向工具，90%的题都会用到，务必熟悉使用
+2. Jadx-gui: Java 代码反编译工具，安卓软件和 Java 程序都会用到。
+3. Jeb: 面相安卓逆向的利器，有 Java 代码反混淆功能
+4. Pyinstxtractor: 解包 Python 编写的 exe 文件
+5. Uncompyle6: 反编译 Python 大部分版本字节码（pyc 文件）

docs/learn/web.md

@@ -0,0 +1,61 @@
+---
+titleTemplate: ':title | 快速入门 - NewStar CTF'
+---
+
+# Web
+
+CTF 中的 Web 方向通常指的是通过阅读阅读网站源码，或是根据网站已给信息，实现对网站的漏洞利用。
+
+例如，通过输入框输入一些精心设计的内容，可以获取到网站的数据或者服务器权限。
+
+这是由于网站是由前端和后端构成的。前端指的是你看到的、能接触到的内容，而后端则是服务器对你发起的网络请求进行一定的处理等操作。通过构造一些请求从而达到“欺骗”后端的目的，实现对后端服务器的部分控制。
+
+常见的 Web 题型有 SQL 注入、模板注入（SSTI）、PHP 漏洞利用等。
+
+## 收拾行李
+
+Web 方向需要有较强的代码阅读能力<span style="color: #7c7c7c">（即便是未接触过的代码，不要求会写，但需能够阅读）</span>，以及搜索能力。
+以下建议可能能够帮助你提升代码阅读能力，但任何事物都是循序渐进的，你也可以在做题的同时学习和成长。
+
+- 学习和掌握 Python 语言
+- 在做题中遇到难以读懂的代码时询问搜索引擎或 AI
+
+下面是一些你需要了解的概念或过程，若你此前并不了解，请自行通过搜索引擎或视频网站学习：
+
+- IP 地址、端口、域名
+- 通过网址访问网页的通信过程
+- Linux 操作系统和其基本使用
+- 终端、命令提示符
+- Web 服务器，常见的 Web 服务器
+- 常见的编程语言，用于 Web 服务器编程的常见编程语言
+- HTTP 报文格式
+- 浏览器 Cookie
+- 正则表达式
+
+此外，你还需要了解开源和熟悉 Github，并最好具备访问全球互联网的能力。
+
+## 注意事项
+
+Web 安全技术威胁性大，请勿用于攻击和测试境内的目标，未授权的攻击测试行为将承担巨大的法律责任。若您决心踏上这一旅途，请立志成为一名将技术服务于社会和人民的安全从业人员（白帽子）。
+
+## 出发远航
+
+下面将列举一些常见的考点，以便你在入门的旅途中找到搜索的方向。一些词汇你可能感到陌生，你也并不需要立即掌握它们，但需要你遇到时能学习并铭记在心，这将非常考察你的知识接受能力和自学能力。这里将不会列举相对进阶的知识点。
+
+- PHP 考点
+  - 弱类型比较
+  - PHP 伪协议
+  - PHP 反序列化
+  - PHP 版本引发的
+- MySQL 数据库考点
+  - 联合注入
+  - 报错注入
+  - 布尔注入
+  - 延时盲注（时间盲注）
+- 模板注入（SSTI）
+
+常见的利用方式（思路）有：
+
+- 任意文件读/写
+- 远程代码执行（RCE）
+- 服务端请求伪造（SSRF）

theme-config.yml

@@ -4,7 +4,7 @@ nav:
     link: /
   - text: 快速入门
     link: /learn/
-  - text: 赛事信息
+  - text: 参考文档
     link: /guide/
     activeMatch: /guide/
   - text: WriteUp
@@ -18,9 +18,13 @@ sidebar:
   '/learn/':
     - text: 写在前面
       link: /learn/
+    - text: Web
+      link: /learn/web
+    - text: Reverse
+      link: /learn/reverse
 
   '/guide/2024/':
-    - text: 赛事信息
+    - text: 参考文档
       link: /guide/2024/
     - text: Week 1
       collapsed: false

theme/components/docs/Container.vue

@@ -8,16 +8,6 @@ withDefaults(
         type: "info"
     }
 );
-
-function fmtClass(theme?: string, ...append: string[]): string {
-    let classes: string[] = [];
-    if (append) classes.push(...append);
-    if (!theme) theme = "";
-    theme.split(/\s+/).forEach(t => {
-        classes.push(`link-${t}`);
-    });
-    return classes.join(" ");
-}
 </script>
 
 <template>

theme/components/docs/Link.vue

@@ -42,7 +42,7 @@ const iconMap = {
 </template>
 
 <style lang="scss">
-@import "@/styles/utils/docs-link.scss";
+@use "@/styles/utils/docs-link.scss" as *;
 
 $current-color: currentColor;
 $primary-color: var(--vp-c-brand-1);

theme/style.scss

@@ -1,3 +1,7 @@
+// default adjust link for vp-doc
+@use '@/styles/docs-link-adjust.scss' as *;
+@use '@/styles/custom-block.scss' as *;
+
 /**
  * Customize default theme styling by overriding CSS variables:
  * https://github.com/vuejs/vitepress/blob/main/src/client/theme-default/styles/vars.css

theme/styles/custom-block.scss

@@ -0,0 +1,65 @@
+.custom-block {
+    @mixin basic-block {
+        padding: 6px 16px 6px !important;
+        margin: 20px 0;
+        border-radius: 4px;
+    }
+    @mixin paragraph {
+        p {
+            font-size: 14px;
+            margin: 0.5rem 0 !important;
+        }
+        p.custom-block-title {
+            font-size: 16px;
+        }
+    }
+    &.tip {
+        @include basic-block;
+        background-color: var(--block-bg-tip);
+        border-left: 5px solid var(--block-tip);
+        @include paragraph;
+    }
+
+    &.info {
+        @include basic-block;
+        background-color: var(--block-bg-info);
+        border-left: 5px solid var(--block-info);
+        @include paragraph;
+    }
+
+    &.warning {
+        @include basic-block;
+        background-color: var(--block-bg-warning);
+        border-left: 5px solid var(--block-warning);
+        @include paragraph;
+    }
+
+    &.danger {
+        @include basic-block;
+        background-color: var(--block-bg-danger);
+        border-left: 5px solid var(--block-danger);
+        @include paragraph;
+    }
+}
+
+:root {
+    --block-tip: #67c23a;
+    --block-info: #409eff;
+    --block-warning: #e6a23c;
+    --block-danger: #f56c6c;
+    --block-bg-tip: #{rgba(#67c23a, 0.1)};
+    --block-bg-info: #{rgba(#409eff, 0.1)};
+    --block-bg-warning: #{rgba(#e6a23c, 0.1)};
+    --block-bg-danger: #{rgba(#f56c6c, 0.1)};
+}
+
+.dark {
+    --block-tip: #67c23a;
+    --block-info: #409eff;
+    --block-warning: #e6a23c;
+    --block-danger: #f56c6c;
+    --block-bg-tip: #{rgba(#67c23a, 0.1)};
+    --block-bg-info: #{rgba(#409eff, 0.1)};
+    --block-bg-warning: #{rgba(#e6a23c, 0.1)};
+    --block-bg-danger: #{rgba(#f56c6c, 0.1)};
+}