zoukankan      html  css  js  c++  java
  • Django-开胃菜

    第一篇:

    一.web应用

    web应用是什么

    Web应用程序是一种可以通过Web访问的应用程序,程序的最大好处是用户很容易访问应用程序,用户只需要有浏览器即可,不需要再安装其他软件

    应用程序有两种模式C/S、B/S。C/S是客户端/服务器端程序,也就是说这类程序一般独立运行。而B/S就是浏览器端/服务器端应用程序,这类应用程序一般借助IE等浏览器来运行。WEB应用程序一般是B/S模式。Web应用程序首先是“应用程序”,和用标准的程序语言,如C、C++等编写出来的程序没有什么本质上的不同。然而Web应用程序又有自己独特的地方,就是它是基于Web的,而不是采用传统方法运行的。换句话说,它是典型的浏览器/服务器架构的产物。

    web程序的优点

    • 网络应用程序不需要任何复杂的“展开”过程,你所需要的只是一个适用的浏览器;
    • 网络应用程序通常耗费很少的用户硬盘空间,或者一点都不耗费;
    • 它们不需要更新,因为所有新的特性都在服务器上执行,从而自动传达到用户端;
    • 网络应用程序和服务器端的网络产品都很容易结合,如email功能和搜索功能;
    • 因为它们在网络浏览器窗口中运行,所以大多数情况下它们是通过跨平台使用的 (例如Windows,Mac,Linux等等)

    web程序的缺点

    • 网络应用程序强调浏览器的适用性。如果浏览器方没有提供特定的功能,或者弃用特定的平台或操作系统版本(导致不适用),就会影响大量用户;
    • 网络应用依靠互联网远程服务器端的应用文件。因此,当连接出问题时,应用将不能正常使用。
    • 许多网络应用程序不是开源的,只能依赖第三方提供的服务,因此不能针对用户定制化、个性化,而且大多数情况下用户不能离线使用,因而损失了很多灵活性;
    • 它们完全依赖应用服务商的可及性。如果公司倒闭,服务器停止使用,用户也无法追索以前的资料。对比而看,即使软件制造商倒闭了,传统的安装软件也可以继续运行,尽管不能再更新或有其他用户服务;
    • 相似地,提供方公司对软件和其功能有了更大的控制权。只要他们愿意就能为软件添加新特性,即使用户想等bugs先被解决再更新。跳过较差的软件版本也不可能了。公司可以强加不受欢迎的特性给用户,也可以随意减少带宽来削减开支。
    • 公司理论上可以检索任何的用户行为。这有可能引起隐私安全问题。

    B/S架构优点

    浏览器/服务器架构(Browser/Server,简称B/S)能够很好地应用在广域网上,成为越来越多的企业的选择。浏览器/服务器架构相对于其他几种应用程序体系结构,有如下3方面的优点:

    • 这种架构采用Internet上标准的通信协议(通常是TCP/IP协议)作为客户机同服务器通信的协议。这样可以使位于Internet任意位置的人都能够正常访问服务器。对于服务器来说,通过相应的Web服务和数据库服务可以对数据进行处理。对外采用标准的通信协议,以便共享数据。
    • 在服务器上对数据进行处理,就处理的结果生成网页,以方便客户端直接下载。
    • 在客户机上对数据的处理被进一步简化,将浏览器作为客户端的应用程序,以实现对数据的显示。不再需要为客户端单独编写和安装其他类型的应用程序。这样,在客户端只需要安装一套内置浏览器的操作系统,直接安装一套浏览器,就可以实现服务器上数据的访问。而浏览器是计算机的标准设备

    总结一下,本质上:浏览器是一个socket客户端,服务器是一个socket服务端

    二 基于SOCKET写一个web应用

    import socket
    
    def server_run():
        soc = socket.socket()
        soc.bind(('127.0.0.1', 8008))
        soc.listen(5)
        while True:
            conn, addr = soc.accept()
            recv_data = conn.recv(1024)
            print(recv_data)
            # 1 直接在send里写,发送给客户端
            # conn.send(b'HTTP/1.1 200 OK
    
    <h1>hello web</h1><img src="https://gss2.bdstatic.com/9fo3dSag_xI4khGkpoWK1HF6hhy/baike/c0%3Dbaike92%2C5%2C5%2C92%2C30/sign=5e3814acf9edab64607f4592965fc4a6/14ce36d3d539b600c0c465d0eb50352ac65cb74b.jpg"></img>')
            #2 打开一个html文件,发送给客户端
            # with open('index.html','r',encoding='utf-8') as f:
            #     data=f.read()
            # conn.send(('HTTP/1.1 200 OK
    
    %s'%data).encode('utf-8'))
            # 3 动态网页,字符串替换
            import time
            now=time.strftime("%Y-%m-%d %H:%M:%S", time.localtime())
            print(now)
            with open('index.html','r',encoding='utf-8') as f:
                data=f.read()
            data=data.replace('@@@',now)
            conn.send(('HTTP/1.1 200 OK
    
    %s'%data).encode('utf-8'))
            conn.close()
    
    if __name__ == '__main__':
        server_run()
    

    index文件

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <h2>@@@</h2>
    
    <img src="https://gss2.bdstatic.com/9fo3dSag_xI4khGkpoWK1HF6hhy/baike/c0%3Dbaike92%2C5%2C5%2C92%2C30/sign=5e3814acf9edab64607f4592965fc4a6/14ce36d3d539b600c0c465d0eb50352ac65cb74b.jpg" alt="">
    </body>
    </html>
    

    三.手撸web框架

    import socket
    
    
    """
    请求首行
    b'GET / HTTP/1.1
    
    请求头(一大堆kv键值对)
    Host: 127.0.0.1:8080
    
    Connection: keep-alive
    
    Upgrade-Insecure-Requests: 1
    
    User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.169 Safari/537.36
    
    Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3
    
    Accept-Encoding: gzip, deflate, br
    
    Accept-Language: zh-CN,zh;q=0.9,en;q=0.8
    
    
    
    请求体
    '
    """
    server = socket.socket()  # 不传参数默认就是TCP协议
    server.bind(('127.0.0.1',8080))
    server.listen(5)
    
    
    while True:
        print('-------------')
        conn, addr = server.accept()  # 阻塞 等待客户端链接
        data = conn.recv(1024)
        # print(data)
        conn.send(b'HTTP/1.1 200 OK
    
    ')
        # print(data)
        # 手动处理http数据获取用户访问的路径
        # print(data.decode('utf-8').split('
    ')[0])
        # print(data.decode('utf-8').split('
    ')[0].split(' ')[1])
        current_path = data.decode('utf-8').split('
    ')[0].split(' ')[1]
        if current_path == '/index':
            # 路由匹配上之后返回index
            # conn.send(b'<h1>index</h1>')
            with open('index.html','rb') as f:
                conn.send(f.read())
        else:
            # 当匹配不上的时候统一返回404
            conn.send(b'404')
        conn.close()
       
    

    对于真实开发中的python web程序来说,一般会分为两部分:服务器程序和应用程序。

    服务器程序负责对socket服务器进行封装,并在请求到来时,对请求的各种数据进行整理。

    应用程序则负责具体的逻辑处理。为了方便应用程序的开发,就出现了众多的Web框架,例如:Django、Flask、web.py 等。不同的框架有不同的开发方式,但是无论如何,开发出的应用程序都要和服务器程序配合,才能为用户提供服务。

    这样,服务器程序就需要为不同的框架提供不同的支持。这样混乱的局面无论对于服务器还是框架,都是不好的。对服务器来说,需要支持各种不同框架,对框架来说,只有支持它的服务器才能被开发出的应用使用。

    这时候,标准化就变得尤为重要。我们可以设立一个标准,只要服务器程序支持这个标准,框架也支持这个标准,那么他们就可以配合使用。一旦标准确定,双方各自实现。这样,服务器可以支持更多支持标准的框架,框架也可以使用更多支持标准的服务器。

    WSGI(Web Server Gateway Interface)就是一种规范,它定义了使用Python编写的web应用程序与web服务器程序之间的接口格式,实现web应用程序与web服务器程序间的解耦。

    常用的WSGI服务器有uwsgi、Gunicorn。而Python标准库提供的独立WSGI服务器叫wsgiref,Django开发环境用的就是这个模块来做服务器。

    我们利用wsgiref模块来替换我们自己写的web框架的socket server部分:

    def run_server(environ, start_response):
        start_response('200 OK', [('Content-Type', 'text/html;charset=utf8'), ])  # 设置HTTP响应的状态码和头信息
        url = environ['PATH_INFO']  # 取到用户输入的url
        func = None
        for i in list1:
            if i[0] == url:
                func = i[1]
                break
        if func:
            response = func(url)
        else:
            response = b"404 not found!"
        return [response, ]
    
    
    if __name__ == '__main__':
        httpd = make_server('127.0.0.1', 8090, run_server)
        print("我在8090等你哦...")
        httpd.serve_forever()
    

    urls文件

    from views import *
    
    urls = [
        ('/index',index),
        ('/login',login),
        ('/reg',reg),
        ('/get_time',get_time),
        ('/get_user',get_user),
        ('/get_db',get_db),
    ]
    

    views文件

    import time
    from jinja2 import Template
    import pymysql
    
    
    def index(env):
        return 'index'
    
    def login(env):
        return 'login'
    
    def reg(env):
        return 'reg'
    
    def get_time(env):
        # 先获取当前时间
        current_time = time.strftime('%Y-%m-%d %X')
        # 打开html文件读取内容返回给客户端
        with open(r'templates/get_time.html','r',encoding='utf-8') as f:
            data = f.read()
        # 因为是以r模式打开的文件,所有获取到的内容就是一堆字符串
        res = data.replace('@@time@@',current_time)  # 字符串的替换
        return res
    
    def get_user(env):
    
        with open(r'templates/get_user.html','r',encoding='utf-8') as f:
            data = f.read()
        tmp = Template(data)
        # 将字典传递给前端页面 前端通过变量名user_dic就可以获取到该字典
        return tmp.render(user_dic={'name':"jason",'password':'123'})
    
    
    def get_db(env):
        # 连接数据库 获取数据 渲染到前端页面
        conn = pymysql.connect(
            host = '127.0.0.1',
            port = 3306,
            user = 'root',
            password = '123',
            database = 'day54',
            charset = 'utf8',
            autocommit = True
        )
        cursor = conn.cursor(pymysql.cursors.DictCursor)
        cursor.execute('select * from userinfo')
        user_dict= cursor.fetchall()  # [{},{},{},{}]
        with open(r'templates/get_db.html','r',encoding='utf-8') as f:
            data = f.read()
        tmp = Template(data)
        return tmp.render(user_dict=user_dict)
    
    def error(env):
        return '404 error'
    

    templates里面的html文件

    get_db.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
        <link href="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>
    </head>
    <body>
    <div class="container">
        <div class="row">
            <div class="col-md-8 col-md-offset-2">
                <table class="table table-hover table-striped table-bordered">
                    <thead>
                        <tr>
                            <th>id</th>
                            <th>name</th>
                            <th>password</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for user in user_dict %}  <!--[{},{},{},{}]-->
                            <tr>
                                <td>{{ user.id }}</td>
                                <td>{{ user.name }}</td>
                                <td>{{ user.password }}</td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
    
    
            </div>
        </div>
    </div>
    {{ user_dict }}  <!--[{},{},{},{}]-->
    
    </body>
    </html>
    

    get_time.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
        <link href="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>
    </head>
    <body>
    @@time@@
    </body>
    </html>
    

    get_user.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
        <link href="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>
    </head>
    <body>
    <p>{{ user_dic }}</p>
    <p>{{ user_dic.name }}</p>
    <p>{{ user_dic['password'] }}</p>
    <p>{{ user_dic.get('name') }}</p>
    
    
    
    </body>
    </html>
    
    

    第二篇 HTTP协议详解

    一.协议简介

    HTTP协议是Hyper Text Transfer Protocol(超文本传输协议)的缩写,是用于万维网(WWW:World Wide Web )服务器与本地浏览器之间传输超文本的传送协议。

    HTTP是一个属于应用层的面向对象的协议,由于其简捷、快速的方式,适用于分布式超媒体信息系统。它于1990年提出,经过几年的使用与发展,得到不断地完善和扩展。HTTP协议工作于客户端-服务端架构为上。浏览器作为HTTP客户端通过URL向HTTP服务端即WEB服务器发送所有请求。Web服务器根据接收到的请求后,向客户端发送响应信息。

    二 http协议特性

    (1)基于TCP/IP协议之上的应用层协议

    (2)基于请求-响应模式

    HTTP协议规定,请求从客户端发出,最后服务器端响应该请求并 返回。换句话说,肯定是先从客户端开始建立通信的,服务器端在没有 接收到请求之前不会发送响应

    (3)无状态保存

    HTTP是一种不保存状态,即无状态(stateless)协议。HTTP协议 自身不对请求和响应之间的通信状态进行保存。也就是说在HTTP这个 级别,协议对于发送过的请求或响应都不做持久化处理。

    使用HTTP协议,每当有新的请求发送时,就会有对应的新响应产 生。协议本身并不保留之前一切的请求或响应报文的信息。这是为了更快地处理大量事务,确保协议的可伸缩性,而特意把HTTP协议设计成 如此简单的。可是,随着Web的不断发展,因无状态而导致业务处理变得棘手 的情况增多了。比如,用户登录到一家购物网站,即使他跳转到该站的 其他页面后,也需要能继续保持登录状态。针对这个实例,网站为了能 够掌握是谁送出的请求,需要保存用户的状态。HTTP/1.1虽然是无状态协议,但为了实现期望的保持状态功能, 于是引入了Cookie技术。有了Cookie再用HTTP协议通信,就可以管 理状态了。有关Cookie的详细内容稍后讲解

    4)无连接

    无连接的含义是限制每次连接只处理一个请求。服务器处理完客户的请求,并收到客户的应答后,即断开连接。采用这种方式可以节省传输时间。

    请求协议

    请求格式:

    请求方式: get与post请求

    • GET提交的数据会放在URL之后,以?分割URL和传输数据,参数之间以&相连,如EditBook?name=test1&id=123456. POST方法是把提交的数据放在HTTP包的请求体中.

    • GET提交的数据大小有限制(因为浏览器对URL的长度有限制),而POST方法提交的数据没有限制.

    • GET与POST请求在服务端获取请求数据方式不同。

      '''
          GET请求
          # 请求首行
          GET / HTTP/1.1
      
          # get请求后面的参数
          GET /?name=lqz&age=18 HTTP/1.1
      
          # 请求头
          Host: 127.0.0.1:8008
      
          Connection: keep-alive
      
          Cache-Control: max-age=0
      
          Upgrade-Insecure-Requests: 1
      
          User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 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=7xx6BxQDJ6KB0PM7qS8uTA892ACtooNbnnF4LDwlYk1Y7S7nTS81FBqwruizHsxF
      
      '
          # 请求体(get请求,请求体为空)    
          '''
          '''
          POST请求
          # 请求首行
          POST /?name=lqz&age=18 HTTP/1.1
      
          # 请求头
          Host: 127.0.0.1:8008
      Connection: keep-alive
      Content-Length: 21
      Cache-Control: max-age=0
      Origin: http://127.0.0.1:8008
      Upgrade-Insecure-Requests: 1
      Content-Type: application/x-www-form-urlencoded
      User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36
      Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8
      Referer: http://127.0.0.1:8008/?name=lqz&age=18
      Accept-Encoding: gzip, deflate, br
      Accept-Language: zh-CN,zh;q=0.9
      Cookie: csrftoken=7xx6BxQDJ6KB0PM7qS8uTA892ACtooNbnnF4LDwlYk1Y7S7nTS81FBqwruizHsxF
      
      
          # 请求体
          name=lqz&password=123'
          
          '''
      
      GET请求和POST请求
      
      

      响应协议

      响应格式

    响应状态码

    状态码的职 是当客户端向服务器端发送请求时, 返回的请求 结果。借助状态码,用户可以知道服务器端是正常 理了请求,还是出 现了 。状态码如200 OK,以3位数字和原因 成。数字中的 一位指定了响应 别,后两位无分 。响应 别有以5种。

    URL简介

    统一资源定位符是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示,是互联网上标准资源的地址。互联网上的每个文件都有一个唯一的URL,它包含的信息指出文件的位置以及浏览器应该怎么处理它

    格式:

      协议://IP:端口(80)/路径?name=lqz&age=18

    ?之前的是请求路径,?之后的是请求数据部分

    import socket
    
    
    sock=socket.socket()
    sock.bind(("127.0.0.1",8808))
    sock.listen(5)
    
    while 1:
        print("server waiting.....")
        conn,addr=sock.accept()
        data=conn.recv(1024)
        print("data", data)
    
        # 读取html文件
        with open("login.html","rb") as f:
            data=f.read()
    
        conn.send((b"HTTP/1.1 200 OK
    Content-type:text/html
    
    %s"%data))
        conn.close()
    
    

    借鉴https://www.cnblogs.com/liuqingzheng/articles/9523086.html#_label0https://www.cnblogs.com/Dominic-Ji/articles/10982272.html

  • 相关阅读:
    ui5 call view or method from another view
    vuejs helloworld
    vuejs v-model
    vuejs v-bind
    vuejs on
    vuejs fatherandson
    vuejs scope
    vuejs keep-alive
    VLAN虚拟局域网
    网线的制作
  • 原文地址:https://www.cnblogs.com/njzy-yuan/p/10987603.html
Copyright © 2011-2022 走看看