在上一篇文章中我们说到利用django框架中的模板(templates)文件已经成功的让浏览器显示出了我们自己设置的内容了,不过不得不说,尽管已经创建成功,但是真的太简陋了。没有样式也没有图像装饰。为了改变这种状况,我们进入下个阶段,如何利用django来使页面变得不那么简陋。
1.配置静态文件
静态文件包括层叠样式表(Cascading Style Sheet,CSS)、JavaScript 和图像。它们不是由 Web 服务器动态生成的,而是原封不动发给 Web 浏览器。因此我们可以引入他们。
首先在项目配置目录中新建一个目录,名为 static,用于存放静态文件。确保 static 目录与前面创建的 templates 目录位于同一级。可以在刚刚创建的 static 目录中再新建子目录js,css,images用于存放不同的静态文件,例如,我们在images目录中存放一张图片。然后我们要告诉 Django 这个 static 目录的路径。为此,还要编辑配置文件 settings.py 模块。 配置静态资源路径和URL前缀执行以下代码:
STATICFILES_DIRS =[os.path.join(BASE_DIR, 'static')]
STATIC_URL = '/static/'
STATICFILES_DIRS 两个变量设定静态文件在电脑中的位置;STATIC_URL 变量则指定启动 Django 开发服务器后通过什么 URL访问静态文件。例: STATIC_URL 设为 /static/ 后,我们可以通过 http://127.0.0.1:8000/static/访问里面的静态内容。前一个变量相当于服务器端的位置,而第三个变量是客户端访问静态内容的位置。
注意:设置 STATIC_URL 时,确保 URL 的末尾有一个正斜线(例如,是 /static/,而不是
/static)。在末尾加上斜线的目的是把 URL 的根部(例如 /static/)与要伺服的静态内容(例如 images/rango.jpg)区分开。
1.1在模板中引用静态文件
我们已经做好设置,Django 项目能处理静态文件了。现在可以在模板中利用静态文件改进外观及
增添功能了。打开模板中的HTML文件
<!DOCTYPE html>
{% load staticfiles %} <!-- 新增 -->
<html>
<head>
<title>Rango</title>
</head>
<body>
<h1> says...</h1>
<div>
hey there partner!
<br />
<strong>{{ boldmessage }}</strong><br />
</div>
div>
<img src="{% static "images/xxx.jpg" %}"
> <!-- 新增 -->
</div>
</body>
</html>
新增的第一行({% load staticfiles %})告诉 Django 模板引擎,我们将在模板中使用静态文
件。这样便可以在模板中使用 static 模板标签引入静态目录中的文件。static "images/xxx.jpg" 告诉 Django,我们想显示静态目录中名为 images/xxx.jpg 的图像。
只要想在模板中引用静态文件,就可以使用 {% static %} 模板标签。下述代码片段说明如何
在模板中引入 JavaScript、CSS 和图像。
<!DOCTYPE html>
{% load staticfiles %}
<html>
<head>
<title>首页</title>
<!-- CSS -->
<link rel="stylesheet" href="{% static "css/base.css" %}" />
<!-- JavaScript -->
<script src="{% static "js/jquery.js" %}"></script>
</head>
<body>
<!-- 图像 -->
<img src="{% static "images/rango.jpg" %}" alt="Picture of Rango" />
</body>
</html>
1.3媒体文件
应用中的静态文件可以理解为不变的文件。不过,有时还要使用可变的媒体文件(media file)。这类文件可由用户或管理员上传,因此可能会变化。比如说,用户的头像就是媒体文件
首先,我们与设置静态文件一样创建一个media目录,与templates目录保持一致,然后创建子目录images目录用于存放文件,然后打开 Django 项目配置目录中的 settings.py 模块。与配置静态文件一样执行以下代码:
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'#同样别忘了斜线
-调整URL
让 Django 使用 MEDIA_URL 伺服媒体内容。打开项目的urls.py 模块,修改 urlpatterns 列表,调用 static() 函数:
urlpatterns = [
...
...
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
此外,还要在urls.py模块的顶部添加下述import语句:
from django.conf import settings
from django.conf.urls.static import static
现在可以通过 /media/ URL 访问 media 目录中的媒体文件了。
小结(为了梳理自己思路)
➊ 首先,创建要使用的模板,保存到 templates 目录中(在项目的 settings.py 模块中设定)。模板中可以使用 Django 模板变量(例如 {{ variable_name }})或模板标签。模板变量的值在相应的视图中设定。
➋ 在应用的 views.py 文件中找到所需的视图,或者新建一个。
➌ 把视图相关的逻辑写在视图函数中。例如,从数据库中检索数据,存到列表中。
➍ 在视图中构建一个字典,通过模板上下文传给模板引擎。
➎ 使用 render() 辅助函数生成响应。这个函数的参数是请求对象、模板文件名和上下文字典。
➏ 如果还没把视图映射到 URL 上,修改项目的 urls.py 文件和应用的 urls.py 文件
在网页中引入静态文件的步骤:
➊ 把想用的静态文件放到项目的 static 目录中。这个目录在项目的 settings.py 模块中的
STATICFILES_DIRS 列表中设定。
➋ 在模板中引用静态文件。例如,图像通过 <img /> 标签插入 HTML 页面。
➌ 记得在模板中加上 {% load staticfiles %},然后使用 {% static "<filename>" %} 标签引
用静态文件。把 <filename> 替换成图像或其他资源的路径。只要想引用静态文件,使用
static 模板标签。
在网页中引入媒体文件的步骤:
➊ 把媒体文件放到项目的 media 目录中。这个目录由项目的 settings.py 模块中的 MEDIA_ROOT
变量设定。
➋ 在模板中使用 {{ MEDIA_URL }} 上下文变量引用媒体文件。例如,引用上传的图像
cat.jpg:<img src="{{ MEDIA_URL}}cat.jpg" />。
2.模型与数据库
在 Django 中,查询底层数据库这项操作由对象关系映射器(Object Relational Mapper,ORM)负责。在 ORM 中,存储在一个数据库表中的数据封装为一个
模型。模型则是描述数据库表中数据的 Python 对象。
2.1设置数据库
安装第三库mysqlclient
pip insatll masqlclient
创建模型之前要设置数据库。新建项目时,Django 已经自动在 settings.py 模块中添加了 DATABASES
变量,修改如下代码:
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.mysql',
'NAME': '#数据库名称,最好和项目名字一致',
'HOST': '47.107.87.249',#数据库地址
'PORT': 3306,
'USER': 'renwoxing', #授权用户,最好不要root权限
'PASSWORD': 'xxx', #数据库密码
'CHARSET': 'utf8', #默认编码方式
'TIME_ZONE' : 'Asia/Chongqing', #设定时区
}
}
在 settings.py 模块中配置好数据库之后,开始创建应用所需要的数据模型,模型保存在应用目录中的models.py模块里。
class Subject(models.Model):
''''学科类模型'''
#自增
no = models.AutoField(primary_key=True,verbose_name='编号')
name = models.CharField(max_length=20,verbose_name='名称')
intro = models.CharField(max_length=1000,verbose_name='介绍')
is_hot = models.BooleanField(default=False,verbose_name='是否热门')
def __str__(self): #魔法方法,生成类的字符串表示形式
return self.name
class Meta:
db_table = 'tb_subject'
verbose_name = '学科'
verbose_name_plural = '学科'
定义模型时,要指定字段及其类型,并提供必须或可选的参数。Django中内置的字段类型常用的几个如下:
CharField:存储字符数据(如字符串)的字段。max_length 参数指定最多可存储的字符
数。IntegerField:存储整数。
DateField:存储 Python datetime.date 对象
ForeignKey:用于建立一对多关系。
OneToOneField:用于建立一对一关系。
ManyToManyField:用于建立多对多关系。
2.2创建和迁移数据库
首先,数据库必须预置,即创建数据库及相关的表。打开终端输入以下代码:
#创建迁移
python manage.py makemigrations polls
#执行迁移
python manage.py migrate
然后,创建一个超级用户(superuser),用于管理数据库。执行下述命令:
python manage.py createsuperuser
这个超级用户在本章后面将用于访问 Django 管理界面。请根据提示输入用户名、电子邮件地址和密码。
可以打开一个admin.py用来后台管理数据库中创建的类,例如以下代码:
class SubjectAdmin(admin.ModelAdmin):
list_display = ('no','name','intro','is_hot') #将要展示的各项名称
list_display_links = ('no','name') #创建的软连接
search_fields = ('name',) #创建克搜索字段
ordering = ('no',) #按指定字段排序 (注意此处为元祖,切勿忘记后面的逗号)
#结尾
admin.site.register(Subject, SubjectAdmin)
#注册想要在管理界面显示的类
接下来在urls.py中创建映射,例如:
urlpatterns = [
path('admin/', admin.site.urls),
path('', index),
]
改好之后,重启 Django 开发服务器,然后再次访问 http://127.0.0.1:8000/admin/。你可以看到类似以下页面:
3.补充
3.1为用户密码创建哈希摘要(利用重写Model里的save方法)
创建一个py文件定义生成哈希摘要的函数,执行以下代码:
import hashlib
def to_md5_hex(content):
"""生成MD5摘要"""
讲内容转换成字节串生成哈希摘要后返回
return hashlib.md5(content.encode()).hexdigest()
在manage.py中在为用户创建的类中,重写save方法,代码如下:
class User(models.Model):
'''用户(模型类)'''
no = models.AutoField(primary_key=True, verbose_name='编号')
username = models.CharField(max_length=20, unique=True,verbose_name='用户名')
password = models.CharField(max_length=32,verbose_name='密码')
email = models.CharField(default='', max_length=256, verbose_name='邮箱')
tel = models.CharField(max_length=11, verbose_name='手机号码', unique=True)
reg_date = models.DateTimeField(auto_now_add=True,verbose_name='注册日期')
last_visit = models.DateTimeField(verbose_name='最后访问')
def save(self):
'''商业活动中要加盐'''
self.password =to_md5_hex(self.password)
super().save()
class Meta:
db_table = 'tb_user'
verbose_name = '用户'
verbose_name_plural = '用户'
这时候打开数据库可以看到password已经变成哈希摘要保存了。
3.2cookie和会话
cookie是什么?
Web 服务器收到请求后会返回所请求页面的内容。除了内容之外,还会返回一些 cookie。cookie
可以理解为服务器发给客户端的少量信息。准备发送请求时,客户端检查有没有与服务器地址匹
配的 cookie,如果有,随请求一起发送。服务器收到请求后把 cookie 放在请求的上下文中解释,
然后生成合适的响应。
会话是什么?
Web 浏览器(客户端)与服务器之间的通信都借由 HTTP 协议。前面说过,HTTP 是无状态的协议。因此,Web 浏览器所在的客户端电脑每次请求服务器中的资源(HTTP GET)或者把资源发给服务器(HTTP POST)都要建立新的网络连接(TCP 连接)。
由于客户端和服务器之间无法建立持久连接,所以两端的软件都不能只依靠连接维持会话状态。
例如,客户端发送的每个请求都要指明哪个用户在当前电脑上已登录 Web 应用。这是客户端与服务器之间的一种对话,是半永久性信息交互机制(即会话)的基础。
3.2.1在Django中设置会话
session的配置
- Session对应的中间件:django.contrib.sessions.middleware.SessionMiddleware。
2.Session引擎:
- 基于数据库(默认方式)
INSTALLED_APPS = [
'django.contrib.sessions',
]
- 基于缓存(推荐使用)
SESSION_ENGINE = 'django.contrib.sessions.backends.cache'
SESSION_CACHE_ALIAS = 'session'
- 基于Cookie(不靠谱)
SESSION_ENGINE = 'django.contrib.sessions.backends.signed_cookies'
cookie的配置
SESSION_COOKIE_NAME = 'djang_session_id'
SESSION_COOKIE_AGE = 1209600
# 如果设置为True,Cookie就是基于浏览器窗口的Cookie,不会持久化
SESSION_EXPIRE_AT_BROWSER_CLOSE = False
SESSION_SAVE_EVERY_REQUEST = False
SESSION_COOKIE_HTTPONLY = True
3.4配置缓存
CACHES = {
# 默认缓存
'default': {
'BACKEND': 'django_redis.cache.RedisCache',
'LOCATION': [
'redis://1.2.3.4:6379/0',
],
'KEY_PREFIX': 'teamproject',
'OPTIONS': {
'CLIENT_CLASS': 'django_redis.client.DefaultClient',
'CONNECTION_POOL_KWARGS': {
'max_connections': 1000,
},
'PASSWORD': 'yourpass',
}
},
# 页面缓存
'page': {
'BACKEND': 'django_redis.cache.RedisCache',
'LOCATION': [
'redis://1.2.3.4:6379/1',
],
'KEY_PREFIX': 'teamproject:page',
'OPTIONS': {
'CLIENT_CLASS': 'django_redis.client.DefaultClient',
'CONNECTION_POOL_KWARGS': {
'max_connections': 500,
},
'PASSWORD': 'yourpass',
}
},
# 会话缓存
'session': {
'BACKEND': 'django_redis.cache.RedisCache',
'LOCATION': [
'redis://1.2.3.4:6379/2',
],
'KEY_PREFIX': 'teamproject:session',
'TIMEOUT': 1209600,
'OPTIONS': {
'CLIENT_CLASS': 'django_redis.client.DefaultClient',
'CONNECTION_POOL_KWARGS': {
'max_connections': 2000,
},
'PASSWORD': 'yourpass',
}
},
# 接口数据缓存
'api': {
'BACKEND': 'django_redis.cache.RedisCache',
'LOCATION': [
'redis://1.2.3.4:6379/3',
],
'KEY_PREFIX': 'teamproject:api',
'OPTIONS': {
'CLIENT_CLASS': 'django_redis.client.DefaultClient',
'CONNECTION_POOL_KWARGS': {
'max_connections': 500,
},
'PASSWORD': 'yourpass',
}
},
}
#全站缓存
MIDDLEWARE_CLASSES = [
'django.middleware.cache.UpdateCacheMiddleware',
...
'django.middleware.common.CommonMiddleware',
...
'django.middleware.cache.FetchFromCacheMiddleware',
]
CACHE_MIDDLEWARE_ALIAS = 'default'
CACHE_MIDDLEWARE_SECONDS = 300
CACHE_MIDDLEWARE_KEY_PREFIX = 'djang:cache'
#视图层缓存
from django.views.decorators.cache import cache_page
from django.views.decorators.vary import vary_on_cookie
@cache_page(timeout=60 * 15, cache='page') #利用装饰器
@vary_on_cookie
def my_view(request):
pass
from django.views.decorators.cache import cache_page
urlpatterns = [
url(r'^foo/([0-9]{1,2})/$', cache_page(60 * 15)(my_view)),
]
如你所见,添加缓存机制只需调用一个装饰器函数即可;在调用时需要传参,timeout为超时时间,在固定时间后缓存自动清除;cache选择缓存组;
3.5配置日志
日志级别
NOTSET < DEBUG < INFO < WARNING < ERROR < FATAL
日志配置:
LOGGING = {
'version': 1,
'disable_existing_loggers': False,
# 配置日志格式化器
'formatters': {
'simple': {
'format': '%(asctime)s %(module)s.%(funcName)s: %(message)s',
'datefmt': '%Y-%m-%d %H:%M:%S',
},
'verbose': {
'format': '%(asctime)s %(levelname)s [%(process)d-%(threadName)s] '
'%(module)s.%(funcName)s line %(lineno)d: %(message)s',
'datefmt': '%Y-%m-%d %H:%M:%S',
}
},
# 配置日志过滤器
'filters': {
'require_debug_true': {
'()': 'django.utils.log.RequireDebugTrue',
},
},
# 配置日志处理器
'handlers': {
'console': {
'class': 'logging.StreamHandler',
'level': 'DEBUG',
'filters': ['require_debug_true'],
'formatter': 'simple',
},
'file1': {
'class': 'logging.handlers.TimedRotatingFileHandler',
'filename': 'access.log',
'when': 'W0',
'backupCount': 12,
'formatter': 'simple',
'level': 'INFO',
},
'file2': {
'class': 'logging.handlers.TimedRotatingFileHandler',
'filename': 'error.log',
'when': 'D',
'backupCount': 31,
'formatter': 'verbose',
'level': 'WARNING',
},
},
# 配置日志器
'loggers': {
'django': {
'handlers': ['console', 'file1', 'file2'],
'propagate': True,
'level': 'DEBUG',
},
}
}
3.6调试工具Debug模式便于开发
- 安装:Debug-Tool-Bar
pip install django-debug-toolbar
- 配置文件中添加APP
'debug_toolbar',
- 配置文件中添加中间键
'debug_toolbar.middleware.DebugToolbarMiddleware',
- 配置文件中配置前端效果:
DEBUG_TOOLBAR_CONFIG = {
# 引入jQuery库
'JQUERY_URL': 'https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js',
# 工具栏是否折叠
'SHOW_COLLAPSED': True,
# 是否显示工具栏
'SHOW_TOOLBAR_CALLBACK': lambda x: True,
}
- 映射文件urls.py中配置路由
if settings.DEBUG:
import debug_toolbar
urlpatterns.insert(0, path('__debug__/', include(debug_toolbar.urls)))
3.7 利用django自带分页器
# 导入分页工具
from django.core.paginator import Paginator
# 调用分页器函数会返回一个对象
page_obj = = Paginator(obj_list, per_page)
obj_list是需要分页的内容
per_page是每页的内容数量,一般为int类型
# 对象的使用方法
page_obj.has_previous ---> 是否存在前一页(布尔值)
page_obj.has_next ---> 是否存在下一页(布尔值)
page_obj.previous_page_number ---> 前一页的页码(数值)
page_obj.next_page_number ---> 下一页的页码(数值)
page_obj.number ---> 当前页的页码(数值)
page_obj.get_page(page) ---> ???
page_obj.page(3) ---> 访问指定页面
page2.start_index() ---> 从1开始计数的当前页的第一个对象
3
page2.end_index() ---> 从1开始计数的当前页最后1个对象
paginator.page_range ---> 页码范围(迭代对象)
paginator.num_pages ---> 页面总数量(数值)
3.8关于 查询的一部分语法
Entry.objects.all() ---> 查询所有记录
# 指定查询:only
queryset = Teacher.objects.filter(subject__no=sno).only('', '', '')
# 排除查询:defer
queryset = Teacher.objects.filter(subject__no=sno).defer('', '')
# 空值查询:
District.objects.filter(pid__null=True)
# 条件查询:
Entry.objects.filter(num=3) ---> 查询num=3的数据记录
Entry.objects.exclude(num=3) ---> 查询num=3的数据记录
# 使用切片的方法可以进行范围取值,相当于SQL语句中的LIMIT和OFFSET子句
Entry.objects.all()[:5] ---> 返回前5个对象
Entry.objects.all()[5:10] ---> 返回第6个到第10个对象
# 关键字查询:
1) 精确查询: __exact (默认就是精准查询,可以不写)
Entry.objects.get(headline__exact="Cat bites dog")
2) 模糊查询
__contains:是否包含
__startswith: 以指定值开头
__endswith:以指定值结尾
3) 空查询
isnull:是否为null
4) 范围查询
in:是否包含在范围内
5) 比较查询
gt、gte、lt、lte:大于、大于等于、小于、小于等于
6) 日期查询
year、month、day、week_day、hour、minute、second:对日期时间类型的属性进行运算
7) 不区分大小写: __iexact
Entry.objects.get(name__iexact="beatles blog")
# Q对象查询
在查询的条件中需要组合条件时(例如两个条件“且”或者“或”)。我们可以使用Q()查询对象
from django.db.models import Q
Q(question__startswith='What')
可以在Q()对象的前面使用字符“~”来代表意义“非”
可以使用 “&”或者“|”还有括号来对条件进行分组从而组合成更加复杂的查询逻辑
Q(question__startswith='Who') | Q(question__startswith='What')
例:
queryset = Record.objects.filter(Q(car__carno__startswith=carno) | Q(car__owner__contains=carno)).select_related('car').order_by('-offend_time')[(page - 1) * size:page * size]
context['records'] = queryset
# .select_related('car') 在Q对象中car__carno已经实现连表查询,这时再用.select_related('car')语法连同car一起查询
.prefetch_related('...') ---> 多对多顺带查询
.select_related('...') ---> 一对多顺带查询
避免1+n出现
3.9前端Vue的部分语法
1. 属性:
1) el属性 - 字符串,传选择器(一般写id选择器), 将当前创建的Vue对象和html中的标签进行关联
2) data属性 - 通过对象的属性提供数据
3) methods属性 - 通过对象属性提供方法
4) computed属性 - 属性值必须函数, 函数的返回值就是使用属性的值
5) created钩子 - 在实例被创建之后被调用
2. Vue指令
1) 标签内容 - {{Vue属性名}}
2) 标签属性 - v-bind:标签属性 = 'Vue属性名'
3) if语句 - v-if='Vue属性名' (如果Vue属性值是true对应的标签就显示,否则就隐藏)
4) 循环结构 - v-for = '变量 in 类型是数组的Vue属性'
5) 双向绑定 - v-model='Vue属性名' (一般在表单标签中有效)
6) 事件绑定 - v-on:事件名
3. 补充
1) 可以直接在标签内用 @事件名 的方法绑定事件,并直接调用事件函数
例:<button @click="prevPage()">上一页</button>
2) 缩写
v-bind 缩写
<!-- 完整语法 -->
<a v-bind:href="url">...</a>
<!-- 缩写 -->
<a :href="url">...</a>
v-on 缩写
<!-- 完整语法 -->
<a v-on:click="doSomething">...</a>
<!-- 缩写 -->
<a @click="doSomething">...</a>