Front and rear side interaction acquaintance

Software development framework

c / s architecture
b / s architecture
NOTE: b / s are essentially c / s

HTTP protocol

Four characteristics
- Over TCP / IP based application layer acting
- Based on a request response
- Stateless Note: that [cookie session token]
- No connection Note: long connection websocket (large patches HTTP protocol)
Data Format
Request format
request the first line (request method, protocol version)
request header (a bunch k: v key-value pairs)
\ r \ the n-
request form (real data when finished will have a post request, if the request is get no)
response format
in response to the first line
in response to the first
\ r \ n
response body
Status response code
represent some meaning in particular digital
1XX: the server has successfully received the data you are dealing with which you can continue to submit data
2XX: server success response (200 requests)
3XX: Redirection
4XX: Error request (resource request 404 there is no 403 access Denied)
5XX: internal server error (500)

Request method

get request
towards others to data
post request
to submit data to others (for example: what users logged in)
url: Uniform Resource Locator

Hand line and Lite web framework

Primarily using socket programming, the start will be a browser request sent over a data header, the data may need to get used from the inside, at the time of transmission according to a fixed transmission format conn.send (b'HTTP / 1.1 200 OK \ r \ n \ r \ n message ')

import socket

server = socket.socket()
server.bind(('127.0.0.1', 8081))
server.listen(5)  # 半连接池
# 接收浏览器数据
while 1:
    conn, addr = server.accept()
    data = conn.recv(1024)
    headers = data.decode('utf8').split(" ")[1]
    print(headers)
    conn.send(b'HTTP/1.1 200 OK\r\n\r\nhello') # 发送格式
""" # 浏览器发送过来的数据 - headers
b'GET / HTTP/1.1\r\n - 请求首行

Host: 127.0.0.1:8081\r\n - 请求头
Connection: keep-alive\r\n
Cache-Control: max-age=0\r\n
Upgrade-Insecure-Requests: 1\r\n
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/77.0.3865.120 Safari/537.36\r\n
Sec-Fetch-Mode: navigate\r\n
Sec-Fetch-User: ?1\r\n
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3\r\n
Sec-Fetch-Site: none\r\nAccept-Encoding: gzip, deflate, br\r\n
Accept-Language: zh-CN,zh;q=0.9\r\n
\r\n'
"""

Based wsgiref module

Routing and object-relational view urls.py
views.py view function is put (processing business logic)
templates Templates folder (a bunch of html files)

The following file is a simple version of the web-based module wsgiref

In fact, this is a split according to different modules into different py file, after completion of the split, in order to add functionality, just add the data in two places urls and views on it

urls.py

import views
func = {
    '/index': views.index,
    '/login': views.login,
    '/register': views.register
}

views.py

def index():
    return b'index'


def login():
    return b'login'


def register():
    return b'register'

Reception place .py

from wsgiref.simple_server import make_server
import urls


def run(env, response):
    """
    :param env: 请求相关的所有数据
    :param response: 响应相关的所有数据
    :return:
    """
    response('200 OK', [])
    choice = env.get('PATH_INFO')
    print(choice)
    if choice in urls.func:
        res = urls.func.get(choice)()
        return [res]
    else:
        return [bytes(404)]


if __name__ == '__main__':
    server = make_server('127.0.0.1', 8081, run)
    server.serve_forever()

Static and dynamic pages

Static pages

Data is written to die the same years

dynamic webpages

Data is acquired in real time

EG:
1. Get the current time shows the rear end to the front end
2. The front end rear acquired display data in the database to

doubt:

How to get to the back-end data transfer to the html page

==> backend acquired data to the html page >>>: template rendering

jinja2 module - to address how to pass data to the back end of the front display questions

Template syntax (grammar extremely close to the python backend)

<p>{{ user }}</p>
<p>{{ user.name }}</p>
<p>{{ user['pwd'] }}</p>
<p>{{ user.get('hobby') }}</p>

# 以上三种方式都是和python的取值方式一致