python web开发 网络编程 HTTP协议、Web服务器、WSGI接口

简介: python web开发 网络编程 HTTP协议、Web服务器、WSGI接口

文章目录


1. HTTP协议

2. Web服务器

3. 静态服务器

创建 web_server.py

4. WSGI 接口

4.1 CGI 通用网关接口

4.2 WSGI

4.3 定义 WSGI 接口

4.4 运行 WSGI 服务

learning from 《python web开发从入门到精通》


1. HTTP协议


应用层最主要的协议:HTTP协议(HyperText Transfer Protocol 超文本传输协议)

用户访问网站时,用户浏览器是客户端(向服务器发请求),网站被称为服务器(收到请求,处理后的响应传给客户端),此过程通过 HTTP 协议实现

利用 TCP 在两台计算机(如Web服务器,客户端)之间传输信息,客户端使用 web浏览器发送 HTTP 请求给 web 服务器,服务器发送响应给客户端


2. Web服务器


当在浏览器中输入 url 后:


浏览器请求 DNS 服务器,进行域名解释,获得 站点 IP 地址

发送一个 HTTP Request 请求 给拥有该 IP 的主机

收到服务器返回的 HTTP Response响应,浏览器渲染效果后呈现给用户

Web 服务器工作原理:


建立连接:客户端通过 TCP/IP 协议建立到服务器的 TCP 连接

请求过程:客户端向服务器发送 HTTP协议请求包,请求资源

应答过程:服务器向客户端发送 HTTP协议应答包,如果资源包含动态语言内容,会先进行处理,得到的数据返回客户端,客户端解释 HTML 渲染在屏幕上

关闭连接:断开客户端和服务器

常用请求方法:


GET:请求指定页面

POST:提交数据(表单或者文件等)

HEAD:类似GET,但仅仅获取报头

PUT:取代服务器上的指定文档内容

DELETE:服务器删除指定页面

OPTIONS:允许客户端查看服务器性能

返回状态码:


1**:请求收到,继续处理

2**:成功返回响应

3**:重定向,为了完成请求,必须进一步执行的动作

4**:客户端错误,如语法错误,或者请求无法实现

5**:服务器错误,服务器不能实现一种明显无效的请求

浏览器 按 F12 可以查看相关信息

image.png


3. 静态服务器


  • 纯粹的 HTML 页面被称为 静态页面

例子:创建一个静态服务器,通过该服务器可以访问包含两个静态页面的网站

  • 导航栏的网页 simple_navbar.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>使用bootstrap框架制作导航栏</title>
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/css/bootstrap.css" rel="stylesheet">
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/popper.js/2.9.2/cjs/popper-base.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/js/bootstrap.js"></script>
</head>
<body>
<nav class="navbar navbar-expand-sm navbar-light bg-light">
    <div class="container-fluid">
        <a class="navbar-brand" href="https://michael.blog.csdn.net/">我的导航</a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
                aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                <li class="nav-item">
                    <a class="nav-link active" aria-current="page" href="https://michael.blog.csdn.net/">主页</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">链接</a>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button"
                       data-bs-toggle="dropdown" aria-expanded="false">
                        关于作者
                    </a>
                    <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
                        <li><a class="dropdown-item" href="#">简历</a></li>
                        <li><a class="dropdown-item" href="#">项目</a></li>
                        <li>
                            <hr class="dropdown-divider">
                        </li>
                        <li><a class="dropdown-item" href="contact.html">联系方式</a></li>
                    </ul>
                </li>
                <li class="nav-item">
                    <a class="nav-link disabled">商城</a>
                </li>
            </ul>
            <form class="d-flex">
                <input class="form-control me-2" type="search" placeholder="输入你的关键词" aria-label="Search">
                <button class="btn btn-outline-success" type="submit">站内搜索</button>
            </form>
        </div>
    </div>
</nav>
</body>
</html>
  • contact.html,在上面的基础上,添加一些额外的联系信息
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>联系michael</title>
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/css/bootstrap.css" rel="stylesheet">
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/popper.js/2.9.2/cjs/popper-base.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/js/bootstrap.js"></script>
</head>
<body>
<nav class="navbar navbar-expand-sm navbar-light bg-light">
    <div class="container-fluid">
        <a class="navbar-brand" href="https://michael.blog.csdn.net/">我的导航</a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
                aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                <li class="nav-item">
                    <a class="nav-link active" aria-current="page" href="https://michael.blog.csdn.net/">主页</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">链接</a>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button"
                       data-bs-toggle="dropdown" aria-expanded="false">
                        关于作者
                    </a>
                    <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
                        <li><a class="dropdown-item" href="#">简历</a></li>
                        <li><a class="dropdown-item" href="#">项目</a></li>
                        <li>
                            <hr class="dropdown-divider">
                        </li>
                        <li><a class="dropdown-item" href="contact.html">联系方式</a></li>
                    </ul>
                </li>
                <li class="nav-item">
                    <a class="nav-link disabled">商城</a>
                </li>
            </ul>
            <form class="d-flex">
                <input class="form-control me-2" type="search" placeholder="输入你的关键词" aria-label="Search">
                <button class="btn btn-outline-success" type="submit">站内搜索</button>
            </form>
        </div>
    </div>
</nav>
<div class="bs-docs-header" id="content" tabindex="-1">
    <div class="container">
        <h1> 联系michael </h1>
        <div class="lead">
            <address>
                电子邮件:<strong>michael@xxx.com</strong>
                <br>地址:地球村86号
                <br>邮政编码:<strong>xxxxxx</strong>
                <br><abbr title="Phone">联系电话:</abbr> 1234567890
            </address>
        </div>
    </div>
</div>
</body>
</html>

image.png


创建 web_server.py

实现客户端和服务器的 HTTP 通信

注:由于 HTML 里面写了很多下载的 css 文件地址,路径总是报错,最后还是 建议引用 CDN 写法

<link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/css/bootstrap.css" rel="stylesheet">
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/popper.js/2.9.2/cjs/popper-base.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/js/bootstrap.js"></script>
import socket
import re
from multiprocessing import Process  # 多线程
HTML_ROOT_DIR = './'  # 设置静态页面的根目录
class HTTPServer:
    def __init__(self):
        self.server_socket = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
    def start(self):
        self.server_socket.listen(128)  # 最大连接数128
        print("服务器等待客户端连接...")
        while True:
            client_socket, client_addr = self.server_socket.accept()  # 建立客户端连接
            print("[%s, %s]用户连接上了" % client_addr)
            handle_client_process = Process(target=self.handle_client, args=(client_socket,))
            # 实例化线程,第一个参数调用函数 ,第二个参数 传递给前者的参数,元组形式
            handle_client_process.start()  # 开启线程
            client_socket.close()  # 关闭客户端socket
    def handle_client(self, client_socket):
        # 处理客户端请求
        request_data = client_socket.recv(1024)  # 接收客户端请求
        print("request data:", request_data)
        request_lines = request_data.splitlines()  # 按行分割
        for line in request_lines:
            print(line)  # 输出信息
        request_start_line = request_lines[0]  # 获取请求报文
        print("*" * 10)
        print(request_start_line.decode("utf-8"))
        file_name = re.match(r"\w+ +(/[^ ]*) ", request_start_line.decode("utf-8")).group(1)
        # 使用正则表达式,提取请求的文件名,group(1) 列出第一个括号匹配部分
        if file_name == "/":
            file_name = "/simple_navbar.html"
        try:
            # 尝试打开文件
            file = open(HTML_ROOT_DIR + file_name, "rb")
        except IOError:
            # 读取文件失败,返回404
            response_start_line = "HTTP/1.1 404 Not Found\r\n"
            response_headers = "Server: Michael server\r\n"
            response_body = "The file %s is not found! please check again!" % (HTML_ROOT_DIR + file_name)
        else:
            file_data = file.read()
            file.close()
            # 构造响应数据
            response_start_line = "HTTP/1.1 200 OK\r\n"
            response_headers = "Server: Michael server\r\n"
            response_body = file_data.decode("utf-8")
        # 拼接返回数据
        response = response_start_line + response_headers + "\r\n" + response_body
        print("response data:", response)
        client_socket.send(bytes(response, "utf-8"))  # 向客户端发送响应数据
        client_socket.close()  # 关闭客户端连接
    def bind(self, port):
        self.server_socket.bind(("127.0.0.1", port))
def main():
    http_server = HTTPServer()
    http_server.bind(8000)
    http_server.start()
if __name__ == "__main__":
    main()

image.pngimage.png


4. WSGI 接口


上面实现了一个静态服务器,但是现在很少使用,更多的是使用 动态页面,实现交互性


例如,注册登录网站,用户输入数据,web服务器不处理用户数据(不是它的职责),CGI 诞生


4.1 CGI 通用网关接口


Common Gateway Interface 是一段程序,运行在服务器上

web 服务器将请求发送给 CGI 应用程序,再将 CGI 动态生成的 HTML 页面发送回客户端

CGI 局限性:创建完解释器进程,用完就抛弃,大量的请求导致服务器停机


CGI 加强版 FastCGI 出现,其使用 进程/线程池 来处理一连串的请求

减少了 网页服务器 与 CGI 程序之间 交互的开销


4.2 WSGI


在 FastCGI 标准下写异步的 Web 服务不太方便,WSGI (Web Server Gateway Interface 服务器网关接口) 出现

image.png


4.3 定义 WSGI 接口


最简单的web版本 hello world

def applications(environ, start_response):
    start_response('200 OK', [('Content-Type', 'text/html')])
    return [b'<h1>Hello, Michael!</h1>']


上面函数就是符合 WSGI 标准的一个 HTTP 处理函数


environ :一个所有 HTTP 请求信息的字典对象

start_response:一个发送 HTTP 响应的函数

好处:web 解析 和 应用程序逻辑 分离,可以各自做自己擅长的事


python 内置了 WSGI:wsgiref 模块(它没有考虑运行效率,仅供开发测试)


4.4 运行 WSGI 服务


wsgi_app.py


# wsgi 应用程序
def app(environ, start_response):
    # 响应信息
    start_response('200 OK', [('Content-Type', 'text/html')])
    file_name = environ['PATH_INFO'][1:] or 'simple_navbar.html'
    HTML_ROOT_DIR = './'
    try:
        # 打开文件
        file = open(HTML_ROOT_DIR + file_name, 'rb')
    except IOError:
        # 响应异常
        response_body = "{} not found".format(HTML_ROOT_DIR + file_name)
    else:
        # 读取文件
        file_data = file.read()
        file.close()
        # 构造响应数据
        response_body = file_data.decode('utf-8')
    return [response_body.encode('utf-8')]  # 返回数据
  • wsgi_server.py
# WSGI 服务器
from wsgiref.simple_server import make_server
from wsgi_app import app
# 创建一个服务器,IP地址为空,端口号为8000,处理函数是app
httpd = make_server('', 8000, app)
print('Serving HTTP on port 8000...')
httpd.serve_forever()  # 开始监听HTTP请求

运行 wsgi_server.py ,在浏览器输入 http://127.0.0.1:8000/ 就可以访问网页了

image.png

相关实践学习
Serverless极速搭建Hexo博客
本场景介绍如何使用阿里云函数计算服务命令行工具快速搭建一个Hexo博客。
相关文章
|
1月前
|
前端开发 JavaScript 安全
前端性能调优:HTTP/2与HTTPS在Web加速中的应用
【10月更文挑战第27天】本文介绍了HTTP/2和HTTPS在前端性能调优中的应用。通过多路复用、服务器推送和头部压缩等特性,HTTP/2显著提升了Web性能。同时,HTTPS确保了数据传输的安全性。文章提供了示例代码,展示了如何使用Node.js创建一个HTTP/2服务器。
58 3
|
7天前
|
存储 人工智能 自然语言处理
ChatMCP:基于 MCP 协议开发的 AI 聊天客户端,支持多语言和自动化安装 MCP 服务器
ChatMCP 是一款基于模型上下文协议(MCP)的 AI 聊天客户端,支持多语言和自动化安装。它能够与多种大型语言模型(LLM)如 OpenAI、Claude 和 OLLama 等进行交互,具备自动化安装 MCP 服务器、SSE 传输支持、自动选择服务器、聊天记录管理等功能。
68 14
ChatMCP:基于 MCP 协议开发的 AI 聊天客户端,支持多语言和自动化安装 MCP 服务器
|
1月前
|
缓存 安全 网络安全
HTTP/2与HTTPS在Web加速中的应用
HTTP/2与HTTPS在Web加速中的应用
|
29天前
|
XML 前端开发 JavaScript
PHP与Ajax在Web开发中的交互技术。PHP作为服务器端脚本语言,处理数据和业务逻辑
本文深入探讨了PHP与Ajax在Web开发中的交互技术。PHP作为服务器端脚本语言,处理数据和业务逻辑;Ajax则通过异步请求实现页面无刷新更新。文中详细介绍了两者的工作原理、数据传输格式选择、具体实现方法及实际应用案例,如实时数据更新、表单验证与提交、动态加载内容等。同时,针对跨域问题、数据安全与性能优化提出了建议。总结指出,PHP与Ajax的结合能显著提升Web应用的效率和用户体验。
42 3
|
1月前
|
前端开发 安全 应用服务中间件
前端性能调优:HTTP/2与HTTPS在Web加速中的应用
【10月更文挑战第26天】随着互联网的快速发展,前端性能调优成为开发者的重要任务。本文探讨了HTTP/2与HTTPS在前端性能优化中的应用,介绍了二进制分帧、多路复用和服务器推送等特性,并通过Nginx配置示例展示了如何启用HTTP/2和HTTPS,以提升Web应用的性能和安全性。
37 3
|
2月前
|
缓存 网络协议 前端开发
Web 性能优化|了解 HTTP 协议后才能理解的预加载
本文旨在探讨和分享多种预加载技术及其在提升网站性能、优化用户体验方面的应用。
|
2月前
|
弹性计算 安全 Windows
通过远程桌面连接Windows服务器提示“由于协议错误,会话将被中断,请重新连接到远程计算机”错误怎么办?
通过远程桌面连接Windows服务器提示“由于协议错误,会话将被中断,请重新连接到远程计算机”错误怎么办?
|
2月前
|
弹性计算 安全 关系型数据库
阿里云国际版远程连接Windows系统的ECS服务器时提示协议错误
阿里云国际版远程连接Windows系统的ECS服务器时提示协议错误
|
15天前
|
人工智能 数据可视化 数据挖掘
探索Python编程:从基础到高级
在这篇文章中,我们将一起深入探索Python编程的世界。无论你是初学者还是有经验的程序员,都可以从中获得新的知识和技能。我们将从Python的基础语法开始,然后逐步过渡到更复杂的主题,如面向对象编程、异常处理和模块使用。最后,我们将通过一些实际的代码示例,来展示如何应用这些知识解决实际问题。让我们一起开启Python编程的旅程吧!
下一篇
DataWorks