Part6 靜態檔案的管理
這篇教程從第5節開始,我們已經建立了一個測試過的web投票應用,現在我們會新增一個表格和一張圖片。
除了由伺服器生成的HTML,web應用通常也需要提供額外的檔案 —— 例如圖片、JS或者CSS,這些都是用來渲染完整的Web頁面。在Django裡,我們把這些檔案統一稱為“靜態檔案”。
對於小的專案,這個不是大問題,因為你只需要把靜態檔案放在你的web伺服器可以找到的地方久可以了。然而,在大的專案裡,特別是由多個app組成的專案。處理每個app提供的多個靜態檔案集合就開始變得棘手了。
這就是django.contrib.staticfiles處理的事情:它從你的每個應用(或者你指定的其他位置)裡收集靜態檔案到一個單獨的位置,這個位置在生產環境可以簡單地供客戶端訪問。
定製你的APP的外觀和感覺
首先,在你的polls
目錄裡建立一個名為static
的目錄,Django會在這裡查詢靜態檔案,這個和Django在polls/templates/
裡查詢模板檔案很相似。
Django的STATICFILES_FINDERS
設定包含了一個查詢目錄列表,知道怎麼去多個資源位置查詢靜態檔案。預設設定是AppDirectoriesFinder
,用來在每個INSTALLED_APPS
目錄下面尋找static
子目錄。就像我們剛才在polls
下面建立的那個。admin站點也是用這種方式管理他的靜態檔案。
在你剛建立的static
目錄裡面,建立一個polls
目錄,然後在polls
目錄裡面建立一個叫做style.css
的檔案。換句話說,你的樣式檔案路徑應該是polls/static/polls/style.css
。因為AppDirectoriesFinder
靜態檔案查詢器的工作方式,以後你可以在Django裡簡單地通過polls/style.css
這樣來引用靜態檔案。和你引用模板的路徑相似。
靜態檔案名稱空間
和模板一樣,我們可以直接將靜態檔案放在polls/static
裡(而不是建立一個polls子目錄),但這樣做不是很好。因為Django會選擇第一個名稱匹配的靜態檔案,如果你在不同的應用裡有相同名稱的靜態檔案的話,Django是沒用能力分辨這些同名檔案之間的區別的,只會使用第一個找到的檔案。所以最簡單的方式就是把他們放到名稱空間裡。就是把這些靜態檔案放到一個應用名稱的子目錄下面。
把下面的程式碼放到樣式表裡面(polls/static/polls/style.css
):
li a {
color: green;
}
下一步,把下面的程式碼新增到polls/template/polls/index.html
檔案的頂端:
{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'polls/style.css' %}" />
{% static %}
模板標籤生成靜態檔案的絕對url路徑。這就是你在開發中要做的所有事情,重新載入http://localhost:8000/polls/
地址,你會看到question的連結是綠色的(Django 風格),意味著你的樣式表正常載入了。
新增一個背景圖象
下一步,我們要為圖象建立一個子目錄,在polls/static/polls/
目錄下面建立一個images
子目錄,在這個目錄裡面,放一個叫做background.gif的圖片檔案。換句話說,你的圖片檔案位置是:polls/static/polls/images/background.gif
.
然後,把下面的程式碼新增到你的樣式表(polls/static/poll/style.css
)裡。
body {
background: white url("images/background.gif") no-repeat right bottom;
}
重新載入http://localhost:8000/polls/
你會發現背景圖在螢幕的右上方。
警告
像你的樣式表那樣使用{% static %}
模板標籤當然不可用,特別是檔案不是由Django生成的時候。你應該經常使用相對路徑來連結你的靜態檔案。因為這樣後面你才能修改STATIC_URL
(被STATIC
模板標籤用來生成它自己的URL路徑)而不需要修改你的靜態檔案裡的一堆路徑。
上面這些都是基礎內容,對於更多的設定細節以及其他包含框架的的內容,可以看官方文件怎麼組織靜態檔案和靜態檔案引用。分發靜態檔案這篇文件則是討論怎麼在一個真實的伺服器上使用靜態檔案。
當你熟悉了怎麼使用靜態檔案以後,就可以學習第7節的內容,關於怎麼定製Django的自動生成式管理站點了。
相關文章
- django入門-靜態檔案-part6Django
- Django 靜態檔案管理與部署指南Django
- Sanic 靜態檔案
- nginx偽靜態檔案Nginx
- php生成靜態檔案PHP
- 7、靜態檔案的載入
- nginx靜態檔案快取Nginx快取
- Django靜態檔案輸出Django
- 靜態引數檔案配置
- 關於Play框架的靜態檔案框架
- LNMP–配置靜態檔案快取LNMP快取
- nginx 只快取靜態檔案Nginx快取
- asp .net core 靜態檔案資源
- go編譯靜態檔案到exeGo編譯
- Go 內嵌靜態檔案工具 packrGo
- iOS打包.a靜態庫檔案(入門)iOS
- Django1.11.7配置靜態檔案Django
- 來玩Play框架07 靜態檔案框架
- 03 #### 讀取靜態檔案-圖片
- 啟動靜態檔案中介軟體
- 一、靜態庫和動態庫,Makefile專案管理專案管理
- vue 靜態檔案上傳到七牛Vue
- asp.net core 系列之靜態檔案ASP.NET
- vue中 靜態檔案引用注意事項Vue
- Django 教程之media和static靜態檔案Django
- Django基礎二靜態檔案和ORMDjangoORM
- 使用nginx快取伺服器上的靜態檔案Nginx快取伺服器
- Django1.4和1.3的靜態檔案路徑配置Django
- go-zero微服務框架的靜態檔案服務Go微服務框架
- Asp.Net Core入門之靜態檔案ASP.NET
- .Net Core 中介軟體之靜態檔案(StaticFiles)
- Nginx下快取靜態檔案(如css js)Nginx快取CSSJS
- django-驗證碼/靜態檔案處理Django
- Django初級手冊6-靜態檔案Django
- 第三章-靜態檔案與inode
- Asp-Net-Core開發筆記:使用NPM和gulp管理前端靜態檔案筆記NPM前端
- ASP.NET Core使用靜態檔案、目錄遊覽與MIME型別管理ASP.NET型別
- webpack 靜態資源管理Web