ملفات وقوالب Django الثابتة

تعد الملفات الثابتة مثل CSS و JavaScript والخطوط جزءًا أساسيًا من أي تطبيق ويب حديث. إلا أنها تعد مربكة عادةً للقادمين الجدد على Django نظرًا لأن جانغو يوفر مرونة هائلة حول كيفية استخدام هذه الملفات و القوالب.

في هذا الدرس سنقدم أفضل الممارسات الحالية لإعداد الملفات الثابتة في كل من مرحلة التطوير المحلي والإنتاج.

التطوير المحلي

بالنسبة للتطوير المحلي يقوم خادم الويب الخاص ب Django تلقائيًا بخدمة الملفات الثابتة والحد الأدنى من الإعدادات المطلوبة. و غالبًا ما يحتوي كل مشروع Django على تطبيقات متعددة وسيبحث Django افتراضيًا داخل كل تطبيق عن دليل  static يحتوي على ملفات ثابتة.

على سبيل المثال ، إذا كان أحد تطبيقاتك يسمى  blog  وأردت إضافة ملف CSS إليه يسمى  base.css ، فستحتاج أولاً إلى إنشاء دليل جديد يسمى  blog/static ثم إضافة الملف بداخله  blog/static/style.css.

ومع ذلك ، و نظرًا لأن معظم مشاريع Django تتضمن تطبيقات متعددة وملفات ثابتة مشتركة ، فمن الشائع في المشاريع الكبيرة حجمًا إنشاء مجلد على مستوى أساسي يسمى  static. و يمكن القيام بهذا من خلال سطر الأوامر باستخدام الأمر mkdir:

(.venv) $ mkdir static

بافتراض أنك بدأت للتو مشروع Django جديدًا باستخدام أمر  startproject ، بالإضافة إلى ملف  base.css فإن هيكل الدليل الخاص بك سيبدو الآن كما يلي:

├── django_project
│   ├── __init__.py
|   ├── asgi.py
│   ├── settings.py
│   ├── urls.py
│   └── wsgi.py
├── manage.py
├── static
│   ├── base.css

داخل ملف settings.py ، يوجد سطر خاص بإعدادات الملفات الثابتة يسمى STATIC_URL ، وهو موقع الملفات الثابتة في مشروعنا.

# django_project/settings.py
STATIC_URL = "static/"

هذا يعني أنه سيتم تخزين جميع الملفات الثابتة في الموقع  http://127.0.0.1:8000/static/  أو  http://localhost:8000/static/. وإذا أردت الوصول إلى ملف base.css فسيكون موقعه  http://127.0.0.1:8000/static/base.css  أو  http://localhost:8000/static/base.css.

تحميل الملفات الثابتة في القوالب

تحميل الملفات الثابتة في قالب هو عملية من خطوتين:

  • إضافة  {% load static %}  أعلى القالب.
  • أضف علامة القالب {٪ static٪} بالرابط المناسب.

هناك طريقتان رئيسيتان لهيكلة القوالب في مشروع Django. لنفترض أننا نستخدم ملف  templates/base.html لمشروع مدونة، و لإضافة ملف  base.css  الثابت الخاص بنا إليه ، سنبدأ بإضافة  {% load static %} في أعلى الملف ثم نستخدم علامة  {% static %} مع المسار المؤدي إليه. و نظرًا لأن  STATIC_URL  مضبوط بالفعل على  /static/ ، فإننا لا نحتاج إلى كتابة المسار كاملا  static/base.css ويمكننا بدلاً من ذلك تقصيره إلى  base.css.

<!-- templates/base.html -->
{% load static %}
<!DOCTYPE html>
<html>
<head>
  <title>Learn Django</title>
  <link rel="stylesheet" href="{% static 'base.css' %}">
</head>
...
</html>

إذا قمت بحفظ صفحة الويب وإعادة تحميلها ، فسترى التغييرات.

ستبدو إضافة روابط للصور في مجلد  img أو JavaScript في مجلد  js كما يلي:

<img src="{% static 'img/path_to_img' %}">
<script src="{% static 'js/base.js' %}"></script>

collectstatic

لخدمة الملفات الثابتة في الإنتاج يجب المرور بخطوات إضافية وهو مايربك عادةً القادمين الجدد على Django.

عند التطوير على الجهاز المحلي تكون الأمور لطيفة وسهلة، ولكنها بعيدة كل البعد عن الأداء. أما في بيئة الإنتاج، يكون من الأفضل دمج جميع الملفات الثابتة في مشروع Django في موقع واحد وخدمة ذلك مرة واحدة.

يأتي Django مع أمر مدمج  collectstatic يقوم بهذا من أجلنا.

نحتاج إلى ثلاثة إعدادات أخرى في ملف settings.py  قبل أن يعمل  collectstatic  بشكل صحيح، الأمر الأول هو STATICFILES_DIRS الذي يحدد مواقع إضافية ، إن وجدت ، يجب أن ينظر تطبيق staticfiles داخلها عند تشغيل  collectstatic.

في مثالنا البسيط ، الموقع الوحيد للملفات المحلية هو الدليل الثابت لذلك سنقوم بتعيين ذلك الآن.

# django_project/settings.py
STATIC_URL = "static/"
STATICFILES_DIRS = [BASE_DIR / "static"]  # جديد

الأمر الثاني هو STATIC_ROOT الذي يحدد الموقع المطلق لهذه الملفات المجمعة ، والتي تسمى عادةً  staticfiles

بمعنى آخر ، عند تشغيل  collecstatic محليًا ، فإنه سيجمع جميع الملفات الثابتة المتاحة ، كما هو محدد بواسطة  STATICFILES_DIRS ويضعها في دليل يسمى  staticfiles. و هذه هي الطريقة التي حددنا بها هذا الإعداد.

# settings.py
STATIC_URL = "static/"
STATICFILES_DIRS = [BASE_DIR / "static"]  
STATIC_ROOT = BASE_DIR / "staticfiles"  # جديد

الخطوة الأخيرة هي STATICFILES_STORAGE ، وهو محرك تخزين الملفات المستخدم عند تجميع الملفات الثابتة باستخدام الأمر  collectstatic.

افتراضيًا ، يتم تعيينه ضمنيًا على  django.contrib.staticfiles.storage.StaticFilesStorage.

وسيكون الإعداد الأخير في ملف  django_project/settings.py.

# settings.py
STATIC_URL = "static/"
STATICFILES_DIRS = [BASE_DIR / "static"]  
STATIC_ROOT = BASE_DIR / "staticfiles" 
STATICFILES_STORAGE = "django.contrib.staticfiles.storage.StaticFilesStorage"  # جديد

يمكننا الآن تشغيل الأمر  python manage.py collectstatic والذي سينشئ دليلًا جديدًا للملفات الثابتة.

(.venv) $ python manage.py collectstatic

إذا نظرت داخله فسترى أن  staticfiles بحتوي أيضًا على مجلدات  admin  (يمتلك admin المدمج ملفات ثابتة خاصة به) ، و  staticfiles.json ، وأي أدلة موجودة في مجلد static .

إذا أضفت الآن ملفًا ثابتًا جديدًا إلى دليل static فسيكون متاحًا على الفور للاستخدام المحلي.

أما في مرحلة للإنتاج لن يكون الملف موجودًا إلا إذا قمت بتشغيل python manage.py collectstatic في كل مرة.

مرحلة الإنتاج

على الرغم من أننا قمنا بإعداد مشروع Django الخاص بنا لجمع الملفات الثابتة بشكل صحيح، إلا أن هناك خطوة أخرى لم يتم تضمينها في مستندات Django الرسمية. و هو إعداد WhiteNoise لخدمة الملفات الثابتة في مرحلة الإنتاج.

الخطوة الأولى هي تثبيت أحدث إصدار من الحزمة:

(.venv) $ python -m pip install whitenoise

ثم في ملف  django_project/settings.py قم بإجراء ثلاثة تغييرات:

  • أضف  whitenoise إلى  INSTALLED_APPS فوق  staticfiles.
  • ضمن  MIDDLEWARE أضف  WhiteNoiseMiddleware في السطر الثالث.
  • غيّر  STATICFILES_STORAGE لاستخدام  WhiteNoise.
# settings.py
INSTALLED_APPS = [
    "django.contrib.admin",
    "django.contrib.auth",
    "django.contrib.contenttypes",
    "django.contrib.sessions",
    "django.contrib.messages",
    "whitenoise.runserver_nostatic",  # جديد
    "django.contrib.staticfiles",
]

MIDDLEWARE = [
    "django.middleware.security.SecurityMiddleware",
    "django.contrib.sessions.middleware.SessionMiddleware",
    "whitenoise.middleware.WhiteNoiseMiddleware",  # جديد
    "django.middleware.common.CommonMiddleware",
    "django.middleware.csrf.CsrfViewMiddleware",
    "django.contrib.auth.middleware.AuthenticationMiddleware",
    "django.contrib.messages.middleware.MessageMiddleware",
    "django.middleware.clickjacking.XFrameOptionsMiddleware",
]

...

STATIC_URL = "static/"
STATICFILES_DIRS = [BASE_DIR / "static"]  
STATIC_ROOT = BASE_DIR / "staticfiles"
STATICFILES_STORAGE = 'whitenoise.storage.CompressedManifestStaticFilesStorage'  # جديد

هذا كل شيء! قم بتشغيل  python manage.py collectstatic  مرة أخرى حتى يتم تخزين الملفات باستخدام WhiteNoise. ثم انشر موقعك بثقة على منصة الاستضافة التي تختارها.

فكرتين عن“ملفات وقوالب Django الثابتة”

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *

اكتشاف المزيد من بايثون العربي

اشترك الآن للاستمرار في القراءة والحصول على حق الوصول إلى الأرشيف الكامل.

Continue reading

Scroll to Top