ملفات وقوالب 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 الثابتة

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

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

collectstatic

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

مرتبط

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

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

اترك تعليقاً إلغاء الرد

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

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

collectstatic

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

شارك هذا الموضوع:

مرتبط

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

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

اترك تعليقاً إلغاء الرد

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