1
0
mirror of https://github.com/ZSCNetSupportDept/website.git synced 2025-10-28 17:05:03 +08:00

71 Commits

Author SHA1 Message Date
dependabot[bot]
29643aba2d Bump nanoid from 3.3.7 to 3.3.8
Bumps [nanoid](https://github.com/ai/nanoid) from 3.3.7 to 3.3.8.
- [Release notes](https://github.com/ai/nanoid/releases)
- [Changelog](https://github.com/ai/nanoid/blob/main/CHANGELOG.md)
- [Commits](https://github.com/ai/nanoid/compare/3.3.7...3.3.8)

---
updated-dependencies:
- dependency-name: nanoid
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>
2024-12-16 06:12:40 +00:00
govolokatliai
afc432298e Web后端教程:优化了语言,让他对新手更加友好 2024-11-03 14:38:48 +08:00
govolokatliai
c249213cc6 完善Web后端教程-增加HTTP协议和AJAX例子 2024-11-03 13:59:41 +08:00
govolokatliai
af35ada10e 继续完善Web后端的教程。。。 2024-11-02 19:55:40 +08:00
govolokatliai
124b80857b 完善了Web后端教程 2024-11-02 16:01:52 +08:00
govolokatliai
19ebcc67d4 增加了系列文章-Web后端培训 2024-11-01 18:56:26 +08:00
govolokatliai
1faabe5bc1 增加在文档最后显示最近修改时间 2024-10-31 19:01:55 +08:00
govolokatliai
3f4bff2f66 新建文章集-git培训,规划开发组项目 2024-10-14 21:23:30 +08:00
govolokatliai
755a0cd758 增加了提示 2024-09-27 23:22:19 +08:00
govolokatliai
7a5d8a7ff0 增加了指南 2024-09-27 23:18:18 +08:00
govolokatliai
325f5b906f 增加一篇指南 2024-09-27 21:58:15 +08:00
govolokatliai
48c28f77ba 后端API文档(内测) 2024-09-23 01:25:50 +08:00
govolokatliai
c1f35228c4 更新recruitment.html 2024-09-05 17:11:38 +08:00
govolokatliai
ff04048f76 增加了一个测试的招新页面 2024-09-05 15:21:22 +08:00
govolokatliai
1c114c9e85 啊啊啊啊啊 2024-09-04 03:58:54 +08:00
govolokatliai
84456e5555 增加光缆的有关信息 2024-08-31 18:50:22 +08:00
govolokatliai
473f6acaff 初步写了一个关于网线的科普文章,另外把旧wiki的dns科普文章搬过来 2024-08-31 18:49:39 +08:00
govolokatliai
f714652131 添加了wiki贡献提示 2024-08-31 09:00:47 +08:00
govolokatliai
47468abf0b 完善开发组网站文档 2024-08-31 08:42:10 +08:00
govolokatliai
a64c802670 修改wiki查看ip的信息 2024-08-30 06:19:20 +08:00
govolokatliai
1b52179f48 补充旧版wiki的信息 2024-08-30 06:18:04 +08:00
govolokatliai
816f1881f2 修改了一些细节 2024-08-30 05:48:22 +08:00
govolokatliai
aa2c2e8048 增加基础知识的科普栏目 2024-08-29 17:48:31 +08:00
govolokatliai
6fc857408d 添加首页链接(好像没效果) 2024-08-29 17:39:47 +08:00
govolokatliai
44c49dc12d 完善了拨号,做网线,做端口,解绑MAC的wik内容 2024-08-28 19:43:51 +08:00
govolokatliai
fe61443aeb 完善快速上手指南和README.md 2024-08-23 13:52:19 +08:00
govolokatliai
0028075638 补充了一些片区信息,增加了169.254.x.x的ip的问题汇总 2024-08-22 15:18:26 +08:00
govolokatliai
17fa5c0ef7 Update todolists.md 2024-08-22 13:03:01 +08:00
govolokatliai
d7d37aae82 修改了排版,完善了主页“杂项”的链接 2024-08-22 12:41:31 +08:00
govolokatliai
7dca52c7c3 修改了排版和结构,增加了“杂项” 2024-08-22 12:35:09 +08:00
govolokatliai
c39062bd5b 完善网站的快速上手指南 2024-08-22 12:25:13 +08:00
govolokatliai
c46c0e2557 完善了快速上手指南 2024-08-22 12:08:48 +08:00
govolokatliai
c5ac642a07 增加了快速上手指南的一些内容 2024-08-22 11:46:15 +08:00
govolokatliai
e73ba9a033 在README.md里补充快速上手指南的链接 2024-08-22 03:32:57 +08:00
govolokatliai
423389ba3a 增加了开发组网站的快速上手指南 2024-08-22 02:38:51 +08:00
govolokatliai
84ab795d91 增加域名续费的提示,增加依赖提示 2024-08-21 22:24:43 +08:00
govolokatliai
417f379d40 增加网站开发的工作流程 2024-08-21 19:09:05 +08:00
govolokatliai
b118d864e4 增加备忘录,优化了排版 2024-08-20 21:14:25 +08:00
govolokatliai
aef93ef489 增加了续费提示 2024-08-20 20:53:05 +08:00
govolokatliai
305d7eeacc 增加开发组培训资源的链接 2024-08-20 20:44:14 +08:00
govolokatliai
310bba836e 修复 2024-08-20 20:27:33 +08:00
govolokatliai
86f0417974 修复 2024-08-20 20:26:58 +08:00
govolokatliai
5d4696a694 完善首页的信息 2024-08-20 20:21:01 +08:00
govolokatliai
41168644a3 优化手机访问 2024-08-20 19:22:06 +08:00
govolokatliai
d540cb5e69 修改了首页结构 2024-08-20 01:25:30 +08:00
govolokatliai
663b862518 上传ComIntRep ,一篇使用教程,在资源页面增加链接 2024-08-20 00:05:29 +08:00
govolokatliai
21fd313a8f 增加了wiki首页的资源条目,改善了排版 2024-08-19 22:51:55 +08:00
govolokatliai
2acc8dd857 增加两份文件:网维规章制度,维修手册,增加robots.txt 2024-08-19 22:32:53 +08:00
govolokatliai
7c30251999 增加了基础知识和MacOS修理指南 2024-08-19 21:07:37 +08:00
govolokatliai
df46fdc697 补充部署方式 2024-08-19 19:17:01 +08:00
govolokatliai
efb40b9457 增加了不同ip地址的对应情况 2024-08-19 19:11:36 +08:00
govolokatliai
9984d64cd1 增加了MacOS修理指南的内容 2024-08-19 18:45:51 +08:00
govolokatliai
1bc4251a84 增加了README.md 2024-08-19 16:03:56 +08:00
govolokatliai
871ef8fc4d 修改了在构建中遇到broken links的对策 2024-08-19 15:22:32 +08:00
govolokatliai
825ee2a9cb 修改链接 2024-08-19 15:16:58 +08:00
govolokatliai
0abee86f13 优化网站文档的结构 2024-08-19 15:14:07 +08:00
govolokatliai
e94a6d324a 优化wiki的结构 2024-08-19 15:13:02 +08:00
govolokatliai
3982a1d033 增加了静态资源的下载方式 2024-08-19 03:00:57 +08:00
govolokatliai
ea2e26e58a 测试-为网站提供文件存放功能以供下载 2024-08-19 02:40:01 +08:00
govolokatliai
9f5f53fa2e 增加了网站服务器的nginx配置信息 2024-08-19 02:27:18 +08:00
govolokatliai
6ebb478433 增加nginx配置 2024-08-19 00:04:14 +08:00
govolokatliai
c612403bc9 增加了开发组网站的部署方式 2024-08-18 21:50:38 +08:00
govolokatliai
da83244cd1 增加开发组的联系方式 2024-08-18 00:43:05 +08:00
govolokatliai
0d12b107a8 增加wiki首页的提示 2024-08-18 00:21:15 +08:00
govolokatliai
8e6e04755e 改名字 2024-08-18 00:17:15 +08:00
govolokatliai
322c652fa6 针对手机端访问wiki做了优化 2024-08-18 00:15:20 +08:00
govolokatliai
1048acd656 完善wiki的内容 2024-08-17 21:17:27 +08:00
govolokatliai
fe06ca7255 完善网站的文档 2024-08-17 21:16:45 +08:00
govolokatliai
33ac26100f 增加报修服务器信息,补充开发组联系方式 2024-08-17 17:01:20 +08:00
govolokatliai
4f6851119a add deploy hints 2024-08-17 01:55:04 +08:00
govolokatliai
a4b4229ecf Rename testpages.js to _testpages.js 2024-08-17 01:28:49 +08:00
109 changed files with 2142 additions and 76 deletions

View File

@@ -1,8 +1,30 @@
# zsc网维开发组网站
这里是开发组的网站源代码仓库采用Docusaurus框架,欢迎issue和PR
## 依赖
`nodejs >= 18.0`
## 构建
不同于传统的静态网页生成器本项目不需要额外加装构建工具生成器和内容本身加起来就是一个单独的react.js应用所以理论上你只需要把这个repo pull到本地再用npm构建即可运行`npm run docusaurus`来运行框架本身提供的一些脚本
不同于传统的静态网页生成器本项目不需要额外加装构建工具生成器和内容本身加起来就是一个单独的react.js应用所以理论上你只需要把这个repo pull到本地再用npm构建即可运行`npm run docusaurus`来运行框架本身提供的一些脚本.
要构建可以拿去部署的静态网站资源,运行:
```
git clone https://github.com/ZSCNetSupportDept/website
npm install
npm run docusaurus build
```
运行`npm run docusaurus deploy`可以自动构建静态网站并且push到`build`上\
https://zscdev-demo.pages.dev 是本仓库的一个demo网站基于master构建而不是build
## 部署
参见 https://zscdev-demo.pages.dev/docs/devdocs/网站/开发组网站/开发组网站-部署
## 内容发布
参见文档
## 开发
务必在本地测试好改动后再push
## 关于
若有问题,可以联系开发组组长
针对新手我们有一个教程帮助你快速入门https://zscdev-demo.pages.dev/docs/devdocs/网站/开发组网站/快速上手

View File

@@ -0,0 +1,5 @@
# 你可以在哪里找到开发组?
目前,开发组成员可以通过如下的方式联系:
- 开发组成员可以通过github上的[论坛](https://github.com/ZSCNetSupportDept/forum/discussions)交流(仅限内部访问)
- 开发组有一个QQ群961797864
- 可以联系组长,QQ:2597760847

View File

@@ -0,0 +1,28 @@
# ComIntRep的使用教程
## 介绍
如果是操作系统本身的问题导致了用户没法上网的话传统的办法是先确定故障出现在哪里然后去修理对应的地方在这个过程中难免要接触到修改注册表协议栈hosts这类复杂的名词..
<!--truncate-->
而ComIntRep就是一款一键修复windows网络的神器全称`"Complete Internet Repair"`,他的功能有:
- 重置 Internet 协议TCP/ IP 协议)
- 修复 Winsock
- 更新互联网连接
- 刷新 DNS 解析器缓存
- 刷新 ARP 缓存
- 修复 Internet Explorer
- 清除 Windows 更新历史记录
- 修复 Windows 自动更新
- 修复的 SSL / HTTPS 加密
- 重置代理服务器配置
- 重置 Windows 防火墙配置
- 恢复默认的 hosts 文件
- 修复查看工作组计算机\
这款软件可以帮我们很大程度上节省修网的时间,非常推荐使用
## 使用
勾选你要修复的部分,然后点击`Go!`,就可以了,系统会自动重置你选择那部分的网络配置,修复完毕后,重启电脑即可\
官方推荐在修复前备份操作系统,点击`Maintennace`->`System_Restore`,然后点击“配置”“启用系统保护”然后为C盘创建一个还原点就可以修复了
## 参考
https://zhuanlan.zhihu.com/p/27196344 \
<!-- https://rizonesoft.com/downloads/complete-internet-repair/ \ -->

View File

@@ -0,0 +1,78 @@
# 给纯新手的网维快速入门指南
许多新进网维的小伙伴们都可能对我们的日常工作一脸懵:网维是干什么的,我们到底在修什么?其他人说的交换机,主线到底是什么?
甚至有很多正式成员都搞不明白这个问题,为了提升大家的业务水平和网络技术,我们特意编写了这份指南,希望能对你有些许的用处。
<!--truncate-->
## 网络
网维,那不就是修网络的吗?但是,网络是什么?他究竟是什么样的?为什么我可以访问到遥远彼方的内容(网页,游戏,等)?
首先我们需要知道计算机中的一切数据都是一串二进制数字也就是许多的01010101101010.........,网络的本质就是在计算机之间传输这些数字如何进行传输呢通常是使用物理现实的两种状态来表示0和1这两个数字。
比如一个电路简单点说有一个电灯电路闭合电灯亮我们定义这样的状态是1,反之电路断开电灯暗我们定义这样的状态为0,我们让计算机监听这个电路的状态通过电路断开闭合状态不断的超高速的变化就可以传递01010101这些数字来进行信息的传递。
:::info 信息
这里有我们写的一篇科普文章,介绍了网线的一些概念:[Click Me](/docs/wiki/基础知识/科普/网线是什么)
:::
不一定需要电路这种介质还可以是无线电波例如定义电波幅度大于某个值为1,小于某个值为0或者大于某个频率为0,小于某个频率为1,让计算机接受这样的电波并解读,也可以传递信息。
其实,简单地说,前者就是以太网(有线网)本质,网线本质上就是电线,里面是以高频率断断续续的电流,把电线接到计算机里,计算机就可以依据电路的变化情况来获取信息.而后者则是无线网(Wi-Fi,移动通信技术等)本质,他们通过调制电磁波来传递信息。
### 网维
网维主要修的是学生宿舍的以太网,在每个宿舍的每个人的桌子前,都有一个网线端口,用户将网线插入端口和计算机,即可连接到宿舍的楼层线路,端口后面是墙线,意思是它是埋在墙里的,我们一般情况下没法动他
依据宿舍片区的不同,墙线可能直接通去了机房,也有可能是连接到了宿舍的路由器(交换机/光猫),经过这一层转发,再前往机房。
:::tip 提示
你可以在片区信息中查看各个片区的具体结构
:::
路由器是什么?交换机和光猫又是什么?这个问题如果专业地展开来讲有点难懂,对于新手来说,你可以简单的理解为他们都是中转站,电线在这里经过出去的电线继续信息的传递,而不是直接一根线连到网络上去
无线路由器(或者有路由功能的光猫)还可以让用户通过无线方式接入线路,比如,如果你想坐高铁,从中山坐到广州南,然后再从广州南做到其他地方,但是没必要全程坐高铁,你可以打车,坐地铁到广州南,然后再坐高铁。这里一样的,不管有线还是无线的接入,在网关(我们对这些设备的统称)都是转换成有线再出去,
出去是去哪里呢?在宿舍的结构中,是去了机房(或者说,弱电井),宿舍去机房的线就叫做主线(只有通过网关中继的地方才会有主线的概念,直连机房的就直接是墙线)
线路到了机房,一般会接入一个叫做配线架的设备,这个也是一个中继器,方便我们维修(如果是线路坏了的话),配线架的端口总是成对的,有一个进口就会有出口,一般进口都是不用我们去管的,线路经过出口出来,连接到交换机上,我们网维的工作一般追踪到这里,再往后的问题就不是我们的职责了,
交换机有运营商的区别,用户需要接到他宽带开通的运营商对应的交换机上,通过一类叫做“拨号”的协议来进行认证,向运营商用自己的账号请求登录,请求运营商允许联网,这样也方便运营商计费(和学校监控!,交换机通常都是集成了光纤功能在这里将电路的信号调制成光的信号这也是一种传输0101010的方式然后接入运营商的网络访问全国和全球的互联网
## 维修
上面就是我们学校宿舍网络的结构了,网维的工作,本质就是维护这样的结构正常运行,在这些环节中,每一个都有可能出错,一般来说,我们最常见的有两种错误:硬件(物理层)错误(651)和软件错误(691).
### 651错误
硬件错误,通常在拨号时会给出`651`错误,本质上,这种错误就是物理连接出现了问题,要么是墙线老化接触不良了,要么是主线出现了问题,要么是交换机,配线架没有接好,要么是网线问题,对于这种问题,我们通常通过寻线对线器来解决,排查问题
排查问题一般都是调试可能出错的因素,例如,你用一根确定了的是好的网线直连端口对线没问题,但是用户的线连接端口就有问题,那么就是用户的线有问题
:::info 信息
关于更多651错误请查阅wiki相关页面也请查阅`技能`板块中`对线``寻线`的条目
:::
### 691错误
软件错误,通常会在拨号时给出`691`错误,本质上,这意味着物理连接是通的,但是运营商那边拒绝的用户的登录,有几种可能:
1. 交换机接错了,用户是某个运营商,你接到了其他的运营商的交换机,当然报错喽~
2. 短时间内过多的登录,被运营商拉黑了,需要稍等一会子
3. 宽带欠费,停机
4. 账号密码错误
5. 运营商会绑定MAC地址来限制多设备在更换电脑或者转接器等设备时会遇到这样的情况可以打电话给运营商要求所谓的“解绑刷新”也可以组长
:::info 信息
关于更多691错误请查阅wiki的相关页面和相应的文章
:::
## 总结
这里只是一篇简要的指南我们在这里介绍了网络的基本概念让你对你所要维修的系统有一个大概的了解你可以继续去看wiki中的相关条目来进一步扩充你的知识希望你在网维的时光过得愉快

View File

@@ -18,5 +18,11 @@ zsxyww.com,网维的官网
我们的项目托管在github上私聊组长来获得进入organization的权限
### 文档编写
为了项目的持续维护对于我们的每一个项目都应该留有详尽的文档文档以markdown格式编写可以自动构建成静态网页详见**网站/如何修改开发组网站内容**
### 培训 资料
这里是一些资料,帮助你了解加入开发组工作的必要知识
- SSH教程https://wangdoc.com/ssh/basic
- git教程:
- WEB基础https://developer.mozilla.org/zh-CN/docs/Learn/Getting_started_with_the_web
- linux命令
- markdown教程

View File

@@ -1,4 +1,5 @@
# 子站点
网站的子站点
## www.zsxyww.com
www.zsxyww.com是网维的官网
## wiki.zsxyww.com

View File

@@ -1,14 +1,19 @@
# 开发组网站概览
# 开发组网站-概览
## 技术
网站基于Docusaurus开发,一个静态网页生成的框架尤其对于生成技术文档来说它提供了一个美观现代的前端界面这个项目本身是一个react.js应用生成网页时只要输入`npm run build`便可以在build目录里构建网站的所有资源以进一步部署关于详细的配置可以去看官方的文档[文档连接](https://www.docusaurus.cn/docs/category/guides)
## 工作流程
基本上我们需要把markdown文件放在目录里面系统就会根据目录的结构自动生成网页但是我们必须写好配置文件如果我们想自定义网站的外观的话也需要好好研究一下配置文件有关文档还在编写中
基本上我们需要把markdown文件放在目录里面系统就会根据目录的结构自动生成网页但是我们必须写好配置文件如果我们想自定义网站的外观的话也需要好好研究一下配置文件有关文档还在编写中 \
开发组网站的开发流程基本如下:
1. 将源代码仓库的最新版本拉取到本地对仓库的内容进行修改最终在本地的master分支上commit,
2. 运行`npm start``https://localhost:3000`上运行基于改动构建的预览版本
3. 测试改动确保一切正常后push到github上
4. demo网站会自动根据github上的msater分支构建网页构成开发组网站的预览版本
5. 积累几个改动后,在本地运行`npm run deploy`将网页构建好推送给github上的`build`分支,网站服务器自动获取并更新,构成开发组网站的正式版本
## 目录
所有的文档文件都储存在docs文件夹下\
所有的公告文件都储存在blog文件夹下\
所有的静态页面都储存在src/pages文件夹下\
所有的媒体文件都储存在static文件夹下\
系统会根据这些文件在build里生成网站的所有页面文件以供我们部署
所有的媒体文件都储存在static文件夹下,供用户下载的资源也储存在这里\
docusaurus.config.js是项目的配置文件配置格式请参照官方文档
## 部署

View File

@@ -0,0 +1,43 @@
# 开发组网站-内容
**本篇文章将教你进行内容发布,维护开发组网站内容的方法**
## 如何修改
### Edit This Page
页面最下面有一个Edit This Page的超链接点击就可以进入github里这个页面的源代码可以提交PR有权限的也可以直接修改
### git clone
(该方法仅限有权限的开发组成员)\
如果你要进行比较多的修改的话,你也可以将仓库拉取到本地,然后修改,新建文件夹,打开终端
- 输入`git clone https://github.com/ZSCNetSupportDept/website.git`
- 输入`git checkout master`
- 此时你应该可以看见项目的源代码,修改你需要改动的内容,然后输入`git add *`
- 输入`git commit`,将你的改动提交到本地
- 输入`git push`,提交内容到仓库
## 仓库的内容
你可以看见三个文件夹分别是src,docs,blog,其中:
- src文件夹存放了独立于文档和blog的静态页面
- docs文件夹存放了所有的文档目前有wiki和开发组文档两个docs
- blog文件夹存放了可以显示在“公告”板块的文章
所有的文档都以Markdown格式书写其实也可以用MDX格式
### 前缀
所有文件都有一个数字前缀,这是文章在成品网站中的顺序,文件请按照`order-filename.md`的格式命名
btw,docusaurus不会将以"_"开头的文件加入完成的网页中,所以可以在暂时不想要展现在最终网站的里的的文章前面加上一个下划线
### 栏目的概况
我们可以在一个子文件夹中加入`index.md`或者`README.md`或者`{$文件夹的名称}.md`,其中的内容会在成品网站中显示为这个栏目的概况(点击这个栏目本身出现的内容)
### Markdown 文档
Markdown 是一个标记文本格式的语言轻便简单快捷markdown最基本的语法如下[markdown语法](https://commonmark.org/) 我们用Markdown来编写文档,需要注意的是文档只能有一个h1系统用它来产生sidebar条目
另外docusaurus好像支持mdx格式的文档可以把一些动态元素插入到文本中
### 媒体资源引用
请将所有媒体资源放在static目录内然后在文档中调用
### 下载
`static`目录下面的内容会直接放到生成的网页里我们在wiki和开发组文档里各设置了一个下载页面提供便捷访问的方式在Markdown文本里链接这些文件来提供下载的方式
### 公告
docusaurus自带一个blog插件需要按照`yyyy-mm-dd-filename.md`的格式发布
## 文档的维护
如果发现了文档有错误的地方请提交PR修改或者告知开发组成员
## 进阶
更详细的内容还是建议看docusaurus的官方文档[文档连接](https://www.docusaurus.cn/docs/category/guides)

View File

@@ -0,0 +1,15 @@
# 开发组网站-部署
本篇文章是开发组网站的部署流程备忘录
## 流程
网站假设在我们的云服务器上服务器会自动从仓库的build分支拉取内容所以网站的部署流程是这样的
1. 将website仓库clone到本地/pull拉取最新版本
2. 运行`npm start`在localhost:3000上运行网站的测试版本
3. 确认网站的最新版本没有问题后,运行`npm run docusaurus deploy`npm会自动构建网页文件推送到origin/build分支上(记得配置好你的ssh,联系组长来获取仓库的权限)
4. 服务器获取build分支的最新版本pull到`/var/www/developer`目录下
5. 服务器采用nginx提供对developer.zsxyww.com的访问
## demo
我在cloudflare pages上部署了一个网站的demo,这个网站会自动基于master分支构建而不是获取构建好的build分支可以在上面预览网站的效果觉得没问题了再进行build,网址https://zscdev-demo.pages.dev/
## 服务端
目前网站服务器拉取build构建的方式是通过定时执行5分钟1次一个特定的更新脚本位置在`/opt/developer-build.sh`写在crontab里了

View File

@@ -1,2 +1,9 @@
# 网站外观修改
# 开发组网站-外观
**本篇指南将教你如何修改开发组网站的外观**
看官方文档

View File

@@ -0,0 +1,249 @@
# 快速上手
修网的知识需要在实践中不断积累网维的wiki做为每一个网维成员经验的总结自然也需要不断的更新但是wiki本身大部分时间都是由开发组的仅仅几个人来维护难以时刻更新到最新情况所以我们想让网维的每个人都能加入wiki的维护这篇文章就是写给希望为wiki添砖加瓦却不太了解相关方法的小伙伴的希望这篇文章能够快速让你上手wiki的维护工作。
在这篇文章里我们将教你:\
将我们在github上的主仓库fork一份然后将fork仓库clone到你的电脑;修改网站源代码;将你的修改传回fork仓库提交pull request
:::info 信息
在正式开始编辑前,你可以看看我们的成品网站,每篇文章的下面会有一个`Edit This Page`的链接,是这篇文章的源代码,这里是网站的链接:[Click Me ](https://zscdev-demo.pages.dev/)
:::
## 准备
我们假设你所使用的是windows系统。
首先我们需要安装必要的开发工具git 和 Node.js。
访问如下链接:[git下载](https://git-scm.com/download/win) , [Node.js下载](https://nodejs.org/zh-cn/download/prebuilt-installer)。
:::info 信息
你也可以通过windows自带的WinGet包管理器下载,详见:[微软文档](https://learn.microsoft.com/zh-cn/windows/package-manager/winget/)。
:::
:::tip git是什么
git是一个版本控制工具他会记录一个项目从创建之初任何人对任何文件的任何改动大大方便了多人协作工程的管理wiki的源代码托管在基于git设计的github上。
:::
:::tip Node.js是什么?
Node.js是一个在后端运行javascript的运行时我们使用基于这个平台设计的docusaurus框架来将wiki从一堆markdown文档变成一个网站。
:::
访问github,如果没有账号就注册一个然后打开https://github.com/ZSCNetSupportDept/website。
点击上面的fork,创建仓库的一个分支点击create fork。
进入你刚才fork的仓库点击Code,选择HTTPS,复制下面的那一串内容。
然后,请打开你的终端,你可以在“开始”菜单栏里搜索"PowerShell"来打开。
如果你的系统没有安装PowerShell,你可以使用cmd`Win+R`,在弹出框里输入`cmd`打开。
输入`git clone 你复制的内容`,这将在你的当前目录下创建一个名为`website`的文件夹,并将开发组网站的全部内容复制到这个文件夹里面。
:::tip 提示
你可能会需要科学上网的手段来访问github。
:::
然后,输入`cd website`
切换到我们的项目目录下后,运行`npm install`来安装项目的所有依赖。
:::tip 提示
为了加速下载你可能会需要配置npm镜像可以输入`npm config set registry https://registry.npmmirror.com`
:::
现在,输入`npm start`,程序就会在你的电脑上构建并部署网站。
然后在你的浏览器上输入`https://localhost:3000`
如果没有出错的话,你会看到我们开发组网站的主页。
:::tip 提示
每次启动测试版网站,都需要在这里再输入一次`npm start`
:::
## 编辑
打开`website`下的`docs`文件夹,再打开`wiki`文件夹,这里就是我们的wiki内容仓库了。
仓库里的所有的文章都是以md结尾的markdown文件你需要熟悉markdown的写法才能对文章的内容修改和完善markdown并不是特别复杂你可以花一点时间去学会他。
:::info 信息
这里是一些学习markdown的资源https://markdown.com.cn/ \
https://github.highlight.ink/mastering-markdown/intro \
https://commonmark.org/ (英文)
:::
如果想要在文本中添加图片视频或者其他资源请将这些素材放入static中以方便管理。
对代码的修改将会自动同步到刚才打开的网页里,你可以在那里确认修改的结果满意与否,注意,你需要保存文件才会同步更改。
修改完毕后,输入`git add .`再输入`git commit`,并对你的修改做出一个简短的说明。
### 改什么?
你可以校对已有的条目,增加一些内容,或者加入一些图片之类的。
你也可以添加新条目,撰写一些你觉得有价值的修网心得。
或是帮助我们改善网站本身比如改一改主题写一个首页等如果有相关能力需要react基础
### 文件名
你会发现所有文件的名字前面都有一个数字那就是文章在sidebar中出现的顺序增添文件请按照`order-filename.md`的格式修改名字。
在文件名前加一个下划线,系统就不会将文章加入成品网站中。
:::tip 提示
关于如何修改wiki的更多提示,可以去看docusaurus的官方文档[链接](https://docusaurus.cn)
:::
## 推送到仓库
在修改完毕并且在本地检查完毕后你需要将你的修改同步到你在github的远程fork仓库然后再提交一个pull request请求主仓库合并你在fork仓库所做的修改。
首先你需要验证你的身份让github允许你的电脑向它提交push
:::tip 提示
你可以使用github desktop或github cli来简化这个流程不过我们想让你在这个过程中学习SSH的用法如果你想方便一点直接跳到“使用github-cli”。
:::
### 选项1:使用SSH
首先确保你安装了SSH,你可以看微软的这片文档:[链接](https://learn.microsoft.com/zh-cn/windows-server/administration/openssh/openssh_install_firstuse?tabs=gui)。
打开终端,输入
```PowerShell
ssh-keygen -t ed25519
```
然后在接下来的选项中检查密钥的存放路径,以及使用一个密码来加密这个密钥,我们建议你设置一个密码。
然后我们设置开机自动启动ssh-agent服务。
确保你使用了管理员权限运行了下面的PowerShell代码
```PowerShell
Get-Service ssh-agent | Set-Service -StartupType Automatic
Start-Service ssh-agent
Get-Service ssh-agent
```
最后一个命令应该会返回`Running`状态。
然后,你就可以输入`ssh-add`来加载你的密钥。
```PowerShell
ssh-add 你的私钥位置
```
:::tip 提示
每次重启电脑,你都要重新输入一遍`ssh-add`
:::
:::info 信息
关于SSH的配置参考了这片[微软文档](https://learn.microsoft.com/zh-cn/windows-server/administration/openssh/openssh_keymanagement)。
:::
接下来我们配置github的SSH访问。
打开与私钥同目录下的公钥文件(以pub结尾),然后复制他,注意要全部复制,不要多出或减少任何内容。
点一下你的github头像选择Settings,然后在侧边栏的Access板块找到SSH and GPG keys。
点击 `New SSH key`
把密钥粘贴到下面,然后保存就行了。
在终端里输入
```PowerShell
ssh git@github.com
```
如果返回的文本里出现了你的用户名,配置就大概成功了。
现在就可以输入`git push`
```PowerShell
git push
```
这个命令会向远端的仓库提交你在本地提交的commit,检查你的fork仓库有没有更新到你本地的修改
:::info 信息
参考了github的文档:[Click Me ](https://docs.github.com/zh/authentication/connecting-to-github-with-ssh/about-ssh)
:::
### 选项2使用github-cli
访问https://github.com/cli/cli/releases 下载最新版本。
输入`gh`以检查安装的成功状况。
没问题的话,输入`gh auth login`,会弹出一个浏览器窗口,在弹出的窗口中完成登录。
然后,你应该就可以直接使用`git push`了,输入`git push`,然后查看你在github中的fork仓库有没有更新到你本地的修改。
:::info 信息
这里有更多关于github cli 的信息:[Click Me ](https://docs.github.com/zh/github-cli/github-cli/about-github-cli)
:::
### 提交pull request
一个pull request 是一个请求,将修改建议发送给主仓库,并让主仓库合并这些修改。
打开主仓库选择上面的Pull Requests,然后选择New Pull Request,如果没有出现你的fork仓库点击compare accross forks。
然后就可以Create Pull Request了。
提交后,开发组成员会校对你的修改,将你的修改应用到主仓库中,这就是我们的开发流程了。
:::info wiki的分层更新模型
按照我们的设计wiki的内容从新到旧一共分为三个版本
- 最新的版本是大家在自己的电脑上运行的测试版网站,这个版本包含了最新的想法和更改,等待完善后推送到主仓库。
- 然后是我们的demo版本网站[zscdev-demo.pages.dev](zscdev-demo.pages.dev),这个版本立即反应了任何被合并进去主仓库master分支的更改大家可以对这个网站上的内容随便提意见任何修改都将很快被同步到网站里。
- 当主仓库和demo网站的更新积累到一定程度的数量时开发组成员会根据一个版本作为wiki的正式版正式推送到我们的网站[developer.zsxyww.com](developer.zsxyww.com)里这个版本通常要比demo要落后几次更新但是那些在施工中的文章和还在讨论的段落等不稳定的内容将不会被同步到这里换句话说这个版本是“稳定版”。
这样网站的测试和正式使用的版本就分开了,保证了网站内容的严谨
:::

View File

@@ -1,22 +0,0 @@
# 开发组网站-内容发布
**本篇文章将教你如何为开发组网站贡献内容,修改内容,以及内容的维护**
## Edit This Page
页面最下面有一个Edit This Page的超链接点击就可以进入github里这个页面的源代码可以提交PR有权限的也可以直接修改
## 增加内容
docusaurus按照一定的文件层次将markdown文档转换成静态页面在仓库里docs文件夹下的是网站的文档blog文件夹下的为公告src/pages下的为独立页面如首页如果要增添新的内容记得把内容放在正确的地方里
### 前缀
所有文件都要加入一个数字前缀用来指示构建系统按照序号生成文章在sidebar中的顺序,按照`order-filename.md`的格式命名
btw,docusaurus不会将以"_"开头的文件加入完成的网页中,所以可以在暂时不想要展现在最终网站的里的的文章前面加上一个下划线
### Markdown 文档
Markdown 是一个标记文本格式的语言轻便简单快捷markdown最基本的语法如下[markdown语法](https://commonmark.org/) 我们用Markdown来编写文档,需要注意的是文档只能有一个h1系统用它来产生sidebar条目
另外docusaurus好像支持mdx格式的文档可以把一些动态元素插入到文本中
### 媒体资源引用
将所有媒体资源放在static目录内然后在文档中调用
## 公告
docusaurus自带一个blog插件需要按照`yyyy-mm-dd-filename.md`的格式发布
## 文档的维护
如果发现了文档有错误的地方请提交PR修改或者告知开发组成员

View File

@@ -1 +0,0 @@
# 旧版wiki

View File

@@ -0,0 +1,2 @@
# 旧版wiki
使用wiki.js开发的wiki

View File

@@ -0,0 +1,2 @@
# 主页面
主页面就是www.zsxyww.com下的页面这个页面好像很久没人维护了文档正在编写。。。

View File

@@ -3,3 +3,4 @@
我们目前拥有负责报修系统和网站的两台服务器位于tx云上,联系组长以获得访问权限
## 域名
我们拥有一个域名zsxyww.com

View File

@@ -1,2 +1,7 @@
# zsxyww.com
这个域名目前托管在west.cn上腾讯云dns关于域名的交接事项请联系组长
:::tip 提示
记得续费域名
:::

View File

@@ -1,2 +1,9 @@
# 报修服务器
因信息安全,请移步我们的内部仓库访问相关信息
:::tip 提示
记得续费网站
:::

View File

@@ -1,13 +1,8 @@
# 网站服务器
## 概况
ip:**43.129.159.235**
因信息安全,请移步我们的内部仓库访问相关信息
:::tip 提示
OS:**Debian 10.2 64bit**
记得续费网站
配置CPU - 1核 内存 - 1GB\
系统盘 - SSD云硬盘 25GB\
流量包 - 1024GB/月峰值带宽30Mbps
:::
服务:官网(通过docker部署8090端口nginx反代)\
旧版wiki(docker3000端口,nginx反代)\
新网站(TODO:补充部署方式)

View File

@@ -1,6 +1,9 @@
# 加入开发组
可以参照下面的联系方式和开发组进行联系
# 联系开发组
开发组成员可以通过以下方式联系
## 联系方式
QQ群961797864
QQ:2597760847(组长)
论坛https://github.com/orgs/ZSCNetSupportDept/discussions (内部)\
github主页: https://github.com/ZSCNetSupportDept

View File

@@ -0,0 +1,2 @@
# 下载
可以把需要存放的文件链接放在这里以供下载

View File

@@ -0,0 +1,44 @@
# 概览Git
这里是git的一个简短教程
## 目录
本教程的目录。。。
1. 介绍-做为版本控制系统的git
- 什么是版本控制系统(VCS)?
- git是如何进行版本控制的
2. git的基础概念
- 新建一个git仓库
- 跟踪文件,暂存文件
- 提交commit
- 分支(branch)介绍
- 合并-merge与rebase
- cherry-pick
- HEAD和相对引用
3. 远程仓库
- clone和origin
- 远程分支是什么
- fetch , pull & push !
4. 托管平台
- github
- gitlab
- gitea
5. 高级
- GUI
- git-gui
- vscode上的一些扩展
- lazygit
- 自建git服务
- gitea
- 参考
- pro git
- learngitbranching.js.org

View File

@@ -0,0 +1 @@
# 什么是版本控制系统(VCS)?

View File

@@ -0,0 +1 @@
# git是如何进行版本控制的

View File

@@ -0,0 +1 @@
# 新建一个git仓库

View File

@@ -0,0 +1 @@
# 跟踪文件,暂存文件

View File

@@ -0,0 +1 @@
# 提交commit

View File

@@ -0,0 +1 @@
# 分支(branch)介绍

View File

@@ -0,0 +1 @@
# HEAD和相对引用

View File

@@ -0,0 +1 @@
# 合并-merge与rebase

View File

@@ -0,0 +1 @@
# clone和origin

View File

@@ -0,0 +1 @@
# 远程分支是什么

View File

@@ -0,0 +1 @@
# fetch , pull & push !

View File

@@ -0,0 +1 @@
# github

View File

@@ -0,0 +1 @@
# gitlab

View File

@@ -0,0 +1 @@
# gitea

View File

@@ -0,0 +1 @@
# GUI

View File

@@ -0,0 +1 @@
# 自建Git服务

View File

@@ -0,0 +1 @@
# 参考

View File

@@ -0,0 +1,213 @@
# Web后端的简单介绍
这篇文章将带你学习构建一个Web后端的简单知识;作为一篇基础的教程,我们在教程里不会太多涉及诸如缓存,消息队列等高级内容,而是专注于基础的部分;我们也不会在一开始就涉及到具体的编程语言代码,而是将这篇文章作为一个理论性的介绍.你可能至少需要了解一些计算机的基础知识比如html等才可以了解文章中的一些概念.
## Web的历史
进行Web后端开发首先需要知道Web的一些概念实际上“后端”这个概念不是一开始就存在的随着人们对互联网需求的不断复杂化后端的概念才出现了我们首先来了解Web的发展历史
### 静态网页
互联网最开始只有静态网页所谓“静态”指的是网页中的内容是完全固定的在服务器端存储了内容固定的html,css或者是其他的什么文件用户访问网页就是通过互联网查看这些固定的文件。在这种情况下你访问一个网站从本质上更像是访问远端计算机上的某个文件夹
例如如果要建立一个网站那就在你的电脑上安装一个HTTP服务器比如apache,nginx在软件的设置里指定你电脑上的某个文件夹为网站的根文件夹然后去买一个域名网址的意思把域名的DNS绑定到你电脑的IP地址上那么其他人在浏览器上输入你的域名就可以访问根文件夹下面的内容了。比如在根文件夹下面放一个`index.html`,那访问域名时,浏览器就会默认显示这个文件的内容,可以在下面放一些图片,比如根文件夹下面有:
`/foo.jpg``/subfolder/bar.jpg`,那么别人在浏览器上面输入`http://yourdomain.com/foo.jpg``http://yourdomain.com/subfolder/bar.jpg`就可以访问到对应的文件。
这种方法很原始,但是如果需求不是很大的话,你也可以使用这种静态网页,你现在正在看的文章,其实就是一个静态的网页
这些访问都是通过HTTP协议来进行的在这里我们需要详细介绍HTTP协议以及HTTP协议的方法
#### HTTP协议
HTTPHyperText Transfer Protocol即超文本传输协议是一个网络客户端比如浏览器和服务端比如服务器当然普通的电脑也可以之间沟通的协议让浏览器可以对服务器上的某个文件进行操作最常见也是大家最熟悉的用途就是获取这个文件然后显示出来我们上面举的例子包括我们日常浏览网站的本质就是在获取服务器上面的内容(实际上HTTP协议可以做的不止这些下面会讲到)
一个完整的HTTP通信包含了请求和回应,请求有客户端发起,回应是服务端返回给客户端
##### HTTP的请求
严谨地说一个HTTP请求包含请求头(HTTP Request Header)和请求体(Request Body)一个HTTP的请求头主要包含了
- 目标网站:资源存在的网站,例如`example.org`
- URL,用于指定需要操作的是哪一个文件,例如`example.org/hahaha.txt`
- 方法用于指定操作即对URL指定的资源进行什么操作比如访问这个文件
- 自定义参数前面说的URL和方法都是通过键值对的形式存在于请求头上的作为请求头的参数键值对就是形如`a=b`的表达式你也可以自定义一些键值对在请求头里这表现为附加在URL之后的一系列键值对通过?开头,&分割,例如`example.org/hello.html?locale=zh-CN&custom=wuwuwu`,这就告诉服务器:两个参数:`locale=zh-CN,custom=wuwuwu`这些参数是可选的自定义的参数可以用于被后端解析现在不理解也没关系关于URL参数的话题我们在之后谈
- cookie:cookie是服务器放在浏览器里的一些临时缓存可以干一些事情当然需要有这个东西才会在请求头里带着我们也以后再谈
对于某些方法,需要在请求时向服务器夹带一些东西,请求体就是装载这些东西的
###### HTTP方法
HTTP方法定义了这个请求具体要对指定的文件做什么其中
- GET:获取指定的资源
- POST:上传指定的资源
- PUT:更新指定的资源,如果没有就创建一个
- PATCH:修改指定的资源
- DELETE:删除指指定的资源
- HEAD:和GET差不多但是只要求服务器返回回应头可以用在试探文件的大小上来判断文件的更新情况从而决定下一步操作
我们日常使用浏览器,比如在地址栏中输入`baidu.com`,其实就是在对这个地址做GET请求一般用户使用浏览器自己是不能做出除了GET之外的请求的但是其他请求在现代的网站中被经常使用这其实是前端脚本在工作以后会解释
如果使用某一些方法的话需要上传一些东西那么这些东西就需要放在请求体里面比如POST等
##### HTTP的响应
其实回应也分为回应头和回应体,回应头主要包含:
- 状态码针对请求的回应有对应的状态比如如果GET请求没有问题成功返回的话就返回200 OK状态码如果找不到请求里对应的文件就会返回`404 Not Found`
- 内容格式:向浏览器说明回应体(若有)是什么格式的,文本文件的编码设置等比如html文件图片这决定了浏览器如何对待这些文件
- 内容的大小:返回所请求资源的大小(若有)
回应体就是包含了回应的主体内容了如果是GET请求的话那么就回应了所GET文件的内容如果是其他请求的话可能也会没有回应体具体看使用的方法
##### 一个例子
`GET`方法从服务器获得一个资源我们在浏览器的地址栏输入一个地址时就是在对这个URI做`GET`请求,前面的例子也是通过`GET`方法来进行的。
比如,发送`GET developer.zsxyww.com/test/test.txt`,那么就会把我们服务器上的test.txt这个文件发过来
`POST`方法向服务器上传一个资源,例如使用某个客户端发送`POST http://example.org/someprogram.exe`在request body里面带上你的这个文件那么`example.org`网站的根目录下就会多出一个叫做`someprogram.exe`的文件
除了上面介绍的这些方法,还有`DELETE`,`PATCH`等方法,分别对应了删除,修改一个资源,你可以在你的电脑上通过`curl`等程序,或者通过浏览器控制台来进行常规的`GET`之外的方法请求
:::tip 提示
httpbin.org 这个网站可以让你试验HTTP协议的方法
:::
不管使用的是什么方法HTTP协议传输的对象都是一些固定静态的文件这些文件的内容是什么就是什么不会变化这样的网页就叫做静态网页。
### 动态网页
这样的网页是不能满足大家对互联网的需求的举例子来说淘宝上有数不清的商品在售卖如果淘宝为每一个商品都在服务器目录下面创建一个html文件好让大家通过访问`http://taobao.com/someproduct.html`来查看商品信息,那这个工作量就非常大了,还有一些更重要的问题:这样的网页,基本上没有交互的功能,我们希望用户可以点击按钮就能购买商品,商家填写表单就能上传商品
#### CGI
这些都是静态互联网无法解决的问题所以程序员们开发了一个叫CGI(Common Gateway Interface,通用网关接口)的技术这种技术在用户请求网站的内容时让一个脚本劫持用户的请求返回给用户一个脚本动态生成的html文件比如如果用户想知道报名数据库里面目前所有的报名人员发送`GET http://example.org/allVolunteer.html`CGI程序发现给本机请求`allVolunteer.html`这个文件,并且程序的代码里写了:如果接受到对`/allVolunteer.html`的请求那就去查找数据库里面的全部报名人员并将返回结果插入到一个模板html文件中。程序返回这个文件于是用户就受到了CGI程序动态产生的html.
虽然CGI现在很少见了但是将一个发送到服务器的地址请求劫持到脚本函数上是现代动态网站的常用思路。
#### JavaScript
除了服务器浏览器也在为适配动态网站而更新。在1995年网景公司的员工发明了一种编程语言叫做"JavaScript",这是对当时新兴的Java和Java Applet的回应这种语言最大的特点就是它被设计在浏览器中运行并且可以调用相关接口来操作页面htmlcss内容和进行HTTP请求他们让自己家的网景浏览器率先支持了这种编程语言(这个浏览器就是火狐浏览器的前身),这极大的提高了浏览器对于动态网页的支持。
#### AJAX(Asynchronous JavaScript and XML)
尽管是在浏览器里的语言但是作为一个完整编程语言的JavaScript还是非常强大的在有了操作DOM,发起HTTP请求的能力后JavaScript,搭配一些后端的程序可以做到CGI传统动态页面没有办法做到的功能动态更新用户html页面上的内容。传统的后端CGI,可以动态生成html,但是这个html生成之后到用户的手里还是不会变化的而JavaScript作为一个编程语言,通过运行在用户浏览器,可以操作html内容和发起HTTP请求便可以自己异步地对服务器发送一些请求依据这些内容便可以部分改变用户浏览器所显示的HTML,CSS只需要浏览器重新渲染一遍就行了这种技术就叫做AJAX,Asynchronous JavaScript and XML
AJAX与传统动态页面的不同点是在获取新数据时不是刷新全部的页面而是让JavaScript操作页面的部分内容。同时后端也不是返回html而是返回一些可以被JavaScript理解的序列化数据例如纯文本、XML,JSON等前端的脚本根据这些数据来操作用户的html
##### 例子
比如在浏览我们的wiki网站时虽然我们的wiki是静态网页你会发现页面的大部分元素都是重叠的比如页面最上面的导航栏sidebar,页脚等样式也是一样的在切换不同的页面时每次获取html都要重新获取这些重复的部分这样就造成了一些浪费如果使用AJAX技术那么只需要第一次打开网站的时候加载这些框架性的元素然后再加载一个JavaScript脚本点击sidebar的时候就将那个文章的内容本身拿过来然后替换掉原有的页面内容这样就更加节省这种部分更新页面内容而不重新加载整个页面的技术就叫做AJAX
再举一个例子,比如我们的报名系统有一个查询功能如果输入的用户在数据库存在的话返回这个用户的全部信息如果不存在那么要给用户显示一条错误信息这种信息如果要单独给用户发送一个新页面的话是很麻烦的用户端的体验也不好我们希望在按下查询按钮之后直接在原来的页面旁边显示服务器返回的结果如果没有AJAX技术那么我们只能把用户的当前页面重新发过去但是把查询结果也放里面因为传统没有JavaScript的网页没有办法对数据进行一些简单的操作只是被动的渲染html.css文件而AJAX技术就允许我们直接把返回的数据本身发送到客户端而且发送的数据也不止局限于HTML,CSS,而可以是一个XML,JSON,或是直接返回状态码,让客户端脚本负责解析这些数据,并将这些数据变成浏览器其他部分可以直接渲染的文件
当一个URL不是返回一个HTML数据而是返回一些不是给用户本人准备的数据时当这些路径不止于接受GET请求时这些路径就和我们传统静态网站的URL代表一个文件时所表现的路径有所不同了
这些后端路径不是给用户设计的通过浏览器直接访问这些地方大概会返回一些用户难以读懂的代码他们是给JavaScript,或者另一种程序设计的这种路径就叫做web API他们是两个程序通过HTTP交互的地方而不是人机交互的界面我们先举一个例子再解释这个问题
:::tip 提示
AJAX技术在今天已经非常常用了以至于很多人都意识不到他们在使用AJAX技术
:::
##### 一个AJAX报名系统的例子
下面举一个例子来详细说明AJAX的工作原理用户需要通过一个网页进行某项活动的报名填写个人信息然后点击网页上的提交按钮服务端会返回报名的结果成功还是失败与传统的方法不同服务器返回信息时不是重新返回一个HTML,而是让浏览器直接在原有的界面上(比如提交按钮的下面)显示报名的状态
用户通过浏览器输入地址,使用`GET`方法发起对`http://example.org/submit.html`的请求服务器获得请求后在root目录下面找到submit.html文件,浏览器得到文件后开始解析渲染这个文件发现这个html在头部又要求浏览器向服务器获取`submit.js`文件,于是浏览器不需要用户处理自己又发送了一条`GET`的HTTP Request,并且执行返回的脚本这个脚本的内容是监听html文件中提交按钮的“点击”事件当按钮被点击时执行某个函数。
返回的html文件包括了提示框要求用户输入姓名手机空闲时间等信息在这些输入栏的最下面有一个提交按钮当点击这个按钮时脚本就会被激活脚本执行的函数将读取用户从上面输入进来的内容做一些简单的认证比如说手机号的格式等然后将这些信息组织成一个XML文件当然,AJAX中的X就是XML咯现在其实也可以用其他的方法序列化比如JSON什么的向服务器发送一个`POST`请求,地址是`http://example.org/api/submit/submit.php`,在请求体中包含刚才的XML文件。
服务器在接收这个请求后,就会将,这个请求的上下文全部转交给`submit.php`这个脚本脚本再做一些工作录入数据库如果一切都成功了就向客户端发送回应成功反之则回应失败的消息回应的内容可以是一个纯文本或者直接是状态码比如就返回一个JSON:
```JSON
{
"status":"success",
"submit":{
"name":"小明",
"freeday":"2023-11-25",
"phone":10000000000
},
"createdAt":"2023-10-25_9:23:22"
}
```
在JavaScript脚本接收到回应后根据返回的内容操作html文件的内容在提交按钮的下面一行插入一个文本块
```HTML
<div id="json_responses">
<p id="json:status">提交成功!你提交了:</p>
<p id="json:submit.name">姓名:小明</p>
<p id="json:submit.freeday">空闲时间2023-11-25</p>
<p id="json:submit.phone">手机号10000000000</p>
<p id="json:createdAt">服务端提交创建时间2023-10-25 9:23:22</p>
</div>
```
或者其他的信息
#### URI在现代的意义
从刚才的这个例子中我们可以看到网站的URI,其实慢慢的不止可以指代一个文件了,他更多的是指代一个资源,或者一个业务,向`submit.php`提交一个`POST`请求,难道是在远端创建一个`submit.php`程序?其实在这里更多是指将客户端的数据上传到这个`/api/submit/submit.php`的业务窗口,我们的后端开发也是建立在这种对虚拟的路径的请求下的。例如我们设计一个报名系统我们可以设计一个API接口叫做`POST http://api.yourwebsite.io/newVolunteer`,接受浏览器js的报名信息提交在服务器根本就没有`/newVolunteer`这个文件,连文件夹都不一定会有,全靠路由在工作(见下篇文章)
### Web应用
#### WebSocket
HTTP的动态网站已经很好了但是协议本身有一个缺点:一个HTTP连接分为请求和响应只能由客户端发起请求服务端返回响应如果客户端没有先发一点什么给服务端的话服务端是没办法先给客户端发信息的这就给一些更加复杂的要求增添了障碍比如通过浏览器和别人聊天需要接受来自服务器发给你的其他人的聊天的信息或者是在浏览器上玩游戏需要和服务器交换数据。这可以通过轮询来解决但是这样还是不方便。
WebSocket是一个全新的协议支持客户端和服务器的全双工通信即客户端和服务器都可以主动地发消息而且可以同时进行而且是采用较小的数据帧格式降低了网络开销提高了数据传输速度。WebSocket在建立连接后保持长时间有效不需要为每次消息发送重新建立连接因此效率更高。
为了兼容HTTP协议WebSocket也是监听80和443端口(HTTPS),握手采用了HTTP协议通过升级协议来建立连接如果可以升级服务器会返回101状态码升级连接.
:::info 信息
对于WebSocket过于详细的介绍超出了本篇文章的内容可以自行了解
:::
##### Server-Sent Events(SSE)
WebSocket是一个全新的协议兼容性可能不是那么好如果要求比较低的话可以看一看Server-Sent Events,这个协议基于HTTP,允许服务器主动给客户端发送信息,当然也请自行了解。
#### 在Web上运行应用
传统观念里一个应用程序是在计算机上直接运行的但是在介绍了上面的技术之后我们可以想到在Web上也是可以运行应用程序的通过现代的高性能JavaScript运行时可以提供类似于原生的运行速度通过WebSocket,可以快速的更新内容现在的HTML和CSS也足够强大用户的机器性能也越来越强了而且开发Web应用可以直接使用成熟的Web技术栈在浏览器中运行也更安全以至于现在很多本地的应用也开始使用Web技术了(electron)。
例如我们所使用的腾讯文档支持多人协作编辑就使用了WebSocket技术来向你主动发送其他人对文档编辑的信息
#### 单页应用(SPA)
一个现代的网站或者说一个提供服务的Web应用流行单页应用架构顾名思义服务器只会在用户打开网页时加载一段html文件后面的全部内容都是通过js动态更新的js和服务器的后端接口交互主要是采用AJAX,对于某些复杂的需求可能会需要使用前面的技术WebSocket或者SSE
`React.js`就是贯彻单页应用思想最彻底的前端框架,单页应用的坏处就是打破了为静态网页文件设计的“收藏”功能和前进后退也不利于SEO和无障碍因为用户在网站上只打开一个网页网页的内容根据用户操作由浏览器脚本动态更新而生成的html也大多没有做语义化优化难以被理解和解析
SPA的例子就是邮箱应用比如Gmail,通过浏览器访问你的邮箱通过邮箱的主页面点某个邮件你并没有进入一个新的页面而是在原有的页面上内容变成了邮件查看的界面如果在主页面上点击发件的话同样也没有一个发件页面而是直接呈现发件的UI
有时候通过AJAX调用API的HTTP交互没办法满足一些需求比如说服务器主动推送信息或者流式传输比如直播平台游戏等这个时候就需要使用前面提到的技术前面的腾讯文档就是一个例子还有就是网络聊天室matrix之类需要向浏览器主动推送信息还有直播平台需要将源源不断的多媒体数据传递到用户那里还有网络游戏需要快速在浏览器和服务器之间交换游戏数据但是一般这些应用的基础框架都是建立在传统AJAX上的只是业务部分采用其他协议实现这些现代的应用慢慢地将计算量转移到了前端而后端只负责存储和提供查询数据甚至后端都不用负责产生html,只需要提供API,来为前端提供数据就行
##### WebAssembly
WebAssembly是最近新出现的技术他允许开发者将C/C++ , Rust等原本的一些编译型语言编译成浏览器可以执行的字节码使得在浏览器中也可以执行这些程序目前也有一些使用WebAssembly的应用可以去看看最大的好处就是不会JavaScript也能开发前端也可以复用以前的代码当然这个其实是前端的内容
## Web后端-是干什么的?
前面用非常长的一段文字来介绍Web的发展历史就是为了说明Web后端是干什么的或者说编写一个Web后端需要干什么
如果你想写一个静态网站那么简单的http服务器就可以满足你不需要你手动写什么代码如果你想写一个基于AJAX的服务比如我们网维现在的报修系统那么你需要设计好API,和前端沟通好序列化相关事项或者是返回JSON信息什么的让前端处理还是返回html让浏览器渲染;如果你想写一个WebSocket的Web应用那就要难一些了可能需要掌握一些并发编程的知识才可以写出一个可以使用的服务
我们接下来的教程将注重开发一个现代的AJAX后端服务同时辅助提供一些静态文件托管的功能。
### Web后端的组成
一个Web后端主要由以下部分组成
- 路由(router)
- 处理(handler)
- 数据库/ORM
- 鉴权
- 模板(如果需要)
详细的信息,请阅读下一篇文章:[Click Me](./基于HTTP的Web后端的组成)
:::tip 提示
读完这篇文章之后,你可以回顾文章里的内容,问一问自己:
- Web经历了哪些发展阶段
- 前后端之间是如何使用HTTP协议交互的
- AJAX技术是什么是如何支撑起现代的网页的(单页应用)
推荐在看下一篇文章之前看看下面的参考文章
:::
## 参考
在读完这篇文章后你可以去详细阅读这篇文档https://developer.mozilla.org/zh-CN/docs/Learn/Server-side/First_steps/Introduction (**强烈推荐!**)
这里是关于HTTP协议的详细介绍https://developer.mozilla.org/zh-CN/docs/Web/HTTP

View File

@@ -0,0 +1,156 @@
# 基于HTTP的Web后端的组成
一个基于HTTP的Web后端通常有以下部分组成:
##### 路由系统(router)
路由系统负责处理用户访问网页时的请求路径/方法,并转交给对应的处理者
##### 处理者(handler)
处理者负责处理用户的请求读取用户在URI中的参数和请求体中的内容如果有统称为上下文(Context),负责返回请求所对应的回应
有的系统还会继续细分,将业务层和接口层分开(这种情况下通常接口层是和路由功能合并的)
_最低要求是这个另外通常一个后端系统还需要连接一个数据库:_
##### 数据库
通常是兼容SQL协议的关系型数据库负责存储后端所需要用到和产生的信息
_其实很多后端系统无非就是对数据库的增删改查(所谓的CRUD),可以说这些系统就是数据库的一层方便wrapper_
##### 鉴权系统
通常,我们系统的内容不打算对互联网上的任何一个人开放,所以我们需要一些方法来验证访问者的身份
##### 模板系统optional
如果你打算通过后端渲染HTML返回到用户浏览器那你需要一套模板来方便地将动态内容插入到模板里面返回给用户如果是一个纯粹API的站点还是想直接把工作甩给前端你就可以不用配置模板
此外,还有一些外围的工作:
##### 反向代理
通常我们的Web后端服务不是直接暴露对外访问的而是经过一层代理的转发这样更加的安全配置也更加简单服务只需要监听本地端口
##### 配置系统
你的系统需要读取配置,比如监听端口,数据库连接,还有其他服务的密钥等
##### CI/CD
自动化配置构建,部署,测试等工作,让你专注代码工作,而不用把心思过多地放在部署构建这些工作上面
## 路由
假设你的一个报名服务架设在`service.io`上:
首先,用户访问这个网址时需要显示一段欢迎文字,然后将他们引导到报名的页面
那么,你应该在用户访问`/`时返回一个html文件里面含有导向`/volunteer.html`的超链接
`/volunteer.html`里面的前端代码需要以AJAX的形式与后端API交互比如
`service.io/api/register`接受POST请求前端上传报名人的信息后端录入数据库,并返回录入的信息全部以JSON序列化
`service.io/api/view`接受GET请求让这个报名人查看自己的报名信息返回JSON格式
`service.io/api/cancel`接受POST请求取消某个报名人的信息成功则返回相应状态码
`service.io/admin/viewAll`让管理员查看当前的所有报名接受GET请求
`service.io/admin/cancel`让管理员取消任意的报名,接受的POST
在现代网站设计中,我们不是在根目录下面创建对应的文件(实际上,连根目录都不需要了),我们使用一些叫做“路由器(router)”的模块,当用户通过一定的方法请求一定的路径时就把这些请求转交到相应的handler
### URI参数
参数在正常路径后面,以?开始,以&分割,以键值对的形式存在
例如:`service.io/api/register?name=小明&phone=10000000000&freeday=2024-9-25`
这样的参数可以被许多后端框架使用内置的解析器解析
### 参数化路径
这种路径通常是配合REST风格的接口来设计的比如
`service.io/api/users/小明`
类似于这样的路径,许多后端框架可以使用`service.io/api/users/:user`这样的形式来匹配在转交给的handler中可以读取`:user`参数,从而返回参数所指定的资源
### API设计
API的设计包括了路径的设计和接口格式的设计一般小项目可以相对地随便一点但是大项目还是需要认真一点的
#### 传统
我们刚才所举的例子就是一个传统的API设计一个路径就对应了一个业务点一般只会使用`GET``POST`来对应获取和上传,前后端的交互一般在文档里自行约定,或者采用内置的表单(如果数据比较简单的话)
#### REST
REST的意思是“表现层状态转换”英语Representational State Transfer缩写REST这种风格的要点是一个URI表示一个资源而不是一个业务同时充分地利用HTTP方法
例如,我们在前面定义了`Register`,`View``Cancel`三个API,如果是要上传什么就用`POST`,获取`GET`,一个路径表示的是一个业务而不是系统的某个资源下面来看看REST怎么写
`POST service.io/api/users/小明` 用户小明提交一个报名,具体的报名信息在请求体里,这将在数据库里面创建一个小明的报名记录
`GET service.io/api/users/小明` 用户小明查看自己的报名信息
`DELETE service.io/api/users/小明` 取消小明的报名
`PUT service.io/api/users/小明` 修改小明的报名信息,新信息放在请求体里面了
可以发现REST风格的API可以看作是对传统静态网页互联网的回归这种风格直观简洁兼容性更好更加利于缓存等
#### GraphQL
GraphQL是一种用于API交互的查询语言他意图解决接口格式定义和多次查询带来的复杂问题
首先后端需要支持GraphQL,然后前端需要在API请求中注明自己想后端用什么格式呈现什么想要的信息这样就不需要前端多次请求不同的业务了
这对大型系统或许比较友好,但是如果只是一些小项目的话,这可能有些复杂,具体可以自己去了解
## handler
handler可以说是一个后端系统的核心了因为他们是实际处理业务的地方
### 面向对象与模型
虽然可以使用其他的范式但是最推荐的是依据OOP的原则将需要处理的模型写成对象将一系列操作写成对象的方法
例如,报名系统本质上就是处理“报名人”这个对象的各种操作,我们可以定义:
```Go
type Volunteer struct{
config.DB
id int
Name string
Phone int
FreeDay time.Time
Note string
}
func (v *volunteer)Add()error{
if err:=db.addVolunteer(v.MainConnection) err!=nil{
return err
}
return nil
}
```
要设计一个登记报名的handler,就只需要将前端发过来的信息反序列化到Volunteer对象里然后调用Add方法即可这种思路就叫做面向对象
所设计的Volunteer和他的一系列方法就叫做“模型”
## 数据库
数据库为后端的业务数据提供了方便的存储和查询服务,这里指的是结构化数据,其他需求可以去看高级教程
### SQLite
这是个轻量级的数据库,一个数据库就是一个文件,通常用于业务量比较小的场景或者是本地开发的场景
### PostgreSQL
这个可以说是目前最厉害的开源数据库了,不仅提供了常规的结构化功能,而且对于一些简单的非结构化存储需求也可以胜任,但是本身的资源消耗是有点高的
### 选择数据库的各种考量
- 业务量如果业务量比较小的话就使用SQLite吧
- 兼容性:如果现有的环境和业务依赖于某个数据库,那么就继续用吧
### ORM
ORM是对数据库的一层抽象让你专注于业务逻辑的开发而不用担心具体的数据库问题如果对于性能或者其他的方面没有很大的需求的话建议在你的项目里使用ORM
## 鉴权
### Session
### JWT
### OAuth2.0
## 模板
### Jinja2

View File

@@ -0,0 +1,11 @@
# 高级教程
本篇是Web后端的进阶系列文章
## 缓存
### 为什么我们需要缓存?
对于某些需要高频读写的数据,放在数据库中的速度会比较慢,所以我们需要一个缓存俩提供快速访问,这些缓存通常放在内存中,提供最快的访问速度
### Redis 和 Memcached
## 消息队列
## 日志与监控
## NoSQL与非结构化数据

View File

@@ -0,0 +1,21 @@
# 后端API服务
## 介绍
该项目作为网维的统一后端API接口而设计连接网维的数据库并提供一系列接口给前端以支持网维日常的业务逻辑其他开发人员可以直接调用这些接口从而专注与前端以便于降低整个系统设计的复杂度
该项目采用Go语言编写Web框架采用echo,ORM框架为gorm,
## 项目地址
https://github.com/ZSCNetSupportDept/zscnetworksupport-api
## 构建
要想构建该项目,你需要安装`Go``make`,在一台linux机器上构建
输入`make install`即可安装本项目的依赖,而不构建
输入`make build`即可构建该项目,项目放在`make`文件夹下
## 部署
只需要把可执行文件放在生产环境下运行即可,本项目可能会提供一些静态文件访问,需要将`static`放在与可执行文件相同的目录下
## 配置
程序接受,且只接受一个参数,为配置文件的路径,关于配置文件的格式,请参照“配置”一章
## 运行
运行后程序会将日志和错误文件输出到stdout中你可以配置系统服务来使程序开机自启动将输出定向到日志或者stderr里
在运行程序之后你还要配置一些反向代理的软件来将流量导向程序所监听的端口你还要定期续期https证书以保证https访问

View File

@@ -0,0 +1,13 @@
# 配置
# 介绍
配置为一个`json`文件,其中,各个字段的定义如下:
`port`:一个数字,为程序所监听的端口
`database`:
- `Type`:一个字符串,指定了所使用的数据库的类型,需要在`MySQL` `PostgreSQL` `SQLite`中选择一个
- `Path`:对于SQLite填写数据库的位置对于其他的数据库填写URL
- `Port`:数据库所监听的端口SQLite可以不用填以下也是
- `User`:数据库用户名
- `name`:数据库名称,
- `Password`:数据库密码

View File

@@ -0,0 +1,22 @@
# 结构
仓库项目的结构如下:
`main.go`:项目程序的起点,从此处开始运行
`config`:存放了读取配置,提供配置变量相关的代码
`databases`:提供了连接数据库相关的代码,提供主数据库连接变量(Usingdb)
`handlers`:为handler的存放地点一类业务为一个对象handler作为其方法实现
`model`:业务所采用的模型,定义了一个业务对象的存储和相关方法
`use`:在这里注册所有需要提供的API和中间件,程序将使用这里的配置
`make`:存放了构建所产生的程序
`static`:存放了静态文件以进行路由
## 原理
当程序运行时:
main()将调用sysinit(),读取参数中的配置,将配置记录在全局变量`config.UseConfig`

Binary file not shown.

View File

@@ -1,18 +1,51 @@
# 网络维护科wiki首页
:::tip 提示
**至手机用户:点击页面左上角的三条杠打开导航栏,以浏览本站**\
**推荐使用电脑端访问**
:::
## 介绍
这里是中山学院网络维护科wiki,记录了网络维护工作的相关知识wik的内容都是历代网维的成员整理总结的你也可以贡献自己的内容
这里是中山学院网络维护科wiki,记录了网络维护工作的相关知识wiki的内容都是历代网维的成员整理总结的,你也可以贡献自己的内容
:::warning 注意
本wiki还在大量开发中许多条目可能会不完善或者缺失仅供开发组组员和正式成员测试参考使用,如果你对wiki的编写和维护感兴趣可以访问我们的[github源代码仓库](https://github.com/ZSCNetSupportDept/website),具体的细节请联系开发组组长
:::
## wiki的内容
**wiki基本由以下部分组成**
### 技能
修网所要掌握的各种技能
进行网络维修需要掌握的技能
### 基础知识
修网的基础知识
有关校园网络以及相关概念的基础知识
### 片区介绍
我们需要维护的片区,以及在这些片区值班的注意事项
记录了我们需要维护的片区的信息,以及在这些片区值班的注意事项
### 故障介绍
当网络发生故障时,客户端通常会返回一个错误码,来提示可能发生的错误,这里,按照运营商分类,介绍常见的故障错误码,**如果你遇到的故障在这里没有收录请转到旧版wiki**\
提示:对于电信客户端,可以用客户端自带的修复软件来修复
### MacOS修理指南
### [MacOS修理指南](./MacOS修理指南)
MacOS的修理事项
### [资源](/docs/wiki/资源)
我们在这个网站上存放了一些可能会有用的资源,以方便大家下载,如果你有资源想要上传的话,可以联系开发组
### [杂项](/docs/wiki/杂项)
这里是一些不便于归类的文章的收纳处,如果你的文章不太好归类,可以放在这里
## 旧wiki
这里是新版wiki,但是旧版wiki依然可用你可以通过[wiki.zsxyww.com](https://wiki.zsxyww.com) 来访问,上面还有没有迁移的许多旧文章,我们目前在逐步转移这些文章
## 贡献
如果你想为本wiki添砖加瓦可以在仓库里PR:[wiki的github仓库](https://github.com/ZSCNetSupportDept/website)
:::tip 提示
对于新手如果wiki不能解决你的问题和其他疑惑可以随意向组长科长,api,或者其他人请教我们也会加油完善wiki的
:::

View File

@@ -1,11 +0,0 @@
# 查看ip
许多情况下检查故障的第一步就是查看用户在局域网中的ip,以进行进一步判断本文将教会你如何查看ip,以及不同的ip地址意味着什么
## 操作
1. 打开cmd界面你可以按win+r弹出运行框输入cmd,然后回车
2. 在cmd提示符后输入`ipconfig`命令,此时应该会输出结果
3. 根据结果进行下一步操作
## 结果
### 无地址
### 172.xx.xx.xx地址
### 169.254.xx.xx地址
### 192.168.xx.xx地址

View File

@@ -0,0 +1,20 @@
# 查看ip
许多情况下检查故障的第一步就是查看用户在局域网中的ip,以进行进一步判断本文将教会你如何查看ip,以及不同的ip地址意味着什么\
我们的负责范围是以太网连接所以这里的ip更多的是指以太网ip,关于F-Young的路由器ip,同理
## 操作
1. 打开cmd界面你可以按win+r弹出运行框输入cmd,然后回车
2. 在cmd提示符后输入`ipconfig`命令,此时应该会输出结果
3. 根据结果进行下一步操作
## 结果
### 无地址
检查物理连接
### 172.xx.xx.xx地址
16是移动\
17是联通\
18是电信\
如果出现问题检查ip的运营商和用户注册的运营商是不是相同的如果不同那可能是线路接错了
### 169.254.xx.xx地址
这个地址是ip分配失败时的保留地址如果DHCP服务运行失败电脑就会默认分配了这个地址好像这个现象一般不会影响正常网络连接如果没问题就不需要管\
有人反馈说usb2.0的转接口也会导致这个问题,我在[这里](/docs/wiki/杂项/关于169.254.x.x的ip问题汇总)开了一个专题页,你们可以把遇到的情况记录在这里
### 192.168.xx.xx地址
学校有线网的ip是172的如果出现了192.168地址检查用户有没有连接wifi,如果用户和机房之间还有路由器的话,检查路由器工作模式

View File

@@ -0,0 +1,6 @@
# 检查操作系统网络设备
一台电脑可以有多个网络设备这些设备可以是具体的也可以是虚拟的例如一个以太网口可能对应一个网络设备一个Wi-Fi连接也是一个网络设备一个VPN隧道也是一个网络设备这片文章教你如何查看Windows操作系统中的网络接口设备
## 操作
1. 打开“控制面板”
2. 选择“网络和Internet”
3. 在右侧打开“网络和共享中心”选项,再点击“更改适配器设置”

View File

@@ -0,0 +1,11 @@
# 拨号
本文章教你如何使用PPPoE 拨号上网\
注意如果用户运营商是电信请使用电信专用client拨号本教程只适用于联通和移动校园网宽带
## 操作
1. 在“开始”菜单中点击“设置”
2. 点击"网络和Internet",在左侧点击“拨号”
3. 点击“设置新连接”,点击"宽带(PPPoE)"
4. 输入账号和密码
5. 测试连通性
## 用户的账户格式和默认密码
取决于用户的运营商,具体信息看这里:[链接](/docs/wiki/基础知识/学校内的运营商)

View File

@@ -0,0 +1,58 @@
# 做网线
当网线损坏时,我们需要重新制作网线,通常是更换网线的水晶头,本篇文章就是教你如何打水晶头的
## 工具
- **网线(双绞线)**通常是CAT5e或CAT6的网线。
- **RJ45水晶头**:用于连接网线的标准接口。
- **网线钳**:用于剥线、压线和剪线的多功能工具。
- **剪刀或剥线工具**:用于切割和剥离网线外皮。
- **寻线器**:用于测试制作好的网线是否正常工作。
## 操作
### 准备工作
1. 测量并切割网线:根据实际需要的长度,使用网线钳或剪刀剪下适量的网线。留出一点余量以防止错误。
2. 剥离网线外皮用网线钳或专用剥线工具剥离网线的一端外皮剥离长度约为1-2厘米露出内部的八根细线。注意不要伤到内部的细线。
### 整理网线内部的线对
网线内部通常有四对不同颜色的线,每对线由一条实色线和一条相应颜色的白色线组成。
按照**568B线序**,将网线从左向右排列好
568B线序为**橙白,橙,绿白,蓝,蓝白,绿,棕白,棕**
将这些线按顺序排列整齐。可以轻轻拉直每根线,以减少弯曲,使它们更容易插入水晶头。
### 修剪并插入到水晶头
1. 修剪线头将所有线头排列整齐用剪刀或网线钳将线头剪齐留下大约1厘米的线头。
2. 插入水晶头保持线的顺序将八根线按顺序小心地插入RJ45水晶头中。插入时确保每根线都到达水晶头的顶端。**水晶头的金属触点应该朝上,锁扣朝下。**
### 压接水晶头
将水晶头放入网线钳:确保线头已经插到水晶头的最顶端,并且没有松动。将水晶头插入网线钳的压线口。
压接水晶头:用力握紧网线钳,直到听到“咔哒”一声,确保水晶头内部的金属片刺入每根线芯,完成接线。
### 测试网线(可选)
打开寻线器,调整到对线模式,将制作好的网线插入测试仪的两端,检查是否有任何断线或错误连接。
## 注意事项
- 检查线序:在线插入水晶头之前,务必再三确认线序是否正确。
- 剥线时小心:避免剥线时过度用力,损坏内部细线。
- 保持线头整齐:确保线头整齐一致,以保证每根线都能够正确接触到水晶头的金属片。
## 关于线序
以太网连接的线序常见分为TIA/EIA-568A和TIA/EIA-568B两种区别如下
568A:白绿,绿,白橙,蓝,白蓝,橙,白棕,棕
568B:白橙,橙,白绿,蓝,白蓝,绿,白棕,棕
以前网线会有交叉线,平行线的分别:
网线一头做成568B,一头568A,就叫做交叉线,通常用于两台同级计算机的互联
网线的两头都是568B,就叫平行线,通常用于计算机和交换机,路由器等上级设备的互联
现在的网线都是做成平行线计算机会自动识别网线的线序并处理做成T568B就好

View File

@@ -0,0 +1,2 @@
# 重做端口
端口的制作和网线的制作差不多,在整理线序是就不需要按照顺序排列了,端口上有对应的颜色,把网线按进去就行。

View File

@@ -0,0 +1,13 @@
# 解绑MAC地址
学校的网络会绑定设备的MAC地址来限制上网的设备如果我们更换了转接头或者电脑设备的MAC地址就会变化运营商就会返回691错误就需要我们解除对MAC地址的绑定
## 操作
- 用开通宽带的手机号码拨打运营商电话,转人工;
- 告诉客服,说:清除本机号码绑定的宽带的端口数据;
- 等待客服回复“已清除”;
- 告诉客服,说:解绑;
- 可能会需要服务密码,如果用户记得服务密码可以使用服务密码,否则交给用户报一下身份证号码;
- 等待客服回复“已解绑”
- 拔下网线,等待 20 ~ 30 秒后插上;
- 拨号,一般可以完美解决;
- 如果不行,可以重新拨打电话操作。

View File

@@ -0,0 +1 @@
# 技能

View File

@@ -1 +0,0 @@
# 打水晶头

View File

@@ -1 +0,0 @@
# 解绑端口,刷新数据

View File

@@ -1 +0,0 @@
# 重做端口

View File

@@ -0,0 +1,2 @@
# 片区介绍
这里是学校宿舍网络的几个片区的有关信息

View File

@@ -1 +0,0 @@
# 片区介绍

View File

@@ -1,12 +1,15 @@
# 东门片区信息
范围12-15 20-22栋
## 集合点
**12栋楼下**
## 网络结构
### 线路
用户端口连接到宿舍的路由器,路由器主线连接到楼层机房(机房好像进不去)
对于24新生的宿舍已采用了FTTR架构(10栋)
### 运营商
电信
### 其它
暂无
## 注意事项
暂无
部分房间可能会有AP,如果用户说网速很慢可以先看主线连接的是不是AP

View File

@@ -1,10 +1,12 @@
# 凤翔片区信息
范围1-6栋
## 集合点
**值班室门口**
## 网络结构
凤翔的网络设备比较古老
### 线路
用户的端口连接到楼层的交换机,位于天花板上,要爬梯子
用户的端口连接到楼层的交换机,位于天花板上,要爬梯子 \
电信在这中间还会有一个小交换机
### 运营商
电信,移动
### 其它
@@ -14,6 +16,8 @@
记得带梯子去值班,不管有没有单,每天下班时都要拍一张梯子的照片给值班组长
**记得拍梯子!!**
电信机房并不是每一层都有的.\
宿舍床位有两个端口,如果上面的标识难以辨别哪个是移动,哪个是电信的话,可以顺着电信小交换机的端口找到哪个是电信端口,剩下的就是移动端口了.

View File

@@ -1,4 +1,5 @@
# 北门片区信息
范围7-11栋
## 集合点
**10栋门口**
## 网络结构

View File

@@ -1,9 +1,12 @@
# 朝晖片区信息
范围:朝晖苑
## 集合点
**朝晖楼门口**
## 网络结构
### 线路
用户端口直连配线架,配线架连接到交换机,没有床位表格,需要手动寻线
对于24新生的宿舍已采用了FTTR架构
### 运营商
电信,移动
### 其它

View File

@@ -1,9 +1,12 @@
# 歧头片区信息
范围17-19栋
## 集合点
**19栋门口**
## 网络结构
### 线路
用户端口连接到宿舍的路由器,路由器主线连接到楼层机房(机房好像进不去)
电信对于24新生的宿舍已采用了FTTR架构
### 运营商
电信
### 其它

View File

@@ -1,8 +1,12 @@
# 香晖片区信息
范围:香晖苑
## 集合点
**香晖片区范围比较大分为两个小组值班AB组在AB栋闸机处集合,CD栋同理。**
## 网络结构
### 线路
电信用户连接宿舍路由器如果路由器LAN口不够会连接旁路交换机路由器WAN连接机房交换机\
对于24新生的宿舍已采用了FTTR架构
用户的端口直接连接到弱电室的配线架,再经配线架连接到交换机,交换机处有床位对应表格,
### 运营商
三大运营商都有服务,在维修时注意交换机不要接错

View File

@@ -17,10 +17,16 @@
**对于教学区公共Wi-Fi:**\
使用“掌上连峰”APP连接
## 拓扑
校园网的拓扑结构
## ip与运营商
学校宿舍网络为每一个床位提供一个内网ip,其中:\
172.17.x.x为移动\
172.18.x.x为联通\
172.19.x.x为电信
<!-- 总的来说学生宿舍网络为星型拓扑运营商的光纤接入各个宿舍楼在各个楼层的ONU处转换成电信号接入交换机再分散到各个宿舍的各个床位中间可能还有配线架宿舍路由器等设备\ -->
<!-- 另外电信还在部分片区提供了F-Young无线网络服务 -->
### 电信
电信是学校的主要运营商在各个宿舍片区都有提供服务目前电信主要是光纤接入楼层然后通过ONU和交换机变成电信号转到各个宿舍的路由器启用了Wi-Fi功能然后再接入床位的端口有的路由器可能路由器LAN不够还会再接一个交换机
电信有计划逐步升级到光纤入宿舍(FTTR)的模式在这种模式下将光路接到宿舍接入一个集成有Wi-Fi路由功能的光猫将双绞线接入各个端口请在片区信息里查看电信架构的升级情况
电信的路由器带有Wi-Fi功能提供无线接入的途径产品名称叫做"F-Young",SSID以`FY`开头,一般是`FY-楼栋-宿舍号`
### 联通
联通目前只在香晖有提供服务,架构是"宿舍-楼层配线架-交换机-ONU"
### 移动
移动的结构和联通差不多,也是宿舍直连交换机的结构

View File

@@ -0,0 +1,31 @@
# 学校内的运营商
## 概览
对于学生宿舍网络,三大运营商在学校内都有服务,但是不同的宿舍片区,可以选择的运营商会有限制:
- 电信:所有宿舍片区
- 联通:香晖
- 移动:朝晖,香晖,凤翔\
用户想要使用这些运营商的宽带网络服务,就需要办理宽带业务.\
通常,运营商会给客户一张电话卡,这张电话卡的电话号组成了用户用来认证的账号的一部分.\
根据套餐的不同,用户需要向里面充值话费作为宽带费用.\
## 认证
除了电信的宽带和F-Young需要使用专用的客户端进行拨号外联通和电信只需要使用系统自带的PPPoE拨号认证即可,若认证失败则会出现691错误
### 账户和密码
这里是三家运营商的账户格式和初始密码
| |**账号格式** |**初始密码** |
|- |- |- |
|**电信**|`${用户手机号}` |`A1234567` |
|**联通**|`ZSLAN${用户手机号}@16900.gd`|`900.gd` |
|**移动**|`${用户手机号}@139.gd` |`手机号后六位` |
### 认证方式
电信需要下载专用客户端下载地址为:`zsteduapp.10000.gd.cn`,联通和移动使用系统自带拨号渠道即可,可以去看`技能/电脑技能/拨号`
## IP
宿舍的有线网会为每一个用户分配端口绑定的ip,其中:
- 电信为172.19.x.x号段
- 联通为172.18.x.x号段
- 移动为172.17.x.x号段\
注意这里的IP是交换机端口的IP,用户的电脑显示的是网线另一端对应的的端口IP。\
如果显示IP对应的运营商和用户实际的运营商不符合那么有可能是交换机接错了。\
联通和移动在机房里都有自己的交换机和ONU,只有将用户的端口插到对应的运营商的交换机端口处,拨号才能成功。\
电信是在宿舍处的路由器处接入网线或光缆,如果用户是电信需要把端口的另一端插到路由器上

View File

@@ -0,0 +1,60 @@
# DNS
## 背景知识
因为计算机网络上的计算机彼此之间只能用 IP 地址才能相互识别这就导致了一个问题IP 地址很难被人们记住,举个例子,我们中山学院网络维护科的官网的 IP 地址是 `47.52.33.166` ,记住这个 IP 地址是困难的。
于是互联网的前辈们想了一个方法,用域名来进行访问,例如访问 `www.zsxyww.com` 就可以访问到网维的官网,不需要去记住 IP 地址了,`www.zsxyww.com` 这个有意义的字段很容易记住(中山学院网维的拼音缩写嘛)。
然后问题就来了:计算机之间只能用 IP 地址识别,我们使用域名,计算机没法识别怎么办?
对于这个问题,互联网前辈们想了个法子,使用 DNS 服务器作为一个中介,我们使用浏览器访问 `www.zsxyww.com` 的时候,会先请求 DNS 服务器获取该域名对应的计算机的 IP 地址,然后与该 IP 地址对应的计算机(网维服务器)沟通。
## 定义
DNS 是进行域名和与之相对应的 IP 地址转换的服务器。DNS 中保存了一张域名和与之相对应的 IP 地址的表,以解析消息的域名。
简单来说就是 DNS 是一个服务器,能够返回域名对应的服务器的 IP 地址。
## 需要理解的简单的浏览器工作机制
![工作流程](/img/wiki/dns.png)
## 缓存机制
为了节约资源及加快速度,互联网前辈还想了个 DNS 缓存机制。
计算机会按照下列顺序方式进行查询
1. 浏览器缓存
2. 操作系统缓存
3. 各级 DNS 服务器(这边也有缓存)
## 日常工作相关
- 怎么判断是否是 DNS 的问题?
特征就是使用 IP 地址能够正常访问(例如 QQ而使用域名访问却没法访问。
一般来说遇到的会是所有域名都没法访问,不过偶尔也会遇到部分域名能访问,部分域名没法访问的情况。
- 怎么查询本地 DNS 缓存?
- 查询浏览器缓存
- Chrome 浏览器访问 `chrome://net-internals/#dns`,可查询浏览器缓存
- 其他浏览器,网上找找方法吧
- 查询操作系统缓存
- Windows 系统 使用命令 `ipconfig /displaydns` 查询,可以使用 `ipconfig /flushdns` 清除操作系统缓存
- macOS 系统 呃,网上找找方法吧
- Linux 系统 同上
- 怎么解决 DNS 的问题?
更换 DNS 服务器、使用神器清除本机 DNS 缓存即可。
常见的 DNS 服务器地址:
```text
8.8.8.8 Google不推荐作为主 DNS 服务器,可以作为次 DNS 服务器)
114.114.114.114 114
223.5.5.5 223.6.6.6 阿里
119.29.29.29 腾讯
```

View File

@@ -0,0 +1,62 @@
# 网线是什么
## 介绍
以太网(有线网)的连接离不开网线,但是,网线究竟是什么,它的内部原理是什么样呢?
一般电脑所发送和接受的网络信息,本质上是变化的弱电流,所以,所有网线本质上都是一种电线。
首先,今天我们所说的网线,是指双绞线,这种线内部有互相绝缘的一对电线互相缠绕(一般以顺时针缠绕),再绞合成螺旋状
一对线通常有一根颜色线和对应的白线组成,这两根线组成一对差分信号(即信息的值不是哪根线的绝对数值,而是两根线数值之差,这样有利于减缓干扰)
## RJ-45接口
网线通常的连接器标准叫做8P8C(也叫RJ-45),指这种接口有8个位置Position指8个凹槽、8个触点Contact指8个金属接点。 适用于RJ-45的双绞线内部通常有4对线绞按照TIA/EIA-568标准这四对的颜色分别是橙色蓝色绿色棕色
这种接头就是常说的“水晶头”,它的接口从左到右的功能如下:
1. TX_D1+ (发送数据+
2. TX_D1- (发送数据-
3. RX_D2+ (接收数据+
4. BI_D3+ (双向数据+
5. BI_D3- (双向数据-
6. RX_D2- (接收数据-
7. BI_D4+ (双向数据+
8. BI_D4- (双向数据-
在百兆以太网Fast Ethernet、10/100M Ethernet仅使用1、2、3、6这四根线以差分信号传输方式减少电磁干扰其中1、2为TX(发送)拧在一起3、6为RX接收拧在一起。
所以只需要1,2,3,6这些线正常就可以满足最基本的上网需求
### TIA/EIA-568A和TIA/EIA-568B
T568A或T568B标准规定了双绞线的8根线接入RJ-45接口时的线序。
两个标准的区别是发送信号的一对线与接收信号的一对线交换了位置。习惯上为10或100 Mbit/s 以太网缠绕线缆是依据T568A或T568B标准。
线缆一端为TIA-568A标准缠绕而另一端以TIA-568B标准缠绕通常被称为交叉缆线。一根交叉线连接起来的两台设备设备1的网卡的发送端连接到了设备2的网卡的接收端同样设备1的网卡的接受端连接到了设备2的网卡的发送端。
对于10M网与100M网不同性质的设备相连如计算机与交换机之间要使用交叉线。对于千兆网使用了全部8根线的交叉线相连。
准确地来说:如果设备使用与接受数据不同的引脚发送数据,则使用直连线。如果设备使用相同的引脚发送数据,则使用交叉线。
现在的交换机的各端口一般都能自动识别并自适应交叉线及平行线。因此,仅使用交叉线基本能适应各种情形。
## PoE
网线的本质就是电线,其实网线也可以用来传输电力,作为电源线使用,这种操作叫做以太网供电(PoE,Power Over Ethernet)
这对于一些需要方便布线的设备有很大的帮助以前除了拉网线还要拉一根电源线有了PoE之后就可以用网线解决所有事情
标准化的PoE方案有三种
模式A:将电能全部加到数据传输线路上用一根线同时传输数据和电力这需要用于对连接速度有较高要求的网络上这时需要用到全部4对线
(由于数据传输使用的是差分信号,所以对数据传输没有太大的影响)
模式B:用1,2,3,6传输数据用4,5,7,8运送电力这适合对网速要求不高的情况
4PPoE:使用全部的4对线传输电力通常需要用在高性能设备上
## 参考
https://zh.wikipedia.org/zh-cn/%E5%8F%8C%E7%BB%9E%E7%BA%BF
https://zh.wikipedia.org/zh-cn/8P8C
https://zh.wikipedia.org/zh-cn/%E4%BB%A5%E5%A4%AA%E7%BD%91%E4%BE%9B%E7%94%B5
https://zh.wikipedia.org/zh-cn/TIA/EIA-568
https://zh.wikipedia.org/zh-cn/%E5%8F%8C%E7%BB%9E%E7%BA%BF%E4%BB%A5%E5%A4%AA%E7%BD%91

View File

@@ -1 +0,0 @@
# DNS是什么和它的原理

View File

@@ -0,0 +1,2 @@
# 故障
这里列举了你可能遇到的一些故障

View File

@@ -1 +1,31 @@
# MacOS修理指南
许多用户使用的是MacOS系统操作起来和Windows系统不一样而且也会遇到独有的问题所以我们需要单独写这个章节来总结MacOS网络修理的要点
:::tip 提示
这里的很多方法也适用于linux系统
:::
## 操作
### 查看ip
打开终端,输入`ip a`,或`ip -brief address`(这个的信息更加简略)
### 拨号
关于MacOS拨号的教程建议看这个https://wiki.zsxyww.com/article/popular/%E7%A7%91%E6%99%AE-macOS%E5%BB%BA%E7%AB%8BPPPoE%E6%8B%A8%E5%8F%B7%E8%BF%9E%E6%8E%A5%E6%95%99%E7%A8%8B
1.点击左上角 苹果图标, 选择 系统偏好设置 | 网络 进入网络设置界面\
2.确定适配器已经连接好,网线连接好\
3.选中对应的适配器页面,在 配置IPv4 右边下拉框选择 创建PPPoE服务, 服务名称用默认的就行\
4.左侧选中新建的 PPPoE 进入 PPPoE 设置页面,填写 帐户名称 和 密码, 选择 记住此密码\
5.点击右下方的 应用 保存设置,然后点击 连接 即可建立拨号
## 问题
### 拨号问题
#### 未能找到PPPoE服务器
1.按照 Windows 系统拨号651错误处理流程处理检查线路连接\
2.注意 macOS 系统有的适配器也是需要安装驱动的(特别是绿联的某型号)可以看看IP有没有正常获取得到或者插拔网线有没有反应(不会判断驱动有没有安装的话不如换台电脑检测线路是否正常?)
#### 提示: 鉴定失败
1.按照 Windows 系统拨号691错误处理流程处理\
2.检查账号密码有没有输错\
3.是否接了正确的运营商线路\
4.账号是否正常状态(欠费/异常断线导致挂死)\
5.账号有没有被运营商绑定(解绑)

17
docs/wiki/10-资源.md Normal file
View File

@@ -0,0 +1,17 @@
# 资源
这里汇集了一些可能需要用到的资源
:::tip 提示
内部资料不要外传哦!
:::
## 工具
一些修网可能遇到的小工具
**ComIntRep** Complete Internet Repair:这个工具可以一键修复Windows的各种网络问题如果在修网过程中遇到客户电脑设置问题的可以在电脑上跑一遍这个程序在公告里我写了一篇教程可以参考[Click Me](/downloads/tools/comintrep_2103传说中的神器.zip)
## 文件
一些文件可以作wiki的补充说明
**网络维护科规章制度** 我们的规章制度,从群文件里下载的:[Click Me](/downloads/documents/网络维护科规章制度.docx)
**180328网维维修手册** 前辈写的手册,好像很久没有更新了:[Click Me](/downloads/documents/180328网维维修手册.docx)

View File

@@ -0,0 +1,2 @@
# 杂项
这里存放了一些不便于归类的文章

View File

@@ -0,0 +1,26 @@
# 关于169.254.x.x的ip的问题汇总
## 介绍
有些用户在正常物理链接时并不会出现宿舍网络分配的172.x.x.x地址而是出现了169.254.x.x的地址有时候不需要管他也可以正常上网但是有时候就不行这里就汇集了关于这个问题的经验
## 资料
查阅资料可得知这个是客户端开启了DHCP,但是服务端DHCP获取失败时系统自动为本机分配的ip地址不至于因为没有ip地址就无法内网通信了应该是机房的DHCP服务器出现了问题或者是用户的网络配置有问题导致无法获取DHCP于是就设置了这个fallback,技术好像叫APIPA
总之出现这种情况应该是服务器和用户其中一个或者全部的DHCP出现了问题如果只有用户一人出现了这种情况那么应该是用户的问题如果宿舍一个楼层都出现情况那么应该是交换机或者路由器出现了问题
参考https://zhuanlan.zhihu.com/p/100732856
## 实际情况
**可以将你遇到的情况添加到这里:**
---
在旧版wiki有如下文章:[链接](https://wiki.zsxyww.com/article/fault/%E6%95%85%E9%9A%9C0-%E8%8E%B7%E5%8F%96%E5%88%B0169-254%E5%BC%80%E5%A4%B4%E7%9A%84%E9%94%99%E8%AF%AFip%E5%9C%B0%E5%9D%80),应该是以前的人写的文章
21-安德这种情况朝晖一般不用管凤翔据说也可以连接香晖cd的话有时候在交换机换口可以解决这个问题他曾遇到过一个情况使用USB2.0的转接器就会出现这种情况并且连不上网用USB3.0的就可以,拿了3个USB3.0的都可以上网就是USB2.0的不能用

0
docs/wiki/gitignore/.gitignore vendored Normal file
View File

View File

@@ -0,0 +1,604 @@
/*
* SPDX-FileCopyrightText: 2022-2024 Megan Conkle <megan.conkle@kdemail.net>
*
* SPDX-License-Identifier: GPL-3.0-or-later
*/
/******************************************************************************/
/* Scrollbars */
/******************************************************************************/
ghostwriter--MarkdownEditor QAbstractScrollArea::corner,
ghostwriter--HtmlPreview QAbstractScrollArea::corner,
ghostwriter--Sidebar QAbstractScrollArea::corner {
background: transparent;
}
ghostwriter--MarkdownEditor QAbstractScrollArea,
ghostwriter--HtmlPreview QAbstractScrollArea,
ghostwriter--Sidebar QAbstractScrollArea {
padding: 3px 3px 0px 3px;
margin: 0
}
ghostwriter--Sidebar MarkdownEditor::horizontal,
ghostwriter--Sidebar HtmlPreview::horizontal,
ghostwriter--Sidebar QScrollBar::horizontal {
height: 16px;
margin: 5px;
border: 0;
background: transparent;
}
ghostwriter--MarkdownEditor QScrollBar::vertical,
ghostwriter--HtmlPreview QScrollBar::vertical,
ghostwriter--Sidebar QScrollBar::vertical {
width: 16px;
margin: 5px;
border: 0;
background: transparent;
}
ghostwriter--MarkdownEditor QScrollBar::horizontal:hover,
ghostwriter--HtmlPreview QScrollBar::horizontal:hover,
ghostwriter--Sidebar QScrollBar::horizontal:hover {
background-color: #202325;
border-radius: 3px;
}
ghostwriter--MarkdownEditor QScrollBar::vertical:hover,
ghostwriter--HtmlPreview QScrollBar::vertical:hover,
ghostwriter--Sidebar QScrollBar::vertical:hover {
background-color: #202325;
border-radius: 3px;
}
ghostwriter--MarkdownEditor QScrollBar::handle:horizontal,
ghostwriter--HtmlPreview QScrollBar::handle:horizontal,
ghostwriter--Sidebar QScrollBar::handle:horizontal {
min-width: 50px;
border: 0;
background: #444749;
border-radius: 3px;
}
ghostwriter--MarkdownEditor QScrollBar::handle:horizontal,
ghostwriter--HtmlPreview QScrollBar::handle:horizontal,
ghostwriter--Sidebar QScrollBar::handle:horizontal {
min-width: 50px;
border: 0;
background: #444749;
border-radius: 3px;
}
ghostwriter--MarkdownEditor QScrollBar::handle:vertical,
ghostwriter--HtmlPreview QScrollBar::handle:vertical,
ghostwriter--Sidebar QScrollBar::handle:vertical {
min-height: 50px;
border: 0;
background: #444749;
border-radius: 3px;
}
ghostwriter--MarkdownEditor QScrollBar::handle:horizontal:hover,
ghostwriter--HtmlPreview QScrollBar::handle:horizontal:hover,
ghostwriter--Sidebar QScrollBar::handle:horizontal:hover {
background: #3daee9;
}
ghostwriter--MarkdownEditor QScrollBar::handle:vertical:hover,
ghostwriter--HtmlPreview QScrollBar::handle:vertical:hover,
ghostwriter--Sidebar QScrollBar::handle:vertical:hover {
background: #3daee9;
}
ghostwriter--MarkdownEditor QScrollBar::add-line,
ghostwriter--HtmlPreview QScrollBar::add-line,
ghostwriter--Sidebar QScrollBar::add-line,
ghostwriter--MarkdownEditor QScrollBar::sub-line,
ghostwriter--HtmlPreview QScrollBar::sub-line,
ghostwriter--Sidebar QScrollBar::sub-line,
ghostwriter--MarkdownEditor QScrollBar::add-page,
ghostwriter--HtmlPreview QScrollBar::add-page,
ghostwriter--Sidebar QScrollBar::add-page,
ghostwriter--MarkdownEditor QScrollBar::sub-page,
ghostwriter--HtmlPreview QScrollBar::sub-page,
ghostwriter--Sidebar QScrollBar::sub-page,
ghostwriter--MarkdownEditor QScrollBar::down-arrow,
ghostwriter--HtmlPreview QScrollBar::down-arrow,
ghostwriter--Sidebar QScrollBar::down-arrow,
ghostwriter--MarkdownEditor QScrollBar::right-arrow,
ghostwriter--HtmlPreview QScrollBar::right-arrow,
ghostwriter--Sidebar QScrollBar::right-arrow {
background: transparent;
border: 0
}
/******************************************************************************/
/* Menu Bar */
/******************************************************************************/
QMainWindow QMenuBar {
color: #bdc3c7;
background-color: #151719;
font-size: 10pt;
spacing: 2px;
border: 0px;
border-bottom: 1px;
border-color: #2c2f31;
border-style: solid;
padding: 1px 0px 1px 0px;
}
QMainWindow QMenuBar::item {
padding: 2px 7px 2px 7px;
border: 0px;
margin: 2px;
border-radius: 5px;
}
QMainWindow QMenuBar::item:selected {
background-color: #25282c;
}
QMainWindow QMenuBar::item:hover {
background-color: #373d42;
}
QMainWindow QMenuBar::item:pressed {
background-color: #1f2225;
}
/******************************************************************************/
/* Popup menus */
/******************************************************************************/
QMainWindow QMenu,
QMenuBar QMenu {
color: #bdc3c7;
background-color: #1a1d1f;
border: 0px;
padding: 7px 0px 7px 0px;
}
QMainWindow QMenu::item,
QMenuBar QMenu::item {
background-color: transparent;
padding: 5px 10px 5px 10px;
margin: 0px 0px 0px 0px;
}
QMainWindow QMenu::indicator,
QMenuBar QMenu::indicator {
width: 16px;
height: 16px;
background-color: #25282c;
padding: 0px 5px 0px 5px;
margin: 0px 5px 0px 5px;
}
QMainWindow QMenu::indicator::unchecked,
QMenuBar QMenu::indicator::unchecked {
width: 16px;
height: 16px;
background-color: #25282c;
border-radius: 2px;
border-style: solid;
border-width: 1px;
border-color: #bdc3c7;
margin: 0px 5px 0px 5px;
}
QMainWindow QMenu::indicator::checked,
QMenuBar QMenu::indicator::checked {
width: 16px;
height: 16px;
background-color: #074051;
border-radius: 2px;
border-style: solid;
border-width: 1px;
border-color: #bdc3c7;
margin: 0px 5px 0px 5px;
}
QMainWindow QMenu::item:selected,
QMenuBar QMenu::item::selected {
background-color: #074051;
color: #bdc3c7;
}
QMainWindow QMenu::icon,
QMenuBar QMenu::icon {
border-radius: 2px;
border-width: 0px;
padding: 1px 3px 1px 3px;
margin: 0px 3px 0px 3px;
}
QMainWindow QMenu::icon::checked,
QMenuBar QMenu::icon::checked {
background-color: #373d42;
}
/******************************************************************************/
/* Editor */
/******************************************************************************/
QMainWindow QPlainTextEdit {
border: 0;
margin: 0;
padding: 5px;
background-color: #151719;
color: #bdc3c7;
selection-color: #bdc3c7;
selection-background-color: #074051;
font-family: Noto Sans Mono;
font-size: 15pt;
}
QMainWindow QSplitter::handle {
border: 0;
padding: 0;
margin: 0;
background-color: #2c2f31;
}
QMainWindow QSplitter::handle:vertical {
height: 1px;
}
QMainWindow QSplitter::handle:horizontal {
width: 1px;
}
/******************************************************************************/
/* Sidebar and Activity Bar */
/******************************************************************************/
/* Sidebar */
QMainWindow ghostwriter--Sidebar,
QSplitter ghostwriter--Sidebar {
border: 0;
margin: 0;
padding: 0;
background-color: #151719;
}
ghostwriter--Sidebar QStackedWidget {
border: 0;
padding: 1;
margin: 0;
background-color: #151719;
border-width: 0px;
}
/* Activity bar tabs */
ghostwriter--Sidebar QPushButton[checkable="true"] {
icon-size: 22px;
min-width: 40px;
max-width: 40px;
height: 40px;
outline: none;
margin: 0;
padding: 0;
border: 0;
background-color: transparent;
color: #8b8f92;
border-width: 0px;
border-left-width: 3px;
border-style: solid;
border-color: transparent;
border-radius: 0px;
}
ghostwriter--Sidebar QPushButton:checked {
border-color: #3daee9;
color: #bdc3c7;
background-color: #202325;
}
ghostwriter--Sidebar QPushButton:hover {
background-color: #202325;
}
ghostwriter--Sidebar QPushButton:checked:hover {
border-color: #3daee9;
color: #bdc3c7;
background-color: #202325;
}
/* Activity bar buttons */
ghostwriter--Sidebar QPushButton[checkable="false"] {
icon-size: 22px;
padding: 0;
margin: 0;
border: 0;
border-radius: 5px;
background-color: transparent;
color: #8b8f92;
width: 40px;
height: 40px;
}
ghostwriter--Sidebar QPushButton[checkable="false"]:hover {
color: #bdc3c7;
background-color: #202325;
}
ghostwriter--Sidebar QPushButton[checkable="false"]:pressed {
color: #bdc3c7;
background-color: transparent;
}
/* Stacked widgets inside sidebar pane */
ghostwriter--Sidebar QListWidget {
outline: none;
border: 0;
padding: 1;
background-color: #151719;
color: #bdc3c7;
font-size: 11pt;
font-weight: normal
}
ghostwriter--Sidebar QListWidget::item {
border: 0;
padding: 1 0 1 0;
margin: 0;
background-color: #151719;
color: #bdc3c7;
font-weight: normal
}
ghostwriter--Sidebar QListWidget::item:selected {
border-radius: 0px;
color: #bdc3c7;
background-color: #074051;
}
ghostwriter--Sidebar QLabel {
border: 0;
padding: 0;
margin: 0;
background-color: transparent;
font-size: 11pt;
color: #bdc3c7;
}
/******************************************************************************/
/* Status bar */
/******************************************************************************/
QStatusBar {
margin: 0;
padding: 0;
border-top: 1px solid #2c2f31;
border-left: 0;
border-right: 0;
border-bottom: 0;
background: #151719;
color: #8b8f92;
}
QStatusBar QLabel {
font-size: 11pt;
margin: 0px;
padding: 5px;
border: 0;
background: transparent;
color: #8b8f92;
}
QStatusBar QToolButton {
padding: 5 5 5 5;
margin: 0;
border: 0;
border-radius: 5px;
color: #8b8f92;
background-color: transparent;
font-size: 16px;
width: 32px;
height: 16px;
}
QStatusBar QToolButton:hover,
QStatusBar QToolButton:checked:hover {
background-color: #373d42;
}
QStatusBar QToolButton:pressed,
QStatusBar QToolButton:checked:pressed {
color: #73777a;
background-color: #1f2225;
}
QStatusBar QToolButton:flat,
QStatusBar QToolButton:checked {
background-color: #25282c;
}
QStatusBar QComboBox {
height: 22px;
border: 0px;
margin: 0;
padding: 0;
color: #8b8f92;
background-color: #151719;
font-size: 11pt;
}
QStatusBar QComboBox:hover {
border-bottom: 2px solid #3daee9;
}
QStatusBar QListView {
padding: 7px 0px 7px 0px;
margin: 0px;
color: #bdc3c7;
background-color: #151719;
}
QStatusBar QListView::item {
background-color: transparent;
padding: 5px 10px 5px 10px;
margin: 0px;
}
QStatusBar QListView::item:selected {
background-color: #074051;
color: #bdc3c7;
}
QStatusBar QComboBox::drop-down {
border: 0;
margin: 0;
padding: 0;
height: 20px;
width: 20px;
}
QStatusBar QComboBox::down-arrow {
border: 0;
margin: 0;
padding: 0;
height: 14px;
width: 14px;
image: url(/tmp/lIaSog.png)
}
QStatusBar QComboBox::drop-down:hover {
border-radius: 10px;
background-color: #373d42;
}
QStatusBar #leftStatusBarWidget,
QStatusBar #midStatusBarWidget,
QStatusBar #rightStatusBarWidget {
border: 0;
margin: 0;
padding: 0;
}
/******************************************************************************/
/* Find and Replace Pane */
/******************************************************************************/
ghostwriter--FindReplace QLabel {
font-size: 11pt;
margin: 0px;
padding: 5px;
border: 0;
background: transparent;
color: #8b8f92;
}
ghostwriter--FindReplace QPushButton {
font-size: 16px;
padding: 5 5 5 5;
margin: 0;
border: 0;
border-radius: 5px;
color: #8b8f92;
background-color: transparent;
min-width: 16px;
}
ghostwriter--FindReplace QPushButton:pressed {
color: #9da2a6;
background-color: transparent;
}
ghostwriter--FindReplace QPushButton:hover {
color: #ffffff;
background-color: transparent;
}
ghostwriter--FindReplace QPushButton:disabled {
color: #adb3b6;
background-color: transparent;
}
ghostwriter--FindReplace QPushButton[checkable="true"] {
color: #8b8f92;
background-color: transparent;
min-width: 32px;
height: 16px;
}
ghostwriter--FindReplace QPushButton[checkable="true"]:disabled,
ghostwriter--FindReplace QPushButton:flat:disabled {
color: #adb3b6;
background-color: #272a2e;
}
ghostwriter--FindReplace QPushButton[checkable="true"]:hover,
ghostwriter--FindReplace QPushButton:checked:hover {
background-color: #d0d7db;
background-color: #373d42;
}
ghostwriter--FindReplace QPushButton[checkable="true"]:pressed,
ghostwriter--FindReplace QPushButton:checked:pressed {
color: #73777a;
background-color: #1f2225;
}
ghostwriter--FindReplace QPushButton:checked {
background-color: #25282c;
}
ghostwriter--FindReplace QPushButton:flat {
color: #8b8f92;
background-color: #25282c;
font-weight: bold;
}
ghostwriter--FindReplace QPushButton:flat:hover {
color: #d0d7db;
background-color: #373d42;
}
ghostwriter--FindReplace QPushButton:flat:pressed {
color: #73777a;
background-color: #1f2225;
}
ghostwriter--FindReplace QPushButton:flat:disabled {
color: #adb3b6;
background-color: #272a2e;
}
ghostwriter--FindReplace QPushButton#matchCaseButton,
ghostwriter--FindReplace QPushButton#regexButton {
font-size: 16px;
font-family: default;
font-weight: bold;
}
ghostwriter--FindReplace QPushButton#replaceButton,
ghostwriter--FindReplace QPushButton#replaceAllButton {
font-size: 11pt;
font-family: default;
}
ghostwriter--FindReplace QPushButton#findReplaceCloseButton {
padding: 0;
margin: 0;
icon-size: 16px;
}
ghostwriter--FindReplace QLineEdit {
color: #bdc3c7;
background-color: #202325;
border: 0px;
border-radius: 3px;
selection-color: #bdc3c7;
selection-background-color: #074051;
}
ghostwriter--FindReplace QLineEdit:focus {
border: 1px solid #1d2022;
}

View File

@@ -25,8 +25,9 @@ const config = {
deploymentBranch: 'build',
githubHost: 'github.com',
onBrokenLinks: 'throw',
onBrokenLinks: 'warn',
onBrokenMarkdownLinks: 'warn',
//staticDirectories: ['static'],
// Even if you don't use internationalization, you can use this field to set
// useful metadata like html lang. For example, if your site is Chinese, you
@@ -47,6 +48,7 @@ const config = {
// Remove this to remove the "edit this page" links.
editUrl:
'https://github.com/ZSCNetSupportDept/website/tree/master',
showLastUpdateTime: true,
},
blog: {
showReadingTime: true,

7
package-lock.json generated
View File

@@ -11152,16 +11152,15 @@
}
},
"node_modules/nanoid": {
"version": "3.3.7",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz",
"integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==",
"version": "3.3.8",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.8.tgz",
"integrity": "sha512-WNLf5Sd8oZxOm+TzppcYk8gVOgP+l58xNy58D0nbUnOxOWRWvlcCV4kUF7ltmI6PsrLl/BgKEyS4mqsGChFN0w==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/ai"
}
],
"license": "MIT",
"bin": {
"nanoid": "bin/nanoid.cjs"
},

View File

@@ -11,6 +11,7 @@ const FeatureList = [
网维的知识库
</>
),
link: '/docs/wiki/首页',
},
{
title: '开发组文档',
@@ -20,6 +21,7 @@ const FeatureList = [
开发组的文档
</>
),
link: "/docs/devdocs/首页",
},
{
title: '公告',
@@ -29,6 +31,7 @@ const FeatureList = [
公告和博客
</>
),
link:"/blog",
},
];
@@ -36,7 +39,9 @@ function Feature({Svg, title, description}) {
return (
<div className={clsx('col col--4')}>
<div className="text--center">
<Svg className={styles.featureSvg} role="img" />
<a href={FeatureList.link}>
<Svg className={styles.featureSvg} role="img" />
</a>
</div>
<div className="text--center padding-horiz--md">
<Heading as="h3">{title}</Heading>
@@ -59,3 +64,4 @@ export default function HomepageFeatures() {
</section>
);
}

Some files were not shown because too many files have changed in this diff Show More