Django使用模板后无法找到静态资源文件问题解决


Posted in Python onJuly 19, 2019

环境配置

  • Django版本1.11
  • python版本3.6.2

前言

在编写Django网站的时候,在涉及模板方面,一些简单的例子都没有问题,但这些例子都有一个共同点,那就是所使用的模板没有需要的静态资源文件。当涉及到模板中需要静态资源文件,如css,js等文件的时候,如果我们不做什么处理,直接按前端写好的给我们放入到templates文件中时,即如下形式:

|templates

|----js

|--------xxxx.js

|----css

|--------xxxx.css

|----xxxx.html

当运行网站的时候,我们会发现所有需要加载的都没有加载进来,原因便是在渲染页面的时候,Django的处理器将目录对应到了根目录,所以我们使用的其实是在根目录下的静态资源文件(其实并没有),所以也就会出现404错误。

解决方法

首先settings.py文件中应有如下代码

STATIC_URL = '/static/'

这是用来定义静态目录URL,一般都已经给出

在每个要使用到静态资源的模板中,我们应该将路径改为static下的目录,比如

/static/my_app/example.jpg

或者

{% load static %}
 <img src="{% static "my_app/example.jpg" %}" alt="My image"/>

当然,不使用static也行,可以自己定义存放静态资源文件的目录,如下:

STATICFILES_DIRS = [
 os.path.join(BASE_DIR, "static"),
 '/var/www/static/',
 ]

我们需要注意的是,这里的static文件夹是处于你所引用模板的app下的static文件夹,尽量不要把资源放在根目录下static文件夹,因为根目录下的static文件夹一般是用来将所有STATICFILES_DIRS中所有文件夹中的文件,以及各app中static中的文件都复制过来,为的是把这些文件放到一起是用apache等部署的时候更方便,如下

STATIC_ROOT = os.path.join(BASE_DIR, 'collected_static')

我们就定义了一个collected_static在根目录下用来收集所有静态资源文件。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Python 相关文章推荐
Python中关于字符串对象的一些基础知识
Apr 08 Python
Python json 错误xx is not JSON serializable解决办法
Mar 15 Python
TensorFlow在MAC环境下的安装及环境搭建
Nov 14 Python
详解python上传文件和字符到PHP服务器
Nov 24 Python
python正则表达式爬取猫眼电影top100
Feb 24 Python
python实现微信自动回复功能
Apr 11 Python
Python Logging 日志记录入门学习
Jun 02 Python
tensorflow实现简单逻辑回归
Sep 07 Python
python issubclass 和 isinstance函数
Jul 25 Python
如何用OpenCV -python3实现视频物体追踪
Dec 04 Python
python pyhs2 的安装操作
Apr 07 Python
PyQt5结合QtDesigner实现文本框读写操作
Jun 11 Python
Django模板Templates使用方法详解
Jul 19 #Python
python GUI图形化编程wxpython的使用
Jul 19 #Python
Django 外键的使用方法详解
Jul 19 #Python
python原类、类的创建过程与方法详解
Jul 19 #Python
Django 全局的static和templates的使用详解
Jul 19 #Python
python之拟合的实现
Jul 19 #Python
Django 过滤器汇总及自定义过滤器使用详解
Jul 19 #Python
You might like
Laravel 5.5官方推荐的Nginx配置学习教程
2017/10/06 PHP
PHP获取链表中倒数第K个节点的方法
2018/01/18 PHP
thinkphp整合系列之极验滑动验证码geetest功能
2019/06/18 PHP
thinkphp框架无限级栏目的排序功能实现方法示例
2020/03/29 PHP
JavaScript修改css样式style
2008/04/15 Javascript
Javascript valueOf 使用方法
2008/12/28 Javascript
下载站控制介绍字数显示的脚本 显示全部 隐藏介绍等功能
2009/09/19 Javascript
jquery 可排列的表实现代码
2009/11/13 Javascript
js+css实现增加表单可用性之提示文字
2013/06/03 Javascript
jQuery学习笔记之jQuery动画效果
2013/09/09 Javascript
Javascript浮点数乘积运算出现多位小数的解决方法
2014/02/17 Javascript
jQuery判断checkbox是否选中的3种方法
2014/08/12 Javascript
bootstrap改变按钮加载状态
2014/12/01 Javascript
页面内容排序插件jSort使用方法
2015/10/10 Javascript
浅析JSONP技术原理及实现
2016/06/08 Javascript
jQuery监听浏览器窗口大小的变化实例
2017/02/07 Javascript
layer弹窗插件操作方法详解
2017/05/19 Javascript
node中Express 动态设置端口的方法
2017/08/04 Javascript
基于bootstrap页面渲染的问题解决方法
2018/08/09 Javascript
VUE+Element UI实现简单的表格行内编辑效果的示例的代码
2018/10/31 Javascript
Mpvue中使用Vant Weapp组件库的方法步骤
2019/05/16 Javascript
ES6 class的应用实例分析
2019/06/27 Javascript
微信小程序Echarts覆盖正常组件问题解决
2019/07/13 Javascript
Python基于分水岭算法解决走迷宫游戏示例
2017/09/26 Python
解决python写入带有中文的字符到文件错误的问题
2019/01/31 Python
Python 控制终端输出文字的实例
2019/07/12 Python
使用django自带的user做外键的方法
2020/11/30 Python
科沃斯机器人官网商城:Ecovacs
2016/08/29 全球购物
施华洛世奇水晶荷兰官方网站:SWAROVSKI荷兰
2017/05/12 全球购物
电子专业推荐信范文
2013/11/18 职场文书
爱情检讨书大全
2014/01/21 职场文书
工地标语大全
2014/06/18 职场文书
在校实习生求职信
2014/06/18 职场文书
高中课前三分钟演讲稿
2014/09/13 职场文书
2015高考寄语集锦
2015/02/27 职场文书
苹果电脑mac os中货币符号快捷输入
2022/02/17 杂记