Django中模版的使用

模版的基础知识和使用方法在前面的博客中已经有过相关的介绍，这篇博客从项目的角度出发，结合前面路由和视图中的练习项目，加入模版，使得之前的项目更加完善。之前的项目回顾可以参见Django学习Day3——视图和路由（二），主要是借助豆瓣平台提供的API进行音乐的查找，不过当时因为没有进行前端的渲染，直接在命令行模式下进行音乐的查询，这次的项目，加入模版，将查询到的结果展示在前端页面。具体的实现过程如下：

创建模版文件，进行相关配置

首先在根目录下创建templates文件夹以及music.html模版文件，并且在项目的设置中完成模版路径的配置。

修改视图函数

文件路径（app_search/views.py）

# coding:utf-8
from django.views.generic import View
# from django.http import JsonResponse
import requests
from django.shortcuts import render

class Music(View):
    DOUBAN_API = "https://api.douban.com/v2/music/search?q={0}"
    TEMPLATE = "music.html"
    def get(self, request, music_name):
        # 拼接查询的URL
        url = self.DOUBAN_API.format(music_name)

        # 通过requests模块进行访问
        try:
            re = requests.get(url)
        except Exception as e:
            return render(request, self.TEMPLATE, {'error':str(e)})

        # 如果返回的状态码不是200，说明请求豆瓣的API没有成功
        if re.status_code != 200:
            return render(request, self.TEMPLATE, {'error':'请求豆瓣异常！'})

        response = re.json()
        return render(request, self.TEMPLATE, response)

编写music.html模版文件

在编写music.html文件之前，我们首先使用之前的命令行窗口调用的方式，对于豆瓣API返回的数据有一个基础的认识：

可以看到，返回的data数据中，有"count"，"start"，"total"，"musics"四个字段，我们选择"count"字段（显示查询的结果条数）和"musics"字段（查询的音乐详细结果）进行前端展示。

因为返回的查询结果中有多条音乐，我们以一条音乐为例，查看得到音乐的相关字段属性如上所示，我们选择"author"，"image"，"alt"进行展示。

所以，我们的music.html文件中的代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!--img网上地址的图片如果不能显示，需要加上下面这句话-->
    <meta name="referrer" content="no-referrer">
    <title>Music</title>
</head>
<body>
{% if error %}
<h3>出现错误：{
   
   {error}}</h3>
{% else %}
<h3>音乐名称：{
   
   {music_name}}</h3>
<div>共计{
   
   {count}}条数据</div>
<ul>
    {% for music in musics %}
    <li>
        <p>歌名：{
   
   {music.title}}， 演唱者：{% for person in music.author %}{
   
   {person.name}}{% endfor %}</p>
        <a href="{
   
   {music.alt}}"><img src="{
   
   {music.image}}"></a>
    </li>
    {% endfor %}
</ul>
{% endif %}
</body>
</html>