专栏首页Devops专栏Django 2.1.7 模板 - 动态配置静态文件路径

Django 2.1.7 模板 - 动态配置静态文件路径

相关篇章

Django 2.1.7 创建应用模板 Django 2.1.7 配置公共静态文件、公共模板路径 Django 2.1.7 模板语言 - 变量、标签、过滤器、自定义过滤器、模板注释 Django 2.1.7 模板继承 Django 2.1.7 模板 - HTML转义 Django 2.1.7 模板 - CSRF 跨站请求伪造 Django 2.1.7 模板 - 图片验证码的实现 Django 2.1.7 模板 - 动态URL 反向解析

静态文件

项目中的CSS、图片、js都是静态文件。一般会将静态文件放到一个单独的目录中,以方便管理。在html页面中调用时,也需要指定静态文件的路径,Django中提供了一种解析的方式配置静态文件路径。静态文件可以放在项目根目录下,也可以放在应用的目录下,由于有些静态文件在项目中是通用的,所以推荐放在项目的根目录下,方便管理。

示例

1)在mysite/settings.py文件中定义静态文件存放的物理目录。

STATIC_URL = '/static/'
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'static'),
]

2)在项目根目录下创建static目录,再创建img、css、js目录。

3)在assetinfo/views.py中定义视图static_test。

def static_test(request):
    return render(request,'assetinfo/static_test.html')

4)在assetinfo/urls.py中配置url。

urlpatterns = [
    # ex:/assetinfo/static_test
    path('static_test', views.static_test, name='static_test'),
]

5)在templates/assetinfo/下创建static_test.html文件。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <img src="/static/images/slide01.jpg"/>
</body>
</html>

6)保存图片到static/images/目录下,名称为slide01.jpg。

7)运行服务器,浏览效果如下图: http://127.0.0.1:8000/assetinfo/static_test

配置静态文件

Django提供了一种配置,可以在html页面中可以隐藏真实路径。

1)在mysite/settings.py文件中修改STATIC_URL项。

STATIC_URL = '/abc/'
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'static'),
]

2)刷新浏览器,图片找不到了,效果如下图:

3)修改templates/assetinfo/static_test.html如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    修改前:<img src="/static/images/slide01.jpg"/>
    <hr>
    修改后:<img src="/abc/images/slide01.jpg"/>
</body>
</html>

3)刷新浏览器,效果如下图:

如果在模板中写死了静态文件路径,后续修改的话会很麻烦,下面来看看动态静态文件路径。

动态静态文件路径

1)修改templates/assetinfo/static_test.html如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    修改前:<img src="/static/images/slide01.jpg"/>
    <hr>
    修改后:<img src="/abc/images/slide01.jpg"/>
    <hr>
    配置动态静态文件:
    {% load static from staticfiles %}
    <img src="{% static "images/slide01.jpg" %}">
</body>
</html>

2)刷新浏览器,效果如下图:

说明:这种方案可以隐藏真实的静态文件路径,但是结合Nginx布署时,会将所有的静态文件都交给Nginx处理,而不用转到Django部分,所以这项配置就无效了。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Django 2.1.7 模板 - HTML转义

    Django 2.1.7 创建应用模板 Django 2.1.7 配置公共静态文件、公共模板路径 Django 2.1.7 模板语言 - 变量、标签、过滤器...

    Devops海洋的渔夫
  • html概述和基本结构 - html的helloworld

    HTML是 HyperText Mark-up Language 的首字母简写,意思是超文本标记语言,超文本指的是超链接,标记指的是标签,是一种用来制作网页的语...

    Devops海洋的渔夫
  • Python web框架开发 - 路由功能

    思考:这里就存在一个缺陷,虽然页面的确能够返回正确的html页面,但是后续如果不同的页面需要做不同的数据逻辑返回处理,该怎么区分出来呢?

    Devops海洋的渔夫
  • 一段pdf转word的Java代码

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。

    Jerry Wang
  • [解读REST] 3.基于网络应用的架构

    链接上文[解读REST] 2.REST用来干什么的?,上文中解释到什么是架构风格和应该以怎样的视角来理解REST(Web的架构风格)。本篇来介绍一组自洽的术语,...

    blackheart
  • 关于mysql常用时间函数

    转载请注明出处:帘卷西风的专栏(http://blog.csdn.net/ljxfblog) 

    帘卷西风
  • 从西直门立交桥谈IT架构与重构(干货)

    2015年8月13日 PM 20:00 Neeke君从一个战场奔赴至另一个战场,回到办公室,打开电脑,登陆微信,精彩的的微社群分享马上就要开始了! 个人简介: ...

    小小科
  • LGBT主题式的VR体验,让你感知同志们的辛酸苦楚

    VRPinea
  • AI 医疗三类证终于出了!科亚医疗“冠脉血流储备分数计算软件”获批上市

    雷锋网AI掘金志消息,近日,国家药品监督管理局经审查,批准了北京昆仑医云科技有限公司(科亚医疗)生产的创新产品“冠脉血流储备分数计算软件”的注册。这是首个以“深...

    AI掘金志
  • 谈起架构时,我们在说些什么?

    感谢支持ayqy个人订阅号,每周义务推送1篇(only unique one)原创精品博文,话题包括但不限于前端、Node、Android、数学...

    ayqy贾杰

扫码关注云+社区

领取腾讯云代金券