B12. 网络与社区

2.1. HTTP是Web数据交换的基础

"每次刷新网页时，浏览器都在悄悄发送『暗号』！就像Python中requests.get()发送请求，HTTP协议规定了浏览器与服务器如何对话。你知道404错误其实是个HTTP状态码吗？"

# Python模拟HTTP GET请求
import requests
response = requests.get('https://api.example.com/data')
print(response.status_code)  # 200表示成功

核心机制：

• 基于请求-响应模型（类比问答环节）
• 无状态协议（服务器不记得你是谁）
• 常见方法：GET（获取资源）、POST（提交数据）

⚠️ 易错：混淆GET/POST使用场景，如用GET传输密码！

2.2. URI由多个部分组成

"输入网址时，你有没有注意过https://和?后的参数？这就像快递地址在写明省市区后还要写具体地址，URI用标准格式精确定位资源"

https://www.example.com:8080/path/to/resource?name=Alice#section2

解剖结构：

• 协议方案（Scheme）：https
• 主机名（Host）：www.example.com
• 端口（Port）：:8080
• 路径（Path）：/path/to/resource
• 查询参数（Query）：?name=Alice
• 片段（Fragment）：#section2

⚠️ 易混淆：URI是广义标识符，URL是具体地址（URL属于URI）

2.3. URI可以用绝对路径和相对路径表示

"就像在教室里说『去教务处』（相对路径）和『去XX中学3楼教务处』（绝对路径），URI也有两种表达方式"

<!-- 绝对路径 -->
<a href="https://school.com/student/login.html">登录</a>

<!-- 相对路径（假设当前页是https://school.com/index.html） -->
<img src="images/logo.png"> <!-- 指向https://school.com/images/logo.png -->
<a href="../teacher/list.html">教师列表</a> <!-- 指向上一级目录 -->

⚠️ 致命错误：相对路径的基准是当前页面URL，移动页面后易导致链接失效！

2.4. HTML使用特殊属性便于无障碍

"视障同学如何『看』网页？通过屏幕阅读器！HTML的无障碍属性就像盲文，让所有人都能访问你的网站"

<img src="graph.png" alt="2023年学生成绩趋势图，数学成绩上升20%">
<button aria-label="关闭弹窗" onclick="closeDialog()">×</button>
<div role="navigation" aria-labelledby="mainmenu">
  <h2 id="mainmenu">网站导航</h2>
  <!-- 导航链接 -->
</div>

关键属性：

• alt：图片文字描述（必须！空值alt=""表示装饰图）
• aria-*：增强屏幕阅读器理解
• role：定义元素的语义角色

⚠️ 常见疏忽：仅用颜色传递信息（色盲用户无法识别）

2.5. 开源社区是软件开发的推动力量

GitHub不只是存代码的网盘！全球开发者在这里协作，像搭乐高一样共同构建软件。你用的大多数网站都基于React/Vue/jQuery，它们都来自于开源社区！

# 参与开源项目的典型流程
1. Fork项目仓库
2. git clone 到本地
3. 创建新分支修改代码
4. 提交Pull Request（PR）

开源精神：

• 遵循开源协议（如MIT、GPL）
• 通过Issues反馈问题
• 用README.md说明项目 ⚠️ 法律红线：直接复制他人代码未遵守LICENSE要求！

知识回顾

• HTTP通过状态码反馈请求结果，GET/POST用途不同
• URI由协议、主机、路径等组成，区分绝对/相对路径
• 无障碍属性提升网站包容性
• 开源社区通过协作加速软件开发，需遵守协议规范

课后练习

1. （单选）以下哪个HTTP状态码表示"需要身份验证"？ A. 200 B. 301 C. 403 D. 401
2. （填空）URI片段标识符以____符号开头，aria-label的作用是____。
3. （代码纠错）修复无障碍问题：

   <img src="chart.jpg">
   <button style="color: red;">重要</button>

4. （项目实践）在GitHub上Fork一个开源项目（如freeCodeCamp），添加中文注释后提交PR，记录操作过程。
5. （情景分析）为什么电商网站的支付功能必须用POST而非GET请求？