Průvodce nahráváním obrázků pomocí aplikace Django

Jednou z nejatraktivnějších vlastností moderní aplikace je její schopnost přizpůsobit obrázky. Obrázky, jako jsou obrázky, ilustrace a animace, přinášejí aplikaci vizuální přitažlivost.

I když jsou obrázky důležité, mohou zpomalit aplikaci a zvýšit bezpečnostní hrozby pro databázi.

U aplikací postavených na Django je nahrávání obrázků snadné a bezpečné. Django má specializovanou funkci, která umožňuje nahrávání obrázků.

Pojďme se naučit, jak nahrávat obrázky do aplikace Django, aniž by došlo k ohrožení zabezpečení.

Co potřebuješ

Než začnete nahrávat obrázky, ujistěte se, že máte následující požadavky:

• Nainstalujte Python
• Nainstalujte Pip
• Nainstalujte Pipenv (můžete také použít venv, pokud chcete)
• Nainstalujte Django
• Máte existující aplikaci Django, která potřebuje obrázky

Nyní, když máte potřebné závislosti, začněme.

1. Nainstalujte polštář

Django má ImageField ve svých modelech. Pole ukládá nahrané obrázky do určeného umístění v systému souborů, nikoli do databáze.

Polštář je knihovna Pythonu, která kontroluje obrázky v ImageField.

Instalovat polštář použijte příkaz níže:

pipenv install pillow

Pokud používáte venv, použijte místo toho tento příkaz

pip install pillow

2. Vytvořit model

Vytvořit ImageField odkaz v databázi. Poté přidejte upload_to argument v modelu. Argument definuje umístění úložiště v systému souborů.

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'

Metoda na konci pomáhá převádět data na řetězce.

Dále migrujte a potvrďte nové změny v databázi. Poté je třeba upravit nastavení projektu.

Přejděte do nastavení projektu. Pod nadpisem # Statické soubory (CSS, JavaScript, obrázky), přidejte adresu URL média.

# 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')

Přidání adres URL médií do nastavení definuje konkrétní cestu k zobrazení nahraných obrázků. V mediálním souboru jsou uloženy obrázky aplikace. Cesta bude vypadat takto: 127.0.0.1:8000/media/profile/image.jpg

Aktualizujte ŠABLONY pole v nastavení projektu. Přidat django.template.context_processors.media do pole šablon.

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'
 ],
 },
 },
]

Nastavení médií procesorů pomáhá načíst nahrané obrázky do šablon aplikace.

Dále je třeba přidat MEDIA_ROOT směrovat na adresy URL aplikace. To pomůže načíst nahrané obrázky na vývojový server.

Nejprve importujte nastavení projektu z django.conf modul a a statická funkce. Poté přidejte do vzory adres URL statická trasa zobrazující umístění nahraných souborů.

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. Testování nahrávání obrázků

Dále spusťte server:

python manage.py runserver

Pokud nejsou žádné chyby, přejděte na panel administrátora Django přidáním trasy pro správu k základní adrese URL, http://127.0.0.1:8000/admin.

Když na panelu pro správu kliknete na model profilu, uvidíte v dolní části přidané pole obrázku.

Když nahrajete obrázek, uvidíte novou složku vytvořenou ve složce aplikace s názvem média. Když složku otevřete, uvidíte obrázek, který jste nahráli přes admin panel.

6. Zobrazte nahraný obrázek

Chcete-li zobrazit profilový obrázek, měli byste aktualizovat šablonu profilu.

Přidáte an img tag a naplňte jej profilový obrázek atribut. The ImageField má atribut URL, který poskytuje absolutní adresu URL souboru. Pomocí tříd CSS můžete určit tvar a vzhled obrázku.

{% 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 %}

Pro načtení obrázku můžete spustit server. Poté zkontrolujte šablonu v prohlížeči, abyste viděli zobrazený obrázek.

Jak nahrát obrázky do aplikace Django

Django usnadňuje nahrávání obrázků do vašich aplikací. Django má na svých modelech specializované pole, které přidává a kontroluje typ souboru před nahráním.

ImageField poskytuje absolutní cestu k systému souborů pro uložení obrázků. Ukládání obrázků do souborového systému zvyšuje rychlost aplikace a zajišťuje, že databáze není infiltrována škodlivými soubory.