Django框架和前端的的基本结合

1 昨日回顾
   a socket
   b 路由关系
   c 模板字符串替换（模板语言）

主流web框架总结：
   django   a用别人的  b自己写的   c自己写的
   flask    a用别人的  b自己写的   c用别人的（jinja2）
   tornado  a自己写的  b自己写的   c自己写的

另一个维度：
   djaogo
   其他

创建Django
   1 模块安装（三种方法）
      1 ---
      2 --
      3--
   2 django-admin startproject  mysite

   3 manage.py 管理我的django项目
   4 （1）启动django--python3
      -manage.py runserver 127.0.0.1:8002
      -manage.py runserver 8002
      -manage.py runserver
     （2）pycharm启动：1  跟上面一样
                  2 点绿色的箭头
      不是点右键运行
   5 停止 ctrl+c

   6 目录介绍
      settings--django全局配置文件
      urls---路由关系


app:
   命令：python3 manage.py startapp app01
   目录：
      migrations：数据库迁移的文件
      admin：后台管理相关
      apps：app配置相关
      models：模型，数据库相关，写一些类
      tests：测试相关
      views：视图函数

settings：
   DEBUG
   INSTALLED_APPS---》放app的名字
   MIDDLEWARE--》中间件
   TEMPLATES---》指定模板文件放的路径
   DATABASES---》指定连接的数据库


静态文件配置：（名字一定不能错）
STATICFILES_DIRS=[
    os.path.join(BASE_DIR, 'static'),
]


三件套：
# render 模板渲染
# HttpResponse 返回字符串
# redirect 重定向



orm：对象关系映射
python代码------》sql
前端：
$("#app")------>document.getEmlementById（‘app’）

优点：
   1 sql掌握一般，也可开发程序
   2 开发效率高
   3 易用，学习曲线短

缺点：
   1 sql大神，执行效率高，可能orm 执行效率低
   2 有的sql写不出来



作业：
   1 上课讲的代码敲完
   2 写个注册，登录
   3 看一下orm（有余力）



项目的基本配置 settings文件

"""
Django settings for mySecond project.

Generated by 'django-admin startproject' using Django 1.11.

For more information on this file, see
https://docs.djangoproject.com/en/1.11/topics/settings/

For the full list of settings and their values, see
https://docs.djangoproject.com/en/1.11/ref/settings/
"""

import os

# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
# 根路径 mySecond
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))


# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/1.11/howto/deployment/checklist/

# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = 'uzz2#7dq+qruh2e6&cklrwj49(oe0&@hwaqqtkmb0z2xmhe03*'

# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True

ALLOWED_HOSTS = []


# Application definition

# 放app的名字
INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    # 新建的功能项目需要添加到INSTALLED_APPS
    # app01下面的apps里面的App01Config
    'app01.apps.App01Config',
]

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    # 'django.middleware.csrf.CsrfViewMiddleware',  中间件 跨站攻击防护的先注释掉，以后再加上
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

ROOT_URLCONF = 'mySecond.urls'

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        # 把模板路径放到里面
        'DIRS': [os.path.join(BASE_DIR, 'templates')] # 如果创建项目的时候括号里没有内容需要手动加上
        ,
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

WSGI_APPLICATION = 'mySecond.wsgi.application'


# Database
# https://docs.djangoproject.com/en/1.11/ref/settings/#databases

# DATABASES---》指定连接的数据库
DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.sqlite3',
        'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
    }
}


# Password validation
# https://docs.djangoproject.com/en/1.11/ref/settings/#auth-password-validators

AUTH_PASSWORD_VALIDATORS = [
    {
        'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
    },
]


# Internationalization
# https://docs.djangoproject.com/en/1.11/topics/i18n/

LANGUAGE_CODE = 'en-us'

TIME_ZONE = 'UTC'

USE_I18N = True

USE_L10N = True

USE_TZ = True


# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.11/howto/static-files/

# 静态文件配置：（名字一定不能错）
# STATICFILES_DIRS=[
#     os.path.join(BASE_DIR, 'static'),
# ]
STATIC_URL = '/static/' # 这步相当于做了个接口，通过接口来访问STATICFILES_DIRS
# 如果不写static_url这个接口，外面可以直接调用里面的文件
STATICFILES_DIRS=[
    os.path.join(BASE_DIR, 'static'),
]

 

管理django项目的manage文件

#!/usr/bin/env python
import os
import sys

if __name__ == "__main__":
    os.environ.setdefault("DJANGO_SETTINGS_MODULE", "mySecond.settings")
    try:
        from django.core.management import execute_from_command_line
    except ImportError:
        # The above import may fail for some other reason. Ensure that the
        # issue is really that Django is missing to avoid masking other
        # exceptions on Python 2.
        try:
            import django
        except ImportError:
            raise ImportError(
                "Couldn't import Django. Are you sure it's installed and "
                "available on your PYTHONPATH environment variable? Did you "
                "forget to activate a virtual environment?"
            )
        raise
    execute_from_command_line(sys.argv)

 

 

urls 存放请求地址和函数关系的路由

"""mySecond URL Configuration

The `urlpatterns` list routes URLs to views. For more information please see:
    https://docs.djangoproject.com/en/1.11/topics/http/urls/
Examples:
Function views
    1. Add an import:  from my_app import views
    2. Add a URL to urlpatterns:  url(r'^$', views.home, name='home')
Class-based views
    1. Add an import:  from other_app.views import Home
    2. Add a URL to urlpatterns:  url(r'^$', Home.as_view(), name='home')
Including another URLconf
    1. Import the include() function: from django.conf.urls import url, include
    2. Add a URL to urlpatterns:  url(r'^blog/', include('blog.urls'))
"""
from django.conf.urls import url
from django.contrib import admin
from app01 import views
urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^index/', views.index),
    url(r'^login/', views.login),
    url(r'^login_submit/', views.login_submit),
]

 

 

views  视图函数的存放点

from django.shortcuts import render,HttpResponse,redirect
# 三件套 render 模板渲染
# HttpResponse 返回字符串
# redirect 重定向
import pymysql


# redirect  重定向
# Create your views here.


def index(request):
    # with open('templates/index','r') as f:
    #     data=f.read()
    print(request.method)

    # return HttpResponse('<h1>Hellw</h1>')
    return render(request, 'index.html')


def login111(request):
    # GET 一定要大写
    if request.method == 'GET':
        return render(request, 'login.html')
    elif request.method == 'POST':
        name = request.POST['name']
        # 推荐用这种
        # request.POST  请求体的内容都在里面，字典形式
        # <QueryDict: {'name': ['123'], 'password': ['444']}>
        password = request.POST.get('password', None)
        conn = pymysql.connect(host='127.0.0.1', user='root', password="123", database='test', port=3306)

        cursor = conn.cursor(pymysql.cursors.DictCursor)
        cursor.execute('select * from user where  name=%s and password=%s', [name, password])
        user = cursor.fetchone()
        if user:
            return HttpResponse('登录成功')
        # if name == 'lqz' and password == '123':
        #     # return HttpResponse('登录成功')
        #     return redirect('www.baidu.com')
        #     # return redirect('http://127.0.0.1:8000/index/')
        else:
            error = '用户名或密码错误'
            return render(request, 'login.html', {'error': error})


def login(request):
    error = ''
    if request.method == 'POST':
        name = request.POST['name']
        password = request.POST.get('password', None)
        conn = pymysql.connect(host='127.0.0.1', user='root', password="123", database='test', port=3306)
        cursor = conn.cursor(pymysql.cursors.DictCursor)
        cursor.execute('select * from user where  name=%s and password=%s', [name, password])
        user = cursor.fetchone()
        if user:
            return HttpResponse('登录成功')
        else:
            error = '用户名或密码错误'
    return render(request, 'login.html', {'error': error})


def login_submit(request):
    # print(request.get_full_path())
    # print(request.method)
    print(request.POST)
    name = request.POST.get('name',None)
    # 推荐用这种
    # request.POST  请求体的内容都在里面，字典形式
    # <QueryDict: {'name': ['123'], 'password': ['444']}>
    password = request.POST.get('password', None)
    if name == 'lqz' and password == '123':
        # return HttpResponse('登录成功')
        return redirect('/index/')

    return redirect('/login/')

 

注意：html结尾的这些文件通常都放在templates下，称作模板

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/static/css/mycss.css">
</head>
<body>
<h1>Hello</h1>
</body>
</html>

 

 

login.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/bootstrap-3.3.7-dist/css/bootstrap.min.css">
</head>
<body>
<div class="container">

<div class="row">

    <div class="col-md-6 col-md-offset-3">

            <form action="" method="post">

                <p>用户名：<input type="text" name="name" class="form-control" ></p>
                <p>密码：<input type="password" name="password" class="form-control"></p>
                <p><input type="submit" value="登录" class="form-control"></p>
                <p class="text-danger text-center">{{ error }}</p>


</form>
    </div>
</div>

</div>



</body>
</html>

 

static文件：下面存放着css,js,img,bootstrap等。。

 

 

最后，附上自己的作业：

from django.shortcuts import render,HttpResponse,redirect

# Create your views here.
# 视图层函数里面就是一个个需要通过路由来调用并访问的函数
# 调用函数的目的是为了去访问模板层。
import pymysql


def index(request):
    with open('templates/index','r') as f:
        print(f.read())
    return render(request,'index.html')
    # return HttpResponse('<h1>hellowword</h1>')




def register(request):
    if request.method == 'GET':
        return render(request,'register.html')
    elif request.method == 'POST':
        name = request.POST.get('name',None)
        password = request.POST.get('password',None)
        re_password = request.POST.get('re_password',None)
        if password != re_password:
            return HttpResponse('password is not similar')
        else:
            conn = pymysql.connect(host='127.0.0.1', user='root', password="123", database='test', port=3306)

            cursor = conn.cursor(pymysql.cursors.DictCursor)
            cursor.execute('select * from user where name=%s and password = %s', [name, password])
            user = cursor.fetchone()
            if user:
                return HttpResponse('having the similar user please change the user or password')
            else:
                # 数据库建表的时候要递增
                cursor.execute('insert into user(name,password) values(%s,%s) ', [name, password])
                print(request.POST.get('name',None))
                # 必须要提交，否则不会写到数据库里
                conn.commit()
                # 必须要有返回值
                return HttpResponse('sn')

def login(request):
    if request.method == 'GET':
        return render(request,'login.html')
    elif request.method == 'POST':
        name = request.POST.get('name',None)
        password = request.POST.get('password',None)
        conn = pymysql.connect(host='127.0.0.1', user='root', password="123", database='test', port=3306)

        cursor = conn.cursor(pymysql.cursors.DictCursor)
        cursor.execute('select * from user where  name=%s and password=%s', [name, password])
        user = cursor.fetchone()
        if user:
            return HttpResponse('login success')
        else:
            error = "logging fail,relog again"
            return render(request,'login.html',{'error':error})

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>register</title>
    <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.min.css">
</head>
<body>
    <div class = 'row'>
        <div class = 'col-md-6 col-md-offset-3'>
        <form action="" method = 'post'>
            <p>user：<input type="text" name="name" class="form-control" ></p>
            <p>pwd：<input type="password" name="password" class="form-control"></p>
            <p>re_pwd：<input type="password" name="re_password" class="form-control"></p>
            <p><input type="submit" value="register" class="form-control"></p>
            <p class="text-danger text-center">{{ error }}</p>
        </form>
        </div>
    </div>

</body>
</html>