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\r\n
请求头(一大堆kv键值对)
Host: 127.0.0.1:8080\r\n
Connection: keep-alive\r\n
Upgrade-Insecure-Requests: 1\r\n
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.169 Safari/537.36\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
Accept-Encoding: gzip, deflate, br\r\n
Accept-Language: zh-CN,zh;q=0.9,en;q=0.8\r\n
\r\n
请求体
"""


while True:
    conn,addr = server.accept()  # 阻塞 等待客户端链接
    data=conn.recv(1024)
    conn.send(b'HTTP/1.1 200 OK\r\n\r\n')
    print(data)
    #手动处理http数据获取用户访问的路径
    current_path = data.decode('utf-8').split('\r\n')[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键值对）
                                  #这里一定会有空格，就是\r\n   隔开数据的分隔符
# 请求体（post请求携带的数据）

# 数据格式之响应：
# 响应首行（）
# 响应头（一堆key,value键值对）
                                 #这里一定会有空格，就是\r\n   隔开数据的分隔符
# 响应体（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\前端\Django\html\get_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\前端\Django\html\get_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\前端\Django\html\get_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

Django前戏

Django前戏

软件开发架构

动静态网页

模板渲染

什么是web框架

Django简介

创建Django项目方式

Django各个文件的作用

Django小白必会三板斧

注意事项

纯手撸web框架

基于wsgire框架

urls.py

views.py

Templates文件夹下

get_db.html

get_time.thml

get_user.thml

推荐阅读