一、web应用
web应用程序是一种可以通过Web访问的应用程序，程序的最大好处是用户很容易访问应用程序，用户只需要有浏览器即可，不需要再安装其他软件。应用程序有两种模式C/S、B/S。C/S是客户端/服务器端程序，也就是说这类程序一般独立运行。而B/S就是浏览器端/服务器端应用程序，这类应用程序一般借助谷歌，火狐等浏览器来运行。WEB应用程序一般是B/S模式。Web应用程序首先是“应用程序”，和用标准的程序语言，如java，python等编写出来的程序没有什么本质上的不同。在网络编程的意义下，浏览器是一个socket客户端，服务器是一个socket服务端。
B/S架构，是浏览器先发送请求，服务器响应请求，返回数据给客户端。
简单socket服务器
举例：
新建server.py文件，代码如下：
import socket
sk = socket.socket()
sk.bind(('127.0.0.1', 8800))
sk.listen()
while 1:
print('server waiting...')
conn, addr = sk.accept()
# 服务器首先是接收数据
data = conn.recv(1024)
# 打印接收信息
print('data', data)
# 发送给客户端
conn.send(b'Hi, JD')
conn.close()
sk.close()
启动py文件，页面访问url：
http://127.0.0.1:8800/
网页输出：
上面提示无效的响应，为什么？是因为服务器响应信息，不符合HTTP规范。
查看pycharm控制台的输出信息
data b'GET / HTTP/1.1\r\nHost: 127.0.0.1:8800\r\nConnection: keep-alive\r\nCache-Control: max-age=0\r\nUpgrade-Insecure-Requests: 1\r\nUser-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.79 Safari/537.36\r\nAccept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8\r\nAccept-Encoding: gzip, deflate, br\r\nAccept-Language: zh-CN,zh;q=0.9\r\nCookie: csrftoken=IwhDDZ9RiKQUV4T5CbzGIhAcVZNxYuvAYdS7RKc0tmOmk02hHWfQ8sWnIGrN1pzC\r\n\r\n'
它才是一个完整的HTTP请求信息。
更改socket代码，将conn.send改成下面的
conn.send(b'HTTP://1.1 200 OK\r\n\r\nHi,JD')
重启py文件，再次访问页面
页面输出： Hi,JD
修饰返回信息
响应的信息，可以加入一些html标签，比如H1和img
import socket
sk = socket.socket()
sk.bind(('127.0.0.1', 8800))
sk.listen()
while 1:
print('server waiting...')
conn, addr = sk.accept()
# 服务器首先是接受数据
data = conn.recv(1024)
# 打印接收信息
print('data', data)
# 发送给客户端
html = b'<h1>Hi,JD</h1><img src="https://img20.360buyimg.com/da/jfs/t24334/1/45221916/115081/515da78a/5b2393d4N05f8a4c2.gif?t=1529495461508"/>'
conn.send(b'HTTP://1.1 200 OK\r\n\r\n%s' % html)
conn.close()
sk.close()
重启py文件，再次访问页面，效果如下：
但是用字符串拼接，太麻烦了。
登录页面
可以引入一个index.html文件，来展示页面
在server.py同级目录下新建文件index.html，代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="">
<lable>用户名</lable>
<input type="text">
<lable>密码</lable>
<input type="text">
<input type="submit">
</form>
</body>
</html>
修改server.py，代码如下：
import socket
sk = socket.socket()
sk.bind(('127.0.0.1', 8800))
sk.listen()
while 1:
print('server waiting...')
conn, addr = sk.accept()
# 服务器首先是接收数据
data = conn.recv(1024)
# 打印接收信息
print('data', data)
# 发送给客户端
with open('index.html', 'rb') as f: # 必须使用rb模式打开
data = f.read() # 读取所有内容
conn.send(b'HTTP://1.1 200 OK\r\n\r\n%s' % data)
conn.close()
sk.close()
重启py文件，再次访问页面，效果如下：
二、http协议简介
http协议简介
HTTP协议是Hyper Text Transfer Protocol（超文本传输协议）的缩写,是用于万维网（WWW:World Wide Web ）服务器与本地浏览器之间传输超文本的传送协议。
HTTP是一个属于应用层的面向对象的协议，由于其简捷、快速的方式，适用于分布式超媒体信息系统。它于1990年提出，经过几年的使用与发展，得到不断地完善和扩展。HTTP协议工作于客户端-服务端架构为上。浏览器作为HTTP客户端通过URL向HTTP服务端即WEB服务器发送所有请求。Web服务器根据接收到的请求后，向客户端发送响应信息。
http协议特性
(1) 基于TCP/IP
http协议是基于TCP/IP协议之上的应用层协议。
请求协议(浏览器-->服务器)
响应协议(服务器-->浏览器)
比如：张三要发送一段信息为李四。发送的信息为 s = "zhangsan--24--shanghai" ；
那么李四接收的时候，必须用--切割才能得到信息。否则李四不知道，这段信息是干啥的。这个是一个简单的基于内容的协议。
对于HTTP而言，服务器和浏览器双方遵循了共同的协议。
没有请求，就没有响应
(2) 基于请求－响应模式
HTTP协议规定,请求从客户端发出,最后服务器端响应该请求并 返回。换句话说,肯定是先从客户端开始建立通信的,服务器端在没有 接收到请求之前不会发送响应
(3) 无状态保存
HTTP是一种不保存状态,即无状态(stateless)协议。HTTP协议 自身不对请求和响应之间的通信状态进行保存。也就是说在HTTP这个 级别,协议对于发送过的请求或响应都不做持久化处理。
使用HTTP协议,每当有新的请求发送时,就会有对应的新响应产 生。协议本身并不保留之前一切的请求或响应报文的信息。这是为了更快地处理大量事务,确保协议的可伸缩性,而特意把HTTP协议设计成 如此简单的。可是,随着Web的不断发展,因无状态而导致业务处理变得棘手 的情况增多了。比如,用户登录到一家购物网站,即使他跳转到该站的 其他页面后,也需要能继续保持登录状态。针对这个实例,网站为了能 够掌握是谁送出的请求,需要保存用户的状态。HTTP/1.1虽然是无状态协议,但为了实现期望的保持状态功能, 于是引入了Cookie技术。有了Cookie再用HTTP协议通信,就可以管 理状态了。有关Cookie的详细内容稍后讲解。
无连接
无连接的含义是限制每次连接只处理一个请求。服务器处理完客户的请求，并收到客户的应答后，即断开连接。采用这种方式可以节省传输时间。
比如访问jd网页，服务器响应请求，返回html代码给浏览器。浏览器接收后，连接就断开了。
扩展：还有一个短连接，比如请求响应之后，维持3秒。如果客户端没有操作，连接就断开了。
http请求协议与响应协议
http协议包含由浏览器发送数据到服务器需要遵循的请求协议与服务器发送数据到浏览器需要遵循的请求协议。用于HTTP协议交互的信被为HTTP报文。请求端(客户端)的HTTP报文 做请求报文,响应端(服务器端)的 做响应报文。HTTP报文本身是由多行数据构成的字 文本。
请求协议
请求格式
注意：name=ueno&age=37 上面有一个空行。
Host和Conten-Length 之间的内容属于请求体，它是用来解释本次请求的信息。
请求方式: get与post请求
-
GET提交的数据会放在URL之后，以?分割URL和传输数据，参数之间以&相连，如EditBook?name=test1&id=123456. POST方法是把提交的数据放在HTTP包的请求体中.
-
GET提交的数据大小有限制（因为浏览器对URL的长度有限制），而POST方法提交的数据没有限制.
-
GET与POST请求在服务端获取请求数据方式不同。
响应协议
响应格式
请求协议(浏览器-->服务器)
" 请求首行：请求协议 url 请求方式 请求头： 它是key:value形式的数据 请求体...(注意：请求体和请求头，必须有一个空行，也就是/r/n) "
看下面2个url
https://passport.jd.com/new/login.aspx?ReturnUrl=http%3A%2F%2Fhome.jd.com%2F
http://127.0.0.1:8000/books/113/?age=18
第一个url使用了域名，它涉及到一个dns解析过程。域名后面没有端口，表示使用默认端口。https端口为443
第二个url，端口之后和问号之间的部分，叫做路径。不管多少层，只要没遇到问号，都属于路径部分。
问号之后的部分，叫做数据。
看这个url： https://www.jd.com/ 它的路径就是 / 。/表示根路径
所以一个完整的url由4部分组成：协议、域名/IP和端口、路径、数据
查看Pycharm控制台，使用谷歌浏览器访问一次网页。实际上，是有2次请求的。
data b'GET / HTTP/1.1\r\nHost: 127.0.0.1:8800\r\nConnection: keep-alive\r\nCache-Control: max-age=0\r\nUpgrade-Insecure-Requests: 1\r\nUser-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.79 Safari/537.36\r\nAccept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8\r\nAccept-Encoding: gzip, deflate, br\r\nAccept-Language: zh-CN,zh;q=0.9\r\nCookie: csrftoken=IwhDDZ9RiKQUV4T5CbzGIhAcVZNxYuvAYdS7RKc0tmOmk02hHWfQ8sWnIGrN1pzC\r\n\r\n' server waiting... data b'GET /favicon.ico HTTP/1.1\r\nHost: 127.0.0.1:8800\r\nConnection: keep-alive\r\nUser-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.79 Safari/537.36\r\nAccept: image/webp,image/apng,image/*,*/*;q=0.8\r\nReferer: http://127.0.0.1:8800/\r\nAccept-Encoding: gzip, deflate, br\r\nAccept-Language: zh-CN,zh;q=0.9\r\nCookie: csrftoken=IwhDDZ9RiKQUV4T5CbzGIhAcVZNxYuvAYdS7RKc0tmOmk02hHWfQ8sWnIGrN1pzC\r\n\r\n'
第一次，是正常请求。第二次是，favicon.ico请求，它是网页图标问题。这个请求，忽略即可。
将/r/n替换为换行，得到以下信息
GET / HTTP/1.1 Host: 127.0.0.1:8800 Connection: keep-alive Cache-Control: max-age=0 Upgrade-Insecure-Requests: 1 User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.79 Safari/537.36 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8 Accept-Encoding: gzip, deflate, br Accept-Language: zh-CN,zh;q=0.9 Cookie: csrftoken=IwhDDZ9RiKQUV4T5CbzGIhAcVZNxYuvAYdS7RKc0tmOmk02hHWfQ8sWnIGrN1pzC
可以看到，GET的数据，是放到url后面的。POST数据是放在请求体后面的。
打个比方：比如早期时候，用的信封。get相当于，直接写在封面上了。post相当于写在信封里面了。
举例：
使用表单模拟post请求
更改index.html，代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="/abc" method="post">
<lable>用户名</lable><input type="text" name="user"/>
<lable>密码</lable><input type="password" name="pwd"/>
<input type="submit"/>
</form>
</body>
</html>
重启server.py文件，访问页面
输入用户名和密码，点击提交
查看pycharm的控制台，查看post请求
data b'POST /abc HTTP/1.1\r\nHost: 127.0.0.1:8800\r\nConnection: keep-alive\r\nContent-Length: 17\r\nCache-Control: max-age=0\r\nOrigin: http://127.0.0.1:8800\r\nUpgrade-Insecure-Requests: 1\r\nContent-Type: application/x-www-form-urlencoded\r\nUser-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.79 Safari/537.36\r\nAccept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8\r\nReferer: http://127.0.0.1:8800/abc?user=xiao&pwd=123\r\nAccept-Encoding: gzip, deflate, br\r\nAccept-Language: zh-CN,zh;q=0.9\r\nCookie: csrftoken=IwhDDZ9RiKQUV4T5CbzGIhAcVZNxYuvAYdS7RKc0tmOmk02hHWfQ8sWnIGrN1pzC\r\n\r\nuser=xiao&pwd=123'
看最后的信息，就可以看到user=xiao&pwd=‘123’
模拟get请求
修改index.html，代码如下：