欢迎来到海上华帆的博客园子

记录一些学习过程中的心得体会，供自己和有缘人参考！

Django项目中关于静态文件的引用

合集 - Python Web(14)
1.Django应用创建到启动的简单示例2.Django中型项目的目录结构和一个应用创建启动示例3.Ubungu+Django简单项目创建代码全4.Django+Vue构建前后端分离开发模式5.Django和MySQL与Vue项目之间的数据是如何流动实现交互响应的
6.Django项目中关于静态文件的引用
7.Django+nginx+静态网站8.Django项目中Ajax的应用，博客分类文章阅读，左右栏目自动更新9.Ajax代码运行前应该先加载jQuery10.关于css选择器和样式表的应用11.Django项目中使用markdown语法12.关于静态文件目录与模板引用和Nginx location块的适配设置13.html中javascript点击事件后显示或隐藏某些元素时需要点击两次才生效的原因分析和优化14.Flask与Django返回json数据的等价方法
收起

静态文件static的存放位置

  • 在项目文件根目录下创建static,在static文件夹下创建images,css,js,plugins;
  • 在应用app目录下创建static, ......
    如：
/home/lyh/django/aiparallelworld/
    ├── static/
    │   └── img/
    │       └── 1.png
    └── app1/
        ├── static/
        │   └── app1/
        │       └── images/
        │           └── 2.png
        └── templates/
        │   └── index.html
        └── images/
                └── 3.png

静态文件在项目配置文件settings.py中的配置项

import os

# 静态文件的URL前缀
STATIC_URL = 'static/'

# 项目根目录的静态文件目录
STATICFILES_DIRS = [
  os.path.join(BASE_DIR, 'static'),
]

# 静态文件的根目录（可用于部署项目到生产环境时运行`collectstatic`命令将静态文件收集到对应的文件夹内）
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')

模板文件中引用静态文件

模板文件html一般位于templates文件夹内，使用{% load static %}来加载静态文件模板标签库，并使用{% static 'img/1.png' %}模板标签来引用静态文件。
示例（index.html)：

<!DOCTYPE html>
<html lang='en'>
<head>
  <meta charset="UTF-8">
  <title Index Page</title>
  {% load static %}
</head>
<body>
  <h1>Welcome to Django</h1>
    <!-- 引用项目根目录下的静态文件 -->
    <img src="{% static 'img/1.png' %}" alt="Image 1">
    <!-- 引用应用app1目录下的静态文件 -->
    <img src="{% static 'app1/images/2.png' %}" alt="Image 2">
    <!-- 引用应用app1目录下的静态文件 这个应该也是可以的-->
    <img src="{% static 'images/3.png' %}" alt="Image 3">    
</body>
</html>

模板文件的渲染

若有应用，则在应用的views.py中定义视图函数，并使用render函数来渲染模板：

from django.shortcuts import render

def index(request):
  return render(request, 'index.html')

配置URL路由（若创建了应用，则还需要在应用下创建并配置urls.py，然后在项目的urls.py中包含应用的urls.py）

应用目录下创建urls.py并配置

# 应用的urls.py

from django.urls import path
from . import views

urlpatterns = [
  path('', views.index, name='index'),
]

项目目录下的urls.py配置

from django.urls import path, include

urlpatterns = [
  path('', views.index),
  path('app1/', include('app1.urls')),
]

总结

按照上面的操作，模板文件应该就能够引用static中的静态文件了。在部署到生产环境的时候，可以通过运行python manage.py collectstatic命令将所有用到的静态文件汇总到项目配置文件settings.py中的STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')定义的文件夹内。

posted @   海上华帆  阅读(13)  评论(1)  编辑  收藏  举报
相关博文：
· 关于静态文件目录与模板引用和Nginx location块的适配设置
· Django中型项目的目录结构和一个应用创建启动示例
· Django 静态文件配置
· django 模板和静态文件
· 十、Django静态文件
阅读排行：
· 被坑几百块钱后，我竟然真的恢复了删除的微信聊天记录！
· 没有Manus邀请码？试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 无需6万激活码！GitHub神秘组织3小时极速复刻Manus，手把手教你使用OpenManus搭建本
点击右上角即可分享
微信分享提示