Django 靜態文件 js css 訪問(一)

http://www.cnblogs.com/starof/p/4682812.html

starof
博客園首頁新隨筆聯繫訂閱 管理
隨筆 - 155 文章 - 0 評論 - 249
django靜態文件配置

一、django靜態文件配置原理
靜態文件配置就是爲了讓用戶請求時django服務器能找到靜態文件返回。

首先要理解幾個概念:

媒體文件:用戶上傳的文件
靜態文件:css,js,image等
開發環境:使用django內置服務器處理靜態文件
生產環境:使用apache2/nginx服務器處理靜態文件映射
所以在配置時要分清楚開發環境還是生產環境,這個後面會詳細介紹。

下面先介紹一下服務器查找靜態文件的原理,這樣我們才能更好的配置。

1、django.contrib.staticfiles
django.contrib.staticfiles是django1.3新增的一個app來幫助開發者管理靜態文件【js,css等】。

django1.3之前的靜態文件都是用MEDIA_URL和MEDIA_ROOT來控制的。

爲了將媒體文件【用戶上傳的文件】和靜態文件做區分,django1.3通過MEDIA_XXX配置來處理媒體文件,通過STATIC_XXX配置項來處理靜態文件。

staticfiles使開發者可以將靜態文件分配到app目錄或任意指定目錄。

2、MEDIA_XXX和STATIC_XXX配置項的區別
MEDIA_XXX配置項用來管理媒體文件。經常由FileFields字段上傳,它們被保存在settings.MEDIA_ROOT指定的目錄下,通過settings.MEDIA_URL指定的路徑訪問。

STATIC_XXX配置項用來管理靜態文件。它們通過manage.py collectstatic命令彙集到settings.STATIC_ROOT目錄,並通過settings.STATIC_URL指定的路徑訪問。

3、 靜態文件相關配置項詳解
STATIC_ROOT配置項

用來指定執行manage.py collectstatic時靜態文件存放的路徑。在生成環境中,集中存放靜態資源有利於使用Lighttpd/Nginx/apache2託管靜態資源。爲了方便調試,通常設置如下:

SITE_ROOT = os.path.dirname(os.path.abspath(file))
SITE_ROOT = os.path.abspath(os.path.join(SITE_ROOT, ‘../’))
STATIC_ROOT = os.path.join(SITE_ROOT, ‘collectedstatic’)
STATIC_URL配置項

django模板中,可以引用{{STATIC_URL}}變量避免把路徑寫死。通常使用默認設置

STATIC_URL = ‘/static/’
ADMIN_MEDIA_PREFIX配置項

ADMIN_MEDIA_PREFIX必須爲如下配置,以便staticfiles能夠正確找到django.contrib.admin的靜態資源:

ADMIN_MEDIA_PREFIX = STATIC_URL + ‘admin/’
在模板中使用STATIC_URL


原理懂了後,接下來介紹開發環境和生產環境中靜態文件具體配置。

我的django版本是1.4.21,以此版本做介紹。

import django
print django.get_version()
1.4.21
二、開發環境
django1.4,21中默認已安裝了staticfiles app,所以開發環境中對靜態文件的訪問不需要對django做任何配置。

有一點:開發環境staticfiles查找靜態文件的順序取決於STATIC_FINDERS配置項,默認配置

STATICFILES_FINDERS = (
‘django.contrib.staticfiles.finders.FileSystemFinder’,
‘django.contrib.staticfiles.finders.AppDirectoriesFinder’,

‘django.contrib.staticfiles.finders.DefaultStorageFinder’,

)
FileStstemFinder用來用STATICFILES_DIRS【默認爲空】指定的路徑中查找額外的靜態文件。像jquery,bootstrap等這樣公用的資源文件都是在多個不同的app中共用的,django提供了公有的目錄來放這些文件,這個配置參數就是:STATICFILES_DIRS
AppDirectoriesFinder從INSTALLED_APPS元組中的APP所在包的static目錄中查找資源文件。
使用如下。

1、新建項目lxyproject

[root@yl-web srv]# django-admin.py startproject lxyproject
2、在項目中新建一個app名叫hello

[root@yl-web lxyproject]# python manage.py startapp hello
[root@yl-web lxyproject]# ls
hello lxyproject manage.py
在hello app下建一個static目錄用來存放靜態文件。

[root@yl-web hello]# mkdir static
[root@yl-web hello]# ls
init.py models.py static tests.py views.py
然後在static目錄新建一個hello.txt的靜態文件。

[root@yl-web hello]# cd static/
[root@yl-web static]# ls
hello.txt
[root@yl-web static]# cat hello.txt
hello.txt’s content:congratulations!!
3、在項目的settings.py文件中INSTALLED_APPS中配置hello app

INSTALLED_APPS = (

‘hello’,
)
4、運行項目

[root@yl-web lxyproject]# python manage.py runserver 0.0.0.0:9000
5、通過url訪問

在static目錄下新建一個images目錄放一張sheep.png圖片,同理通過url訪問

三、生產環境
前面也說了,在生成環境中,集中存放靜態資源有利於使用Lighttpd/Nginx託管靜態資源。而生產環境一般是把靜態文件放在項目根目錄下的static目錄下。

默認配置

STATIC_ROOT = ”
STATIC_URL = ‘/static/’
STATICFILES_DIRS = (
)
我們要做的是

1、配置服務器,我用的是apache。

安裝配置詳情可參考:

Ubuntu apache2服務器配置

centos7 apache httpd安裝和配置django項目

2、在項目根目錄下創建collectedstatic目錄。

3、配置settings.py

複製代碼
import os

SITE_ROOT = os.path.dirname(os.path.abspath(file))
SITE_ROOT = os.path.abspath(os.path.join(SITE_ROOT, ‘../’))
STATIC_ROOT = os.path.join(SITE_ROOT, ‘collectedstatic’)
STATIC_URL = ‘/static/’
STATICFILES_DIRS = (
# Put strings here, like “/home/html/static” or “C:/www/django/static”.
# Always use forward slashes, even on Windows.
# Don’t forget to use absolute paths, not relative paths.
)
INSTALLED_APPS = (
‘django.contrib.auth’,
‘django.contrib.contenttypes’,
‘django.contrib.sessions’,
‘django.contrib.sites’,
‘django.contrib.messages’,
‘django.contrib.staticfiles’,
# Uncomment the next line to enable the admin:
# ‘django.contrib.admin’,
# Uncomment the next line to enable admin documentation:
# ‘django.contrib.admindocs’,
‘hello’,
)
複製代碼
4、運行python manage.py collectstatic收集所有已安裝的APP的靜態文件到根目錄的collectedstatic【即STATIC_ROOT】中

複製代碼
[root@yl-web lxyproject]# python manage.py collectstatic

You have requested to collect static files at the destination
location as specified in your settings.

This will overwrite existing files!
Are you sure you want to do this?

Type ‘yes’ to continue, or ‘no’ to cancel: yes
Copying ‘/srv/lxyproject/hello/static/images/sheep.png’

1 static file copied.
複製代碼
5、配置服務器,將/static/路徑指向STATIC_ROOT目錄。

即在虛擬主機中配置

Alias /static/ /srv/lxyproject/collectedstatic/
6、配置至此完成,通過瀏覽器訪問

真正發佈一個django項目時,對靜態文件的管理可能需要額外做一些工作:

Less / CoffeeScript 等自動編譯成css/js
“壓縮” css/js文件,提高瀏覽器加載速度
合併零碎的css/js文件,減少瀏覽器請求次數
靜態資源文件的版本話:瀏覽器會緩存靜態文件,後臺代碼和靜態資源文件都發生更新後,瀏覽器很可能從緩存提取過期的靜態資源,導致頁面顯示異常。
參考:

django.contrib.staticfiles 文檔

collectstatic命令

django compressor壓縮靜態文件

管理靜態文件

django中對靜態文件的支持

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章