Django静态文件处理 Django静态文件处理|Django

本文概述

Django静态（CSS, JavaScript, 图像）配置
Django加载JavaScript

在Web应用程序中, 除了业务逻辑和数据处理之外, 我们还需要处理和管理CSS, JavaScript, 图像等静态资源。
管理这些资源很重要, 这样它才不会影响我们的应用程序性能。
Django非常有效地处理它, 并提供了一种方便的方式来使用资源。
django.contrib.staticfiles模块有助于管理它们。
Django静态（CSS, JavaScript, 图像）配置 1.将django.contrib.static文件包含在INSTALLED_APPS中。

INSTALLED_APPS = ['django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'myapp']

2.如下所示, 在settings.py文件中定义STATIC_URL。

STATIC_URL = '/static/'

3.使用以下表达式将静态文件加载到模板中。

{% load static %}

4.将所有图像, JavaScript, CSS文件存储在应用程序的静态文件夹中。首先创建一个静态目录, 将文件存储在其中。

文章图片

//urls.py

from django.contrib import adminfrom django.urls import pathfrom myapp import viewsurlpatterns = [path('admin/', admin.site.urls), path('index/', views.index), ]

//views.py

def index(request):return render(request, 'index.html')

使用python manage.py runserver命令运行服务器。
之后, 通过localhost：8000 / index URL访问模板, 它将向浏览器产生以下输出。

文章图片

// index.html

< !DOCTYPE html> < html lang="en"> < head> < meta charset="UTF-8"> < title> Index< /title> {% load static %}< script src="http://www.srcmini.com/{% static'/js/script.js' %}" type="text/javascript"> < /script> < /head> < body> < /body> < /html>

// script.js

alert("Hello, Welcome to srcmini");

现在, 我们的项目结构如下所示：

使用python manage.py runserver命令运行服务器。
之后, 通过localhost：8000 / index URL访问模板, 它将向浏览器产生以下输出。

Django加载CSS示例
要加载CSS文件, 请在index.html文件中使用以下代码。

{% load static %}< link href="http://www.srcmini.com/{% static'css/style.css' %}" rel="stylesheet">

之后, 创建目录CSS和文件style.css, 其中包含以下代码。
// style.css

h1{color:red; }

我们的项目结构如下所示：

// index.html

< !DOCTYPE html> < html lang="en"> < head> < meta charset="UTF-8"> < title> Index< /title> {% load static %}< link href="http://www.srcmini.com/{% static'css/style.css' %}" rel="stylesheet"> < /head> < body> < h1> Welcome to srcmini< /h1> < /body> < /html>

使用python manage.py runserver命令运行服务器。
之后, 通过输入localhost：8000 / index URL访问模板, 它将向浏览器产生以下输出。

【Django静态文件处理】好了, 在本主题中, 我们学习了有效管理静态文件的过程。