zoukankan      html  css  js  c++  java
  • Django前戏

    Django前戏

    软件开发架构

    c/s架构
       客户端
       服务端
    b/s架构
       浏览器
       服务器
    本质:b/s架构其实也是c/s架构
    

    动静态网页

    静态网页:
    页面上的数据都是写死的,万年不变
    动态网页:
    页面上的数据是从后端动态获取的
    比如后端获取当前时间
    后端获取数据库数据然后传递给前端页面
    

    模板渲染

    后端生成的数据直接传递给前端页面使用(并且前端页面可以灵活的操作改数据)》》》模板语法
    模板渲染 模板语法需要依赖于第三方模块
    pip install jinja2
    
    
    模板语法 jinja2 支持前端直接使用类似于python的语法操作数据
    ({user_dic})
    ({user_dic.name})
    ({user_dic['password']})
    {{user_dic.get('name')}}}
       {% for user in user_dict %}  <!--[{},{},{},{}]-->
          <tr>
             <td>{{ user.id }}</td>
             <td>{{ user.name }}</td>
             <td>{{ user.password }}</td>
          </tr>
       {% endfor %}
    

    什么是web框架

    python 三大主流web框架
    Django :大而全,自带了很多功能模块,类似于哆啦A梦的口袋(缺点:有点笨重)
    Flask :短小精悍,自带的功能模块特别少,大部分都是依赖于第三方模块(小而轻)
    Tornado: 异步非阻塞,主要是用于处理高io 多路复用的情况,可以写游戏后端
    
    
    a:socket
    b:路由与视图函数
    c;模板渲染
    Django:
    a用别人的wegiref
    b自己写的
    c自己写的
    Flask;
    a用别人的werkzeug
    b自己写的
    c用别人的 jinja2
    
    Tornado:
    a,b,c都是自己写的
    

    Django简介

        版本问题
       djang下载  会自动放在全局变量pip里
          推荐下载1.11.11版本
       命令行直接下载
          pip3 install django==1.11.11
       pycharm下载
    验证是否下载成功
    命令行django-admin
    

    创建Django项目方式

    创建django项目的方式
    方式1(命令行创建):
    创建django项目
    django-admin startproject 项目名   先切换到D盘下cd D:  再创建
    创建app应用
    python3 manage.py startapp app01   # 跟python会有版本兼容的问题,python3.7不能兼容1.1版本的django,要下载2.0版本以上
    启动django
    python3 manage.py runserver   一定要先切换到创建了django文件的目录下,如django-admin startproject mysite  文件在mysite里,mysite下载在D盘里
    所有要cd D:/mysite 再输入python3 manage.py runserver
    将网址复制到浏览器可查看
    ps:用命令行创建django默认不会自动创建templates文件夹需要你手动自己创建(注意改文件夹路劲是否被添加配置文件中)
    
    方式2(pycharm创建)
    FILE >>> new project 选择第二个django 需要注意名字不能有中文,选择本地的解释器,勾选后台管理
    创建app
        pycharm命令行创建
        python3 manage.py startapp app01
        Tools下面run manage task功能栏
    启动点小绿色箭头 停止点小红方  查看直接点显示出来的网址
    当前django文件下拉框中的edit configurations 中可以手动改端口
    下拉框中如果没有你的django文件就点edit configurations 中点击小加号,然后点击django server
    
    
    django相当于一个大学 ,空壳子,需要创建一个个app来跑起功能
    app(application)的概念(相当于学院)
    注意新创建的app需要在配置文件中注册才能生效(*******************)
    INSTALLED_APPS = [
        'django.contrib.admin',
        'django.contrib.auth',
        'django.contrib.contenttypes',
        'django.contrib.sessions',
        'django.contrib.messages',
        'django.contrib.staticfiles',
       'app01.apps.App01Config'  # 可以用全称
       'app01'              # 也可以简写
    

    Django各个文件的作用

    diango各个文件的作用
    应用名
    migrations 数据库迁移记录相关数据
    admin.py   django后台管理相关
    models.py 模型表相关
    views.py  视图函数
    项目名
    settings.py 配置文件
    urls.py 路由与视图函数的映射关系
    templates 所有项目用到的html文件改文件夹存放就是所有的页面文(.html)
    mange.py django的入口文件
    

    Django小白必会三板斧

    from django.shortcuts import render,HttpResponse,redirect
    
    HttpResponse  返回字符串
    render        返回一个html页面(在templates文件中创建)
       两种给前端页面传值的方式
          def reg(request):
             user_dict = {'name':'jason','password':'123'}
             return render(request,'reg.html',{'user_dict':user_dict})
    
          def reg(request):
             user_dict = {'name':'jason','password':'123'}
             return render(request,'reg.html',locals()) #locals获取所有return之前定义的逻辑代码中的变量,
    
    redirect     重定向
    

    注意事项

    1.计算机的名字不能是中文
    2.一个pycharm窗口就是一个项目,不要多个项目放在一个pycharm窗口中
    3.项目名不能起中文
    强调:
             1.用django一定要保证只有一个在运行状态  切记切记!!!!!!!
             2.一定记得清浏览器的缓存
    
    django识别到你的代码变化之后会自动,但是有时候反应速度比较慢
    你可以手动重启,你也可以多刷新几次浏览器
    

    纯手撸web框架

    import socket
    
    server=socket.socket()  # 不传参数默认就是TCP协议
    
    
    server.bind(('127.0.0.1',8080))
    
    server.listen(5)
    
    
    """
    请求首行
    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
    
    
    
    请求体
    """
    
    
    while True:
        conn,addr = server.accept()  # 阻塞 等待客户端链接
        data=conn.recv(1024)
        conn.send(b'HTTP/1.1 200 OK
    
    ')
        print(data)
        #手动处理http数据获取用户访问的路径
        current_path = data.decode('utf-8').split('
    ')[0].split(' ')[1]
        if current_path == '/index':
            # 路由器匹配上之后返回index
            # conn.send(b'<h1>index</h1>')
           # conn.send(b'index')
            with open('index.html', 'rb')as f:
                conn.send(f.read())
        else:
            #当匹配不上的时候同意返回404
            conn.send(b'404')
        conn.close()
    
    # http协议
    # 超文本传输协议:规定了客户端与服务端消息传输格式
    # 四大特性:
    # 1.基于tcp/ip协议,作用于应用层的协议
    # 2.基于请求响应(服务器不会向客户端主动发消息)
    # 3.无状态(不保存客户端的状态,如你给我1000次hello world 我就给你1000次)
    # 4.无连接(你请求我,我给你一次数据,之后就没关系了)
    # 数据格式之请求:
    # 请求首行()
    # 请求头(一堆key,value键值对)
                                      #这里一定会有空格,就是
       隔开数据的分隔符
    # 请求体(post请求携带的数据)
    
    # 数据格式之响应:
    # 响应首行()
    # 响应头(一堆key,value键值对)
                                     #这里一定会有空格,就是
       隔开数据的分隔符
    # 响应体(post请求携带的数据)
    # status code:200  响应状态码 200请求成功   404请求资源不存在
    # 响应状态码
    # 1xx(1开头)  服务器已经成功接受到你的数据正在处理,你可以继续提交其他的
    # 2xx 请求成功 服务器已经将你请求的数据发送给你了
    # 3xx 重定向
    # 4xx 请求的资源不存在
    # 5xx 服务器错误
    

    基于wsgire框架

    from wsgiref.simple_server import make_server
    
    from Django import urls,views
    
    
    # def index():
    #     return index
    #
    #
    # def login():
    #     return login
    #
    #
    # def error():
    #     return error
    
    # urls = [
    #     ('/index', index),
    #     ('/login', login),
    #
    # ]
    def run (env, response):
        '''
    
        :param env: 请求相关的信息
        :param response: 响应相关的信息
        :return:
        '''
        print(env)  #大字典 找PATH_INFO对应的是访问的网址后缀  ( # 是一个大字典 里面装了一堆处理好了的键值对数据)
        response('200 OK',[('username', 'jason'),('password','123')]) #固定写法,后面的列表里面一个个元组会已key,v键值的返回给客户端
        current_path=env.get('PATH_INFO')
        # if current_path == '/index':
        #     return [b'index']
        # elif current_path == '/login':
        #     return[b'login']
        #
        #定义一个存储函数名的变量名
        func=None
        #循环比对路由与视图函数的印象关系
        for url_map in urls.urls: #url_map = ('/index',index)
            if current_path == url_map[0]:
                func = url_map[1]
                # 只要匹配成功就结束循环
                break
        if func:
            res = func(env)
        else:
            res = views.error(env)
    
        return[res.encode('utf-8')]
    
    if __name__ == '__main__':
        server = make_server('127.0.0.1',8080,run)
        server.serve_forever()
    

    urls.py

     #urls路由
    
    
    from Django import views
    urls = [
        ('/index', views.index),
        ('/login', views.login),
        ('/get_time', views.get_time),
        ('/get_user', views.get_user),
        ('/get_db',views.get_db)
    
    ]
    

    views.py

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

    Templates文件夹下

    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>
    
        <link href="https://cdn.bootcss.com/font-awesome/5.8.2/css/fontawesome.min.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/font-awesome/5.8.2/js/fontawesome.min.js"></script>
    
        <link href="https://cdn.bootcss.com/sweetalert/1.1.3/sweetalert.min.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/sweetalert/2.1.2/sweetalert.min.js"></script>
    </head>
    <body>
    <div class="container">
        <div class="row">
            <div class="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.thml

    <!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>
    
        <link href="https://cdn.bootcss.com/font-awesome/5.8.2/css/fontawesome.min.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/font-awesome/5.8.2/js/fontawesome.min.js"></script>
    
        <link href="https://cdn.bootcss.com/sweetalert/1.1.3/sweetalert.min.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/sweetalert/2.1.2/sweetalert.min.js"></script>
    </head>
    <body>
    @@time@@
    </body>
    </html>
    

    get_user.thml

    <!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>
    
        <link href="https://cdn.bootcss.com/font-awesome/5.8.2/css/fontawesome.min.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/font-awesome/5.8.2/js/fontawesome.min.js"></script>
    
        <link href="https://cdn.bootcss.com/sweetalert/1.1.3/sweetalert.min.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/sweetalert/2.1.2/sweetalert.min.js"></script>
    </head>
    <body>
    ({user_dic})
    ({user_dic.name})
    ({user_dic['password']})
    {{user_dic.get('name')}}
    </body>
    </html>
    

    点击右键检查进入,然后点击settings,一定要把Disable cache勾上,防止出bug
    
  • 相关阅读:
    高精度求n的累加和
    软件测试简介
    实数加法
    洛古P1542
    css制作三角形 实心的和空心的(笔试常考,特此分享)!!!!
    关于http主要的状态码
    关于http和https的概念和区别
    JavaScript关于闭包的理解和实例
    关于css编写
    关于javascript中apply()和call()方法的区别
  • 原文地址:https://www.cnblogs.com/huangxuanya/p/10982321.html
Copyright © 2011-2022 走看看