أنشئ أداة تحميل صور بسيطة ولكنها فعالة باستخدام هذا البرنامج التعليمي في Python.

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

على الرغم من أهمية الصور ، إلا أنها يمكن أن تبطئ التطبيق وتزيد من تهديدات الأمان لقاعدة البيانات.

بالنسبة للتطبيقات المبنية على Django ، فإن تحميل الصور سهل وآمن. لدى Django ميزة متخصصة تتيح تحميل الصور.

دعنا نتعلم كيفية تحميل الصور إلى تطبيق Django دون المساس بالأمان.

ماذا تحتاج

قبل البدء في تحميل الصور ، تأكد من توفر المتطلبات التالية:

  • ثبت بايثون
  • تثبيت Pip
  • ثَبَّتَ بيبنف (يمكنك أيضًا استخدام venv إذا كنت ترغب في ذلك)
  • قم بتثبيت Django
  • لديك تطبيق Django حالي يحتاج إلى صور

الآن بعد أن أصبح لديك التبعيات اللازمة ، فلنبدأ.

1. تثبيت وسادة

يمتلك Django ملف ImageField في نماذجها. يخزن الحقل تحميلات الصور في موقع محدد في نظام الملفات ، وليس قاعدة البيانات. وسادة هي مكتبة Python التي تتحقق من الصور في ImageField.

لتثبيت وسادة استخدم الأمر أدناه:

pipenv install pillow

إذا كنت تستخدم venv ، فاستخدم هذا الأمر بدلاً من ذلك

instagram viewer 
pip install pillow

2. إنشاء نموذج

يخترع ImageField مرجع في قاعدة البيانات. ثم أضف ملف حمل الى حجة في النموذج. تحدد الوسيطة موقع التخزين في نظام الملفات.

classProfile(models.Model):
 name = models.CharField(max_length=80, blank=True)
 bio = models.TextField(max_length=254, blank=True)
 profile_picture = models.ImageField(upload_to='photos/')

def__str__(self):
returnf'{self.user.username} profile'

تساعد الطريقة في النهاية على تحويل البيانات إلى سلاسل.

بعد ذلك ، قم بترحيل وتنفيذ التغييرات الجديدة في قاعدة البيانات. بعد ذلك ، تحتاج إلى تعديل إعدادات المشروع.

انتقل إلى إعداد المشروع. تحت العنوان # ملفات ثابتة (CSS ، JavaScript ، صور)، أضف عنوان URL للوسائط.

# https://docs.djangoproject.com/en/4.0/howto/static-files/
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')
STATIC_URL = '/static/'
 
# Extra places for collectstatic to find static files.
STATICFILES_DIRS = (
 os.path.join(BASE_DIR, 'static'),
)
 
# STATICFILES_STORAGE = 
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

تؤدي إضافة عناوين URL للوسائط إلى الإعدادات إلى تحديد مسار معين لعرض الصور التي تم تحميلها. يخزن ملف الوسائط صور التطبيق. سيبدو المسار كما يلي: 127.0.0.1:8000/media/profile/image.jpg

قم بتحديث ملف القوالب مجموعة في إعدادات المشروع. يضيف django.template.context_processors.media إلى قوالب المصفوفة.

TEMPLATES = [
 {
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
'django.template.context_processors.media'
 ],
 },
 },
]

يساعد إعداد وسائط المعالجات على تحميل الصور التي تم تحميلها في قوالب التطبيق.

بعد ذلك ، تحتاج إلى إضافة ملف MEDIA_ROOT التوجيه إلى عناوين URL للتطبيق. سيساعد هذا في تحميل الصور التي تم تحميلها إلى خادم التطوير.

أولاً ، قم باستيراد إعدادات المشروع من ملف django.conf وحدة و وظيفة ثابتة. ثم أضف إلى ملف أنماط عنوان url مسار ثابت يوضح موقع الملفات التي تم تحميلها.

from django.urls import path
from. import views
from django.conf import settings
from django.conf.urls.static import static
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
 
urlpatterns = [
 path('', views.index, name = 'index'),
 path('profile', views.profile, name='profile'),
]
 
if settings.DEBUG:
 urlpatterns += static(settings.MEDIA_URL, document_root = settings.MEDIA_ROOT)
 urlpatterns += staticfiles_urlpatterns()

5. اختبار تحميلات الصور

بعد ذلك ، قم بتشغيل الخادم:

python manage.py runserver

إذا لم تكن هناك أخطاء ، فانتقل إلى لوحة إدارة Django عن طريق إضافة مسار مسؤول إلى عنوان URL الأساسي ، http://127.0.0.1:8000/admin.

داخل لوحة الإدارة ، عند النقر فوق نموذج الملف الشخصي ، سترى حقل صورة مضافًا في الأسفل.

عند تحميل صورة ، سترى مجلدًا جديدًا تم إنشاؤه في مجلد التطبيق يسمى وسائط. عندما تفتح المجلد ، سترى الصورة التي قمت بتحميلها عبر لوحة الإدارة.

6. اعرض الصورة التي تم تحميلها

يجب عليك تحديث قالب الملف الشخصي لعرض صورة الملف الشخصي.

سوف تضيف ملف IMG وضع علامة عليها وتعبئتها بامتداد الصوره الشخصيه يصف. ال ImageField له سمة URL التي توفر عنوان URL المطلق للملف. يمكنك تحديد شكل ومظهر الصورة باستخدام فئات CSS.

{% extends "base.html" %}
{% load static %}

{% block content %}
<divclass="card mb-3 bg-whitesmoke"style="max-width: fit content;">
<divclass="row g-0">
<divclass="col-md-4">
<imgsrc="{{user.profile.profile_picture.url}}"width="100px"alt="profile pic"class="mx-auto d-block rounded-circle" />
div>
div>
div>
{% endblock %}

يمكنك تشغيل الخادم لتحميل الصورة. ثم تحقق من القالب في المتصفح لرؤية الصورة المعروضة.

كيفية تحميل الصور في تطبيق Django

يجعل Django تحميل الصور في تطبيقاتك أمرًا سهلاً. لدى Django حقل متخصص في نماذجها يضيف ويتحقق من نوع الملف قبل التحميل.

يوفر ImageField مسارًا مطلقًا لنظام ملفات لتخزين الصور. يؤدي تخزين الصور في نظام الملفات إلى زيادة سرعة التطبيق ويضمن عدم اختراق قاعدة البيانات بملفات ضارة.