第十八章 DjangoWeb开发框架
第十八章 DjangoWeb开发框架
第一课 内容概要：
1.JS正则
-登录注册验证
2.组件
1.BootStrap
-css
-js
学习BootStrap规则
2.jQueryUI
-css
-js
学习jQueryUI规则
3.EasyUI
-css
-js
学习EasyUI规则
3.Web框架
4.Django（python功能最齐全的Web框架）
第二课 JS正则
1.test -判断字符串是否符合规定的正则
req=/\d+/;
req.test('adsfjogan66dfsa')
#ture
2.exec -获取匹配的数据
req=/\d+/
req.exec('adsfjogan66dfsa')
#["66", index: 9, input: "adsfjogan66dfsa"]
代码（浏览器控制台Console）：
text='javascript is more fun than java or javabeans!'
var pattern=/\bjava\w*\b/;
pattern.exec(text);
#["javascript",]
var pattern=/\bjava(\w*)\b/;
pattern.exec(text);
#["javascript", "script"]
var pattern=/\bjava(\w*)\b/g;
pattern.exec(text);
#["javascript", "script"]
pattern.exec(text);
#["java", ""]
pattern.exec(text);
#["javabeans", "beans"]
pattern.exec(text);
#null
-登录注册验证（前端）：
第三课 组件
EasyUI：
1.百度搜索EasyUI
2.导入jQuery和EasyUI到项目目录下
3.从EasyUI网站上挑选demo代码，进行复制
4.新建Html文件，将demo代码粘贴
5.将link路径："https://www.jeasyui.com/easyui/themes/icon.css"
改为本地路径："jquery-easyui-1.5.3/themes/default/easyui.css"
6.将<script>中的srcl路径，也改为本地的。
7.运行即可看到效果。
jQueryUI：
用法与EasyUI一样，由于集成度低，并没有得到广泛使用。
BootStrap：
最流行的组件，拥有很多模板。
1.响应式：基于@media
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.c1{
background-color: red;
height: 40px;
}
@media (min-width: 700px) { //宽度最小700px的情况下执行
.c2{
background-color: blue;
height: 40px;
}
}
</style>
</head>
<body>
<div class="c1 c2"></div>
</body>
</html>
2.图标 字体：基于@font-face
3.基本使用：
1.下载BootStrap，并引入项目中
2.新建Html文件，引入BootStrap的css路径：
<link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css">
<link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap-theme.css">
3.引入jQuery，再引入BootStrap的js路径：
<script src="jquery-3.2.1.js"></script>
<script src="bootstrap-3.3.7-dist/js/bootstrap.js"></script>
4.到BootStrap官网找到对应版本的示例，挑选需要功能赋值代码即可使用。
5.如果需要对示例中的组件进行修改，就在自定义的属性后面加上：！import
由此可见，在我们需要写一些前端功能的时候，比如轮播图，应该先去网上搜一下
看有没有相关插件，直接拿来使用，可以避免反复造轮子，提高工作效率。
第四课 Web框架
所有的web框架的本质：
import socket
def handle_request(client):
buf=client.recv(1024)
client.send(bytes('HTTP:/1.1 200 OK\r\n\r\n',encoding='utf8'))
client.send(bytes('Hello World!',encoding='utf8'))
def main():
sock=socket.socket(socket.AF_INET,socket.SOCK_STREAM)
sock.bind(('127.0.0.1',8000))
sock.listen(5)
while True:
conn,address=sock.accept()
handle_request(conn)
conn.close()
if __name__ == '__main__':
main()
python中最基本的web框架：wsgiref模块（pyhton中web框架的本质）
from wsgiref.simple_server import make_server
def RunSever(environ,start_response):
# environ 用户发来的所有的数据
# start_response 封装要返回给用户的数据：响应头
start_response('200 OK',[('Content-Type','text/html')])
return ['hello world!'.encode('utf8')]# 返回的内容
if __name__ == '__main__':
httpd=make_server('',8000,RunSever)
print('Serving HTTP on port 8000...')
httpd.serve_forever()
字符串转字节的三种方式：
1.b'ffffff' (不能用于中文)
2.bytes('ffffff',encoding='utf8')
3.'ffffff'.encode('utf8')
MVC：
Model：数据库 View：模板文件 Controller：业务处理
MTV：（Django）
Model：数据库 Template：模板文件 view：业务处理
第五课 Django
Django目录：
mysite
-mysite #对整个程序进行配置
-init
-settings #配置文件
-urls #URL对应关系
-wsgi #遵循WSGI规范 以后会改用uwsgi+nginx
-manage.py #管理Django程序：
-python manage.py
-python manage.py startapp xxx
-pyhton manage.py makemigrations
-python manage.py migrate
创建app：
chouti
-主站 app
-后台管理 app
命令：
python3 manage.py startapp app名
app目录：
-migrations #数据操作记录
-admin #Django为我们提供的后台管理
-apps #配置当前app的（暂时用不到）
-models #ORM,写指定的类，通过命令可以创建数据库结构
-tests #单元测试
-views #业务代码
Django实现用户登录：
1.创建app名为cmdb（自定义随便起）
2.将medb名加入settings中的INSTALLED_APPS列表中
3.在urls文件中引入app下的views模块：
from cmdb import views
4.在urlpatterns列表中加入路径与关联函数：
path('login',views.login)
5.在Templates中新建一个Html文件login.html
<form action="/login" method="post">
<p>
<label for="uesername">用户名</label>
<input type="text" id="username" name="username">
</p>
<p>
<label for="pwd">密码</label>
<input type="password" id="pwd" name="pwd">
<span style="color: red">{{ 'error' }}</span>
</p>
<p>
<input type="submit" value="提交">
</p>
</form>
6.到views中创建login函数：
def login(req):
return render(req,'login01.html')
7.在settings中的TEMPLATES列表中的 'DIRS'加入模板路径：
'DIRS': [os.path.join(BASE_DIR, 'templates')],
8.在项目文件夹下，为静态文件创建文件夹：static 导入css文件和js文件
9.配置静态文件路径，在settings中的最后加代码：
STATICFILES_DIRS=(os.path.join(BASE_DIR, 'static'),) #千万不要忘了加,
10.访问127.0.0.1:8000来到登录界面，点提交时会报403错误
11.将settings文件中的MIDDLEWARE内的第四行暂时注释掉，就不会有403错误了
12.用户验证：
将views代码修改为：
from django.shortcuts import render,redirect
# Create your views here.
def login(req):
error_msg=''
if req.method=='POST':#获取用户的提交方式
user=req.POST.get('username')#用get的方式获取键值，防止有空值报错
pwd=req.POST.get('pwd')
if user=='root' and pwd=='123':
return redirect('http://www.baidu.com')
else:
error_msg='用户名或密码不匹配'
return render(req,'login01.html',{'error':error_msg})
13.登录界面输入用户名：root 密码：123 点击提交，就跳转到了百度
用户名和密码如果有错误，就会提示：用户名或密码不匹配
实现前后端交互：
1.在Templates中新建一个Html文件home，写入代码：
<form action="home" method="post">
<input type="text" name="name" placeholder="姓名">
<input type="text" name="sex" placeholder="性别">
<input type="text" name="email" placeholder="邮箱">
<input type="submit" value="添加">
</form>
<div>
<table>
{% for row in userlist %}
<tr>
<td>{{ row.name }}</td>
<td>{{ row.sex }}</td>
<td>{{ row.email }}</td>
</tr>
{% endfor %}
</table>
</div>
2.在urlpatterns列表中加入路径与关联函数： path('home',views.home),
3.在views中加入代码：
userlist=[
{'name':'张三','sex':'男','email':'1110@163.com'},
{'name':'李四','sex':'男','email':'2220@163.com'},
{'name':'王五','sex':'男','email':'3333@163.com'},
]
def home(req):
if req.method=='POST':
user=req.POST.get('name')
sex=req.POST.get('sex')
email=req.POST.get('email')
temp={'name':user,'sex':sex,'email':email}
userlist.append(temp)
return render(req,'home.html',{'userlist':userlist})
4.访问127.0.0.1:8000/home 可以实现条件用户信息的功能
第六课 内容整理：
1.创建Django工程：
django-admin startproject 工程名
2.创建App：
cd 工程名
python manage.py startapp app名
3.静态文件：
project.settings.py
STATICFILES_DIRS=(
os.path.join(BASE_DIR,'static'),
)
4.模板路径：
DIRS==>[os.path.join(BASE_DIR,'Template'),]
5.settings
middlerware
#注释csrf
6.定义路由规则：
urls.py
'login'-->函数名
7.定义视图函数：
app下的views.py
def func(req):
#req.method GET / POST
#http://127.0.0.1:8000/home?nid=123&name=alex....
#req.GET.get('',None) #获取请求发来的数据
#req.POST.get('',None)
#return HttpResponse('字符串')
#return render(req,'HTML模板路径')
#return redirect('/只能填url’)
8.模板渲染：
特殊的模板语言：
---{{变量名}}：
def func(req):
return render(req,'index.html',{'current_user'='张三'})
index.html
<html>
...
<body>
<div>{{current_user}}</div>
</body>
</html>
=====>最后生成的字符串：
<html>
...
<body>
<div>张三</div>
</body>
</html>
----for循环：
def func(req):
return render(req,'index.html',{'current_user'=['张三','李四','王五','小明']})
index.html
<html>
...
<body>
<ul>
{%for i in current_user%}
<li>{{i}}</li>
{{%endfor%}}
</ul>
</body>
</html>
----if else 可以与for循环配合使用，也可以嵌套。
{% if 条件%}
...
{%else%}
...
{%endif%}
