Django 简明教程

Django - Add Static Files

What are Static Files in Django?

django 模板语言允许数据动态插入到网页中。然而，一个网页应用程序还需要一些资源，例如图像、JavaScript 代码和样式表，以渲染完整的网页。这些类型的文件被称为 static files 。在 Django 应用程序中，这些文件存储在应用程序文件夹内的静态文件夹中。

The Staticfiles App

Django 中自动安装 staticfiles 应用程序 ( django.contrib.staticfiles )，该应用程序管理静态文件。

INSTALLED_APPS = [
   . . .,
   'django.contrib.staticfiles',
   'firstapp',
]

Django 在" app/static "文件夹中查找所有静态资源（该文件夹被命名为 static ，位于应用程序的 package 文件夹中）。

首先，我们需要在 myapp package 文件夹内创建一个名为" static "的文件夹来存储这些文件。让我们将"django.png"文件存储在此文件夹中。

确保在 " settings.py " 模块中，STATIC_URL 参数被设置为指向此文件夹。

STATIC_URL = 'static/'

Add a View

让我们添加以下视图 −

from django.shortcuts import render
from django.http import HttpResponse

# Create your views here.
def index(request):
   return render(request, "index.html", {})

Register the View

还应当在应用程序的 URLCONF 中注册此视图 −

from django.urls import path
from . import views

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

为了在模板中使静态文件夹可用，请使用 load template tag 例如在以下语句中 −

{% load static %}

index.html

现在，我们可以使用静态路径在 <img src> 标记中引用该图像。让我们修改 " index.html " 文件为 −

<html>
<body>
   {% load static %}
   <img src="{% static 'django.png' %}" alt="My image">
</body>
</html>

启动服务器并访问 URL " http://localhost:8000/myapp/ "。"django.png"文件将显示在浏览器中。

django add static files

staticfiles app 还帮助提供 CSS 和 JS 文件。要将其包含为 CSS 文件，提供其相对于 href 属性的 {% static %} 标签的相对路径。

<link rel="stylesheet" type="text/css" href="{% static 'style.css' %}">

要加载 JavaScript 代码，请使用以下语法 −

<head>
   {% load static %}
   <script src = "{% static 'script.js' %}"></script>
</head>