资源简介

单元12 基于Django框架的Web程序设计
课程名称 Python程序设计任务驱动式教程 章名 基于Django框架的Web程序设计
教学内容 基于Django框架的Web程序设计 课时 4
项目性质 □演示性 □验证性 □设计性 √综合性
授课班级 授课日期 授课地点
教学目标 了解Django的path()方法、Django的URL路由配置等基础知识 掌握创建Django项目与App的方法 掌握Django模板的应用
教学内容 创建Django项目与App应用程序 Django模板
教学重点 创建Django项目与App、Django模板的应用
教学难点 创建Django项目与App、Django模板的应用
教学准备 装有Python的计算机 教学课件PPT 教材：《Python程序设计任务驱动式教程（微课版）》
作业设计
13
教学过程
教学环节 教学内容与过程 （教学内容、教学方法、组织形式、教学手段）
课前组织 做好上课前的各项准备工作（打开计算机、打开课件、打开软件、打开授课计划、教案等），吸引学生注意力。
课程说明 【课前说明】 分别从Django的path()方法、Django的URL路由配置等知识点进行初步的了解。 【目的】 使学生从了解本节课的学习目标、学习重点、考评方式等方面明确课程学习的要求和目标。
课程内容描述 12.1 创建Django项目与App应用程序 12.1.1 在PyCharm中创建Django项目 【实例12-1】创建Django项目app1201 （1）成功启动PyCharm，进入PyCharm的集成开发环境。 （2）在PyCharm主窗口选择菜单【File】，在弹出的下拉菜单中选择【New Project】，打开【New Project】对话框，该对话框左侧列出很多项目模板，这里选择“Django”，在“Location”文本框中输入Django项目的存放位置和项目名称，这里在文件夹“D:\PycharmProject\Practice\Unit12”中创建的项目的名称为“app1201”，在“Location”文本框中输入“D:\Pycharm Project\Practice\Unit12\app1201”，且完成其他的设置，如图所示。 【New Project】对话框 也可以单击文本框右侧的按钮，在弹出的【Select Base Directory】对话框中直接选择项目存放位置，例如“D:\PycharmProject\Practice\Unit12\”，然后单击【OK】按钮返回【New Project】对话框。 在Windows【命令提示符】窗口创建Django项目的命令如下。 django-admin startproject <项目名称> 项目名称必须由字母、数字和下画线组成。 例如： django-admin startproject app1201 Django项目的存放位置、项目名称等设置都完成后，在【New Project】对话框中单击【Create】按钮，在弹出的【Open Project】对话框中单击【New Window】按钮，如图所示，即在新的窗口中打开创建的Django项目。 在【Open Project】对话框中单击【New Window】按钮 这时会打开一个新的PyCharm窗口，接着完成后续工作，例如创建虚拟环境、激活环境等，【Creating Virtual Environment】对话框如图所示。 【Creating Virtual Environment】对话框 然后安装Django相关文件与配置Django项目，【Ensuring Django is installed】对话框如图所示。 【Ensuring Django is installed】对话框 Django相关文件安装与Django项目配置完成后，Pycharm将生成一个新的Django项目。Django项目的目录结构和相应的Python文件如图所示。 Django项目的目录结构和相应的Python文件 Django项目创建完成后，我们可以看到上图中窗口左侧的项目目录结构如下。 app1201（项目的容器） ├─app1201 │ ├─__init__.py │ ├─asgi.py │ ├─settings.py │ ├─urls.py │ └─wsgi.py ├─templates ├─venv library root └─manage.py Django项目中自动生成的Python文件和文件夹的说明如表所示。 Django项目中自动生成的Python文件和文件夹的说明 序号Python文件和文件夹说明1manage.pyDjango项目中的入口程序，也是实用的命令行工具，可以让用户以各种方式与该Django项目进行交互2db.SQLite3SQLite数据库文件，Django默认使用这种小型数据库存取数据3__init__.py一个空文件，告诉Python该文件夹是一个Python包文件夹4settings.pyDjango项目的配置文件，可以配置App、数据库、中间件、模板等5urls.pyDjango项目的URL声明，是由Django驱动的网站“目录”6wsgi.pyWSGI兼容的Web服务器的入口，以便运行项目、处理Web请求7templates存放Django项目中HTML模板的文件夹，也可以在每个app文件夹中创建一个模板文件夹8app1201Django生成的与项目同名的文件夹
还可以自行创建static文件夹，用于存放CSS样式文件、图片文件等静态文件。 Django项目中的入口程序manage.py的代码如下。 import os import sys def main(): os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'app1201.settings') try: from django.core.management import execute_from_command_line except ImportError as exc: 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 " ) from exc execute_from_command_line(sys.argv) if __name__ == '__main__': main() Django管理工具的URL模式通常在项目生成时在urls.py中自动设置好，配置代码如下所示。 from django.contrib import admin from django.urls import path urlpatterns = [ path('admin/', admin.site.urls), ] 当一切都配置好后，Django管理工具就可以运行了。 12.1.2 在settings.py文件中对Django项目进行多项配置 1．在settings.py文件中查看INSTALLED_APPS设置 Django提供了基于Web的管理工具。django.contrib是一个庞大的功能集，它是Django基本代码的组成部分，Django自动管理工具是django.contrib的一部分。在Django项目的settings.py文件中查看INSTALLED_APPS设置的代码如下。 INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', ] 2．在settings.py文件中进行汉化设置 settings.py文件有关语言设置的代码如下。 LANGUAGE_CODE = 'en-us' TIME_ZONE = 'UTC' 修改这两行代码，将界面中的提示信息进行汉化处理，修改后的代码如下。 LANGUAGE_CODE = 'zh-hans' TIME_ZONE = 'Asia/Shanghai' 3．在settings.py文件中进行路径设置 settings.py文件有关路径设置的代码如下。 BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__))) STATIC_URL = '/static/' 添加如下代码。 STATICFILES_DIRS = [ os.path.join(BASE_DIR, "static"), ] 以保证访问静态文件时不会出现路径问题，能够顺利找到所需的静态文件。 4．在settings.py文件中开启调试模式 在settings.py文件中可以发现，项目生成时默认情况下开启了调试模式，代码如下。 DEBUG = True 5．在settings.py文件中查看默认的数据库设置 在settings.py文件中可以看出，Django项目默认使用Python自带的SQLite数据库，数据库配置代码如下。 DATABASES = { 'default'：{ 'ENGINE'：'django.db.backends.SQLite3', 'NAME'：os.path.join(BASE_DIR, 'db.SQLite3'), } } 6．运行项目app1201 在PyCharm主窗口下方的【Terminal】窗口虚拟环境命令行的“(venv) D:\PycharmProject\ Unit12\app1201>”后面输入以下命令运行项目app1201。 python manage.py runserver 按【Enter】键执行该命令，此时Web服务器开始监听8000端口的请求。在浏览器的地址栏中输入服务器的IP地址和端口号（这里输入本机的IP地址和端口号8000，即http://127.0.0.1:8000），如果正常启动，即可看到图所示的Django页面内容。 Django页面内容 12.1.3 在Django项目中创建App应用程序 在12.1.1节中我们已成功创建了一个Django项目app1201。接下来，在项目app1201中创建App、新增Python文件、编写程序代码实现所需功能。 【实例12-2】在Django项目中创建App与运行Django项目 1．创建App 一个Django项目可以分为很多个App，用来隔离不同功能模块的代码。在Django项目中，推荐使用不同的App来完成不同模块的任务，在PyCharm主窗口下方的【Terminal】窗口虚拟环境命令行的“(venv) D:\PycharmProject\Unit12\app1201>”后面输入以下命令，然后按【Enter】键创建一个App应用程序。 python manage.py startapp app01 在项目根目录“app1201”下增加了一个名称为“app01”的包文件夹，项目文件夹app1201的目录结构如图所示。 项目文件夹app1201的目录结构 新建包文件夹app01中各个文件和文件夹的说明如表所示。 新建包文件夹app01中各个文件和文件夹的说明 序号文件和文件夹说明1migrations存放数据库迁移生成的脚本文件的包2__init__.py一个空文件，告诉Python该文件夹是一个Python包文件夹3admin.py配置Django管理后台的文件4apps.py单独配置添加的每个App的文件5models.py创建数据库数据模型对象的文件6tests.py用于编写测试脚本的文件7views.py用于编写视图控制器的文件
2．在settings.py配置文件中添加创建的app01 修改项目app1201的配置文件settings.py，将已经创建的app01添加到settings.py配置文件中，否则app01包内的文件不会生效。 修改后的INSTALLED_APPS设置代码如下。 INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'app01', ] 3．在app01中的views.py文件中编写代码 在app01中的views.py文件中编写以下代码，在页面中输出文本“Happy every day !”。 from django.http import HttpResponse def show(request): return HttpResponse("Happy every day ! ") 上述代码定义了一个函数show()，返回了一个HttpResponse对象，这就是Django的基于函数的视图（view），每个视图的函数都要有一个HttpRequest对象request作为参数，用来接收来自客户端的请求，并且必须返回一个HttpResponse对象，作为响应给客户端。Django.http模块下有多个继承自HttpResponse的对象，其中大部分在Django程序开发中都可以用到。 4．在app01中添加urls.py文件 在前面创建的项目文件夹app1201文件夹的子文件夹app01中新建一个urls.py文件，并输入以下代码，绑定URL与函数show()。 from django.conf.urls import url from . import views urlpatterns = [ url(r'^$', views.show), ] 5．在app1201中修改urls.py文件 打开文件夹app1201中的urls.py文件，修改urlpatterns列表，配置URL，修改后的代码如下所示。 from django.contrib import admin from django.urls import path,include urlpatterns = [ path('admin/', admin.site.urls), path('app01/', include("app01.urls")), ] 6．再一次运行项目app1201 设置完成后，启动Django服务器，然后在浏览器的地址栏中输入“http://127.0.0.1:8000/app01/”，如果正常启动，则在页面中会输出“Happy every day !”文本内容。 12.2 Django模板 在12.1节中我们使用HttpResponse()来输出“Happy every day ! ”文本，该方式将数据与视图混合在一起，不符合Django的MVC模式。 本节将学习Django模板的应用，模板是一个文本，用于分离文档的呈现形式和内容。 【实例12-3】Django模板的应用 Django指定的模板引擎在settings.py文件中定义，app1201\app1201\settings.py文件中的列表TEMPLATES中键“DIRS”用于指定模板文件所在的文件夹，其代码如下所示。 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', ], }, }, ] 然后在项目文件夹app1201的包文件夹app1201的子文件夹templates中建立1201.html网页文件。1201.html网页文件的代码如下。

` content `

从模板文件的代码中我们知道变量使用了“{{}}”。 接下来在项目文件夹app1201的包文件夹app1201中创建view.py文件，在app1201\app1201\view.py文件中定义方法referData()，用于向模板提交数据，该方法的代码如下。 from django.shortcuts import render def referData(request): context = {} context['state'] = 'Happy learning Python!' return render(request, '1201.html', context) 可以看到，这里使用render()方法替代之前使用的HttpResponse()方法。render()方法还使用了一个字典context作为参数，context字典中元素的“content”对应了模板中的变量“` content `”。 修改app1201\app1201\urls.py的urlpatterns列表，在该列表中添加一个元素的代码如下。 path('refer/', view.referData), 运行项目app1201，然后在浏览器地址栏中输入“http://127.0.0.1:8000/refer/”，然后按【Enter】键就可以看到“Happy learning Python!”的文本内容。这样就完成了使用模板来输出数据，从而实现数据与视图分离。 【任务12-1】基于Django框架设计简单用户登录程序 【任务描述】 （1）在PyCharm集成开发环境中创建Django项目app1201，并在项目文件夹app1201中创建子文件夹templates。 （2）在文件夹templates中创建2个网页文件，分别命名为“index.html”“userlist.html”，网页文件index.html用于实现用户登录功能，网页文件userlist.html用于以表格方式展示用户数据。 （3）在包文件夹app1201中添加1个views.py文件，在该文件中定义1个user_list列表、2个函数index()和userlist ()，其中函数index()用于使用方法render()加载网页文件index.html，函数userlist()用于验证用户名和密码是否正确，同时使用方法render()将数据分别加载进文件夹templates中定义的模板文件userlist.html中。 （4）修改完善settings.py、urls.py中的部分代码，实现所需功能。 【任务实施】 1．创建Django项目app1201 成功启动PyCharm后，在指定位置“D:\PycharmProject\Unit12”创建Django项目app1201，该项目成功创建后，会自动生成1个包文件夹app1201和1个文件夹templates。 程序文件settings.py保持其默认值不变。 2．修改完善文件urls.py 文件urls.py新增的代码如下所示。 from django.urls import path from app1201 import views urlpatterns = [ path('index/', views.index), path('userlist/', views.userlist), ] 3．在文件views.py中定义函数与编写代码 在包文件夹app1201中添加文件views.py，定义user_list列表和2个函数index()与userlist()，对应的代码如下所示。 from django.shortcuts import render user_list = [ {'username': 'chen', 'password': '123'}, {'username': 'jack', 'password': 'abc'}, {'username': 'tom', 'password': '456'} ] def index(request): return render(request, "index.html") def userlist(request): if request.method == 'POST': username = request.POST.get('username', None) password = request.POST.get('password', None) print("用户名：",username) print("密码：", password) if username=='admin' and password == '123': temp = {'username': username, 'password': password} user_list.append(temp) return render(request, 'userlist.html', {'userData': user_list}) else: return render(request, "index.html") 4．新增网页文件index.html与编写HTML代码 在文件夹templates中创建网页文件index.html，然后编写HTML代码。网页文件index.html的代码如电子活页12-1所示。 5．新增网页文件userlist.html与编写HTML代码 在文件夹templates中创建网页文件userlist.html，然后编写HTML代码。网页文件userlist.html的代码如电子活页12-2所示。 6．运行Django项目app1201 运行项目app1201，在浏览器地址栏中输入“http://127.0.0.1:8000/index/”，然后按【Enter】键就显示用户登录界面，在用户登录界面输入正确的用户名与密码，这里在用户名文本框中输入“admin”，在密码文本框中输入“123”，如图所示。 在用户登录界面输入正确的用户名与密码 在用户登录界面单击【登录】按钮，显示的用户信息列表如图所示。 用户信息列表 【任务12-2】基于Django框架设计图书数据和详情数据展示程序 【任务描述】 （1）在PyCharm集成开发环境中创建Django项目app1202，并在项目文件夹app1202中创建包文件夹static、app1202和文件夹templates，在包文件夹static中创建4个子文件夹css、images、js和pictureBig。 （2）在文件夹templates中创建4个网页文件，分别命名为“footer.html”“base.html”“index.html”“detail.html”，网页文件base.html是index.html和detail.html的父模板，网页文件index.html用于展示图书销量榜，网页文件detail.html用于展示图书详情信息。 （3）新增1个App，命名为“app02”，在包文件夹app02中会自动添加文件views.py，在该文件中定义2个函数book()和bookDetail()，这2个函数主要定义列表和使用方法render()将数据分别加载进文件夹templates中定义的模板文件index.html和detail.html中。 （4）修改完善settings.py、urls.py中的部分代码，实现所需功能。 【任务实施】 1．创建Django项目app1202 成功启动PyCharm后，在指定位置“D:\PycharmProject\Unit12”创建Django项目app1202，该项目成功创建后，会自动生成1个包文件夹app1202和1个文件夹templates。 2．创建子文件夹 在项目文件夹app1202中新增1个包文件夹static。然后在包文件夹static中创建4个子文件夹css、images、js和pictureBig，并将所需要的CSS样式文件、JS文件和图片分别复制并存放到各自文件夹中。 3．在Django项目app1202中创建1个App 在PyCharm主窗口下方的【Terminal】窗口虚拟环境命令行的“(venv) D:\PycharmProjects\
Unit12\app1202>”后面输入以下命令，然后按【Enter】键创建1个App应用程序。 python manage.py startapp app02 app02成功创建后，在包文件夹app02中会自动添加文件views.py。 4．修改完善文件settings.py 修改文件settings.py的部分设置。 在INSTALLED_APPS列表添加以下代码。 'app02', 最后添加以下代码。 STATIC_ROOT = os.path.join(os.path.dirname(__file__),'static') STATICFILES_DIRS = [ os.path.join(BASE_DIR, 'static') ] 其他的各项设置保持默认值不变。 5．修改完善文件urls.py 文件urls.py新增的代码如下所示。 from django.urls import path,re_path from app02.views import * urlpatterns = [ path('list/', book), re_path('detail/( P\d{1,2})', bookDetail), ] 6．在文件views.py中定义函数与编写代码 打开包文件夹app02中的文件views.py，定义2个函数book()和bookDetail()，文件views.py的代码如电子活页12-3所示。 7．新增网页文件footer.html与编写HTML代码 在文件夹templates中创建网页文件footer.html，然后编写HTML代码。网页文件footer.html的代码如下所示。

关于我们|联系我们|联系客服|合作招商|商家帮助|营销中心|友情链接

Copyright © 2020-2025  京东 版权所有   |  消费者维权热线：4006067733

8．新增网页文件base.html与编写HTML代码 在文件夹templates中创建网页文件base.html，然后编写HTML代码。网页文件base.html的代码如电子活页12-4所示。 9．新增网页文件index.html与编写HTML代码 在文件夹templates中创建网页文件index.html，然后编写HTML代码。网页文件index.html的代码如下所示。 {% extends "base.html" %} {% load static %} {% block title %} {% endblock title %} {% block content %}

{% for heatBook in heatBooks %}
• {% if forloop.counter < 10 %}
  0 `forloop`.`counter`
  {% else %}
  `forloop`.`counter`
  {% endif %}
  
  `heatBook`.`bookName`

  作　者：

  `heatBook`.`author` 著

  出版社：

  `heatBook`.`publisher`

  定　价：

  ¥`heatBook`.`dingPrice`

  京东价：

  ¥`heatBook`.`jdPrice` [ `heatBook`.`discount`折 ]

  商品详情
{% endfor %}

{% endblock %} 10．新增网页文件detail.html与编写HTML代码 在文件夹templates中创建网页文件detail.html，然后编写HTML代码。网页文件detail.html的代码如电子活页12-5所示。 11．运行Django项目app1202 运行项目app1202，在浏览器地址栏中输入“http://127.0.0.1:8000/list/”，然后按【Enter】键就会显示“图书销量榜”页面，如图所示。 “图书销量榜”页面 在页面左上角第1本图书区域单击【商品详情】，显示第1本图书的详情信息，图书的详情信息如图所示。 图书的详情信息 在该页面单击“数量”右侧的“+”或者“-”，也可以直接输入购买的数量，“数量”下方的金额会同步发生变化，如图所示。 数量改变时金额同步变化
总结评价 本单元主要学习创建Django项目与App应用程序、Django模板。

展开更多......

收起↑