Django压缩静态文件的实现方法详析


Posted in Python onAugust 26, 2018

django静态文件配置原理

静态文件配置就是为了让用户请求时django服务器能找到静态文件返回。

首先要理解几个概念:

  • 媒体文件:用户上传的文件
  • 静态文件:css,js,image等
  • 开发环境:使用django内置服务器处理静态文件
  • 生产环境:使用apache2/nginx服务器处理静态文件映射

所以在配置时要分清楚开发环境还是生产环境,这个后面会详细介绍。

下面先介绍一下服务器查找静态文件的原理,这样我们才能更好的配置。

引言

在网站开发阶段,对于静态资源文件比如JS,CSS等文件都是未经过压缩合并处理的,这对于访问量巨大的网站来说不仅浪费带宽,而且也会影响网站的访问速度。

django-compressor可以把js/css等静态文件压缩,这样不仅有利于减少网站的请求次数,还能节省网络带宽。

而这篇文章即是介绍使用如何使用Python的Django框架中的压缩组件django-compressor!

下面就介绍如何在Django中集成django-compressor!

安装django-compressor

安装很简单,pip安装下就可以了:

$ pip install django-compressor

然后在'setting'的INSTALLED_APPS中添加

INSTALLED_APPS = [
 #others
 'compressor'
]

setting配置

首先确保django.contrib.staticfiles已经包含在INSTALLED_APPS中,django1.6及以上版本是默认包含该app在其中的.

指定STATIC_URL

STATIC_ROOT = os.path.join(SITE_ROOT, 'collectedstatic')
# STATIC_URL是客户端访问静态资源的根路径配置 
STATIC_URL = '/static/'
STATICFILES = os.path.join(BASE_DIR, 'static')

配置STATICFILES_FINDERS

默认django会从每个app目录的static子目录下查找静态文件,因此通常情况下你都是将相关静态文件放在各自的app/static目录下。Django怎么知道从app/static目录查找静态文件呢?Django有个默认配置项STATICFILES_FINDERS:

STATICFILES_FINDERS = (
 'django.contrib.staticfiles.finders.FileSystemFinder',
 'django.contrib.staticfiles.finders.AppDirectoriesFinder',
 #other
 'compressor.finders.CompressorFinder',
)

添加django-compressor配置:

Django-Compressor开启与否取决于DEBUG参数,默认是COMPRESS_ENABLED 与 DEBUG 的值相反。因为 Django-Compressor 的功能本身是用在生产环境下项目发布前对静态文件压缩处理的。因此想在开发阶段 (DEBUG=True) 的时候做测试使用,需要手动设置 COMPRESS_ENABLED=True

COMPRESS_ENABLED = True
COMPRESS_OFFLINE = True
COMPRESS_CSS_FILTERS = [
 #creates absolute urls from relative ones
 'compressor.filters.css_default.CssAbsoluteFilter',
 #css minimizer
 'compressor.filters.cssmin.CSSMinFilter'
]
COMPRESS_JS_FILTERS = [
 'compressor.filters.jsmin.JSMinFilter'
]

使用

使用也很简单,模板文件中添加模板标签 <font color="red">{% load compress %}</font>

下面分别是css和js的使用方式

{% load compress %}
{% compress css %}
<link rel='stylesheet' href='{% static 'blog/css/style.css' %}' type='text/css'/>
{% endcompress %}
{% compress js %}
<script type="text/javascript" src="{% static 'blog/js/jquery-3.1.1.js' %}"></script>
{% endcompress %}

接着先运行命令:

$ python manage.py collectstatic --noinput

所有静态资源都将拷贝到STATIC_ROOT指定的目录中。

然后运行命令:

$ python manage.py compress --force

这样就会把压缩后的文件放在 <font color="red">STATIC_ROOT</font> 目录下面,大功告成!!

每次修改了js、css文件后,都需要重新加载最新的文件到 <font color="red">STATIC_ROOT</font> 目录下去,因此需要重新运行命令:

$ python manage.py collectstatic --noinput
$ python manage.py compress --force

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Python 相关文章推荐
Python for Informatics 第11章之正则表达式(四)
Apr 21 Python
Python 常用 PEP8 编码规范详解
Jan 22 Python
解决Python安装后pip不能用的问题
Jun 12 Python
Python解决线性代数问题之矩阵的初等变换方法
Dec 12 Python
使用python PIL库实现简单验证码的去噪方法步骤
May 10 Python
Pandas 缺失数据处理的实现
Nov 04 Python
django框架F&amp;Q 聚合与分组操作示例
Dec 12 Python
Python docutils文档编译过程方法解析
Jun 23 Python
python 使用建议与技巧分享(四)
Aug 18 Python
Python中Yield的基本用法
Oct 18 Python
Python爬虫自动化获取华图和粉笔网站的错题(推荐)
Jan 08 Python
Python数据可视化之基于pyecharts实现的地理图表的绘制
Jun 10 Python
Python实现将Excel转换成xml的方法示例
Aug 25 #Python
Python实现的简单计算器功能详解
Aug 25 #Python
Python基于OpenCV库Adaboost实现人脸识别功能详解
Aug 25 #Python
Python使用matplotlib绘制三维图形示例
Aug 25 #Python
Python实现的括号匹配判断功能示例
Aug 25 #Python
Django中使用Celery的教程详解
Aug 24 #Python
python tornado微信开发入门代码
Aug 24 #Python
You might like
微信公众号开发之微信公共平台消息回复类实例
2014/11/14 PHP
WordPress中缩略图的使用以及相关技巧
2015/11/24 PHP
JavaScript入门之对象与JSON详解
2011/10/21 Javascript
javascript中比较字符串是否相等的方法
2013/07/23 Javascript
JS+CSS实现一个气泡提示框
2013/08/18 Javascript
15款jQuery分布引导插件分享
2015/02/04 Javascript
使用JavaScript实现连续滚动字幕效果的方法
2015/07/07 Javascript
基于jQuery全屏焦点图左右切换插件responsiveslides
2015/09/07 Javascript
Javascript实现图片不间断滚动的代码
2016/06/22 Javascript
javascript的document中的动态添加标签实现方法
2016/10/24 Javascript
Vue + Webpack + Vue-loader学习教程之相关配置篇
2017/03/14 Javascript
validationEngine 表单验证插件使用实例代码
2017/06/15 Javascript
angular使用bootstrap方法手动启动的实例代码
2017/07/18 Javascript
Vue学习笔记进阶篇之单元素过度
2017/07/19 Javascript
jQuery 禁止表单用户名、密码自动填充功能
2017/10/30 jQuery
vue双花括号的使用方法 附练习题
2017/11/07 Javascript
详解Node.js读写中文内容文件操作
2018/10/10 Javascript
基于vue的验证码组件的示例代码
2019/01/22 Javascript
JavaScript实现预览本地上传图片功能完整示例
2019/03/08 Javascript
JS自定义右键菜单实现代码解析
2020/07/16 Javascript
用Python实现web端用户登录和注册功能的教程
2015/04/30 Python
Python之re操作方法(详解)
2017/06/14 Python
Python操作Oracle数据库的简单方法和封装类实例
2018/05/07 Python
wxPython+Matplotlib绘制折线图表
2019/11/19 Python
有趣的Python图片制作之如何用QQ好友头像拼接出里昂
2020/04/22 Python
Bench加拿大官方网站:英国城市服装品牌
2017/11/03 全球购物
编写一个类体现构造,公有,私有方法,静态,私有变量
2013/08/10 面试题
90后毕业生的求职信范文
2013/09/21 职场文书
美国留学经济担保书
2014/05/20 职场文书
环境科学专业教师求职信
2014/07/12 职场文书
群众路线教育实践活动批评与自我批评
2014/09/15 职场文书
KTV门卫岗位职责
2014/10/09 职场文书
安全教育片观后感
2015/06/17 职场文书
赞美教师的句子
2019/09/02 职场文书
古诗之感恩老师
2019/10/24 职场文书
MySQL如何修改字段类型和字段长度
2022/06/10 MySQL