网络课学习

2026-07-11 241 words 2 minutes

Contents

网络分层模型

五层模型

应用层 : HTTP, HTTPS, FTP, DNS, SMTP, POP3 （具体的应用是什么）
  |
传输层 : TCP, UDP （如何传输信息）
  |
网络层 : IP (ROUTER) （如何在一个互联网找到对方）
  |
数据链路层 : MAC address （如何在一个子网络找到对方）
  |
物理层 : Cable, Fiber Optic, Wireless (物理层面信号的传输方式)

应用层协议

URL

Uniform resource locator

https://a.com:80/news/details?id=123#t1

<schema>://<domain>:<port>/<path>?<query_string>#<hash_string>

domain: 哪个计算机 port: 端口 path: 哪个服务 query string: 参数 hash string: 和网络没太多影响

domain port path 是必须的。当http协议使用时，默认的端口是 80 时. port可以忽略当https协议使用时，默认端口是 443 时. port可以忽略

HTTP

Hyper text transform protocol

HTTP主要就是规定了两个方面

消息传输的模式 - 如何传递
消息传输的格式 - 格式规范

消息传输的模式

就是简单的请求响应模式

clint request, server response

消息传输的格式

test.http

GET / HTTP/1.1
Host: www.taobao.com


###
POST  /posts HTTP/1.1
Host: jsonplaceholder.typicode.com
Content-Type: application/json

{
  "name": "a132",
  "age": 12
}

###
POST  /posts HTTP/1.1
Host: jsonplaceholder.typicode.com
Content-Type: application/x-www-form-urlencoded

name=a132&age=12

###
POST  /posts HTTP/1.1
Host: jsonplaceholder.typicode.com
Content-Type: multipart/form-data; boundary=aaa

--aaa
Content-Disposition: form-data; name="name"

a132
--aaa
Content-Disposition: form-data; name="age"

123
--aaa--
###

响应吗

Details here

XHR & Fetch

Ajax (Asynchronous javascript and XML).

以前不让js管网络请求的事。后来才允许js管理网络请求。

两种实现方式XMLHTTPRequest和Fetch API.

功能	XHR	Fetch
请求和响应	✅	✅
监控请求进度	✅	❌ (比如上传文件)
监控响应进度	✅	✅
service work是否可用	❌	✅
控制cookies 携带	❌	✅
控制重定向	❌	✅
请求取消	✅	✅
自定义referrer	❌	✅
stream	❌	✅
api风格	Event	Promise
活跃度	停止维护

同源策略和跨域问题

同源策略是一个浏览器的安全机制。同源放行，异源拒绝

源（origin） = 协议 + 域名 + 端口

异源就是跨域了