欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

13.1.2 WEB应用程序

程序员文章站 2022-07-15 08:03:52
...

了解了http协议之后，我们就可以制作一个简单的WEB应用程序了。

在之前学习的网络编程的前提下，我们知道，浏览器就相当于一个socket客户端，服务器相当于一个socket服务端。

客户端既然就是浏览器那么就不需要我们再来实现了，我们只需要编写服务端就可以了。

import socket

if __name__ == '__main__':
	# 实例化socket对象
	server = socket.socket()
	# 绑定服务端IP和端口
	server.bind(("127.0.0.1", 7777))
	# 设置最大监听数
	server.listen(7)

	while True:
		print('Server waiting...')
		# 与客户端请求建立链接
		connect, address = server.accept()
		# 接收客户端数据
		data = connect.recv(1024)
		print('data = %s' % data)

		# 读取要返回的HTML文档，注意，一定要以rb的模式读，因为要返回bytes类型的数据
		with open('Hello_Http.html', 'rb') as f:
			html = f.read()
			
		# 响应数据要设置响应首行，否则浏览器无法解析，响应头可以省略，响应首行与响应体之间以\r\n\r\n分隔
		connect.send(b'HTTP/1.1 200OK\r\n\r\n%s' % html)
		connect.close()

相应的HTML文档为：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Hello Http</title>
</head>
<body>
<img src="https://www.baidu.com/img/bd_logo1.png" alt='百度一下'>
<form action="http://127.0.0.1:7777/" method="post">
    <span>用户名：</span>
    <label>
        <input type="text" name="username">
    </label>
    <span>密码：</span>
    <label>
        <input type="password" name="password">
    </label>
    <label>
        <input type="submit">
    </label>
</form>
</body>
</html>

浏览器显示效果为：
13.1.2 WEB应用程序
使用form表单提交数据之后终端的输出：

Server waiting...
data = b'GET / HTTP/1.1\r\nHost: 127.0.0.1:7777\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/80.0.3987.122 Safari/537.36\r\nSec-Fetch-Dest: document\r\nAccept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9\r\nSec-Fetch-Site: none\r\nSec-Fetch-Mode: navigate\r\nSec-Fetch-User: ?1\r\nAccept-Encoding: gzip, deflate, br\r\nAccept-Language: en-US,en;q=0.9,zh-CN;q=0.8,zh;q=0.7\r\n\r\n'
Server waiting...
data = b'GET /favicon.ico HTTP/1.1\r\nHost: 127.0.0.1:7777\r\nConnection: keep-alive\r\nPragma: no-cache\r\nCache-Control: no-cache\r\nUser-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.122 Safari/537.36\r\nSec-Fetch-Dest: image\r\nAccept: image/webp,image/apng,image/*,*/*;q=0.8\r\nSec-Fetch-Site: same-origin\r\nSec-Fetch-Mode: no-cors\r\nReferer: http://127.0.0.1:7777/\r\nAccept-Encoding: gzip, deflate, br\r\nAccept-Language: en-US,en;q=0.9,zh-CN;q=0.8,zh;q=0.7\r\n\r\n'
Server waiting...
data = b'POST / HTTP/1.1\r\nHost: 127.0.0.1:7777\r\nConnection: keep-alive\r\nContent-Length: 30\r\nCache-Control: max-age=0\r\nOrigin: http://127.0.0.1:7777\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/80.0.3987.122 Safari/537.36\r\nSec-Fetch-Dest: document\r\nAccept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9\r\nSec-Fetch-Site: same-origin\r\nSec-Fetch-Mode: navigate\r\nSec-Fetch-User: ?1\r\nReferer: http://127.0.0.1:7777/\r\nAccept-Encoding: gzip, deflate, br\r\nAccept-Language: en-US,en;q=0.9,zh-CN;q=0.8,zh;q=0.7\r\n\r\nusername=Alex&password=1234567'
Server waiting...
data = b'GET /favicon.ico HTTP/1.1\r\nHost: 127.0.0.1:7777\r\nConnection: keep-alive\r\nUser-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.122 Safari/537.36\r\nSec-Fetch-Dest: image\r\nAccept: image/webp,image/apng,image/*,*/*;q=0.8\r\nSec-Fetch-Site: same-origin\r\nSec-Fetch-Mode: no-cors\r\nReferer: http://127.0.0.1:7777/\r\nAccept-Encoding: gzip, deflate, br\r\nAccept-Language: en-US,en;q=0.9,zh-CN;q=0.8,zh;q=0.7\r\n\r\n'
Server waiting...

第一次和第二次get请求为通过浏览器请求页面，包含以下内容：

请求首行：
GET / HTTP/1.1

\r\n

请求头：
Host: 127.0.0.1:7777\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/80.0.3987.122 Safari/537.36\r\nSec-Fetch-Dest: document\r\nAccept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9\r\nSec-Fetch-Site: none\r\nSec-Fetch-Mode: navigate\r\nSec-Fetch-User: ?1\r\nAccept-Encoding: gzip, deflate, br\r\nAccept-Language: en-US,en;q=0.9,zh-CN;q=0.8,zh;q=0.7

\r\n\r\n

请求体：
无

请求首行与请求头以\r\n为分隔，请求头中的数据也都已\r\n为分隔，请求头与请求体以\r\n\r\n为分隔。

第三个post请求为浏览器通过form表单发送给服务端的请求，包含以下内容：

请求首行：
POST / HTTP/1.1

\r\n

请求头：
Host: 127.0.0.1:7777\r\nConnection: keep-alive\r\nContent-Length: 30\r\nCache-Control: max-age=0\r\nOrigin: http://127.0.0.1:7777\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/80.0.3987.122 Safari/537.36\r\nSec-Fetch-Dest: document\r\nAccept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9\r\nSec-Fetch-Site: same-origin\r\nSec-Fetch-Mode: navigate\r\nSec-Fetch-User: ?1\r\nReferer: http://127.0.0.1:7777/\r\nAccept-Encoding: gzip, deflate, br\r\nAccept-Language: en-US,en;q=0.9,zh-CN;q=0.8,zh;q=0.7

\r\n\r\n

请求体：
username=Alex&password=1234567

我们的服务端应用程序设置为不管发起何种请求，返回的响应数据都是唯一的：

HTTP/1.1 200OK\r\n\r\n%s

响应首行：
HTTP/1.1 200OK

响应头：
无

\r\n\r\n

响应体：
(HTML文档)
相关标签： Python全栈开发之路

上一篇： -f linux_从一段挖矿病毒代码看Linux命令的实际应用

下一篇： 用Python构建数据科学Web应用程序

推荐阅读