Rakenna yksinkertainen, mutta tehokas kuvien latausohjelma tällä Python-opetusohjelmalla.

Yksi modernin sovelluksen houkuttelevimmista ominaisuuksista on sen kyky mukauttaa kuvia. Kuvat, kuten kuvat, piirrokset ja animaatiot tuovat visuaalista vetovoimaa sovellukseen.

Vaikka kuvat ovat tärkeitä, ne voivat hidastaa sovellusta ja lisätä tietokannan turvallisuusuhkia.

Djangoon rakennetuissa sovelluksissa kuvien lataaminen on helppoa ja turvallista. Djangossa on erikoisominaisuus, joka mahdollistaa kuvien lataamisen.

Opitaan lataamaan kuvia Django-sovellukseen turvallisuudesta tinkimättä.

Mitä tarvitset

Ennen kuin aloitat kuvien lataamisen, varmista, että sinulla on seuraavat vaatimukset:

  • Asenna Python
  • Asenna Pip
  • Asentaa Pipenv (voit halutessasi käyttää myös venv: tä)
  • Asenna Django
  • Sinulla on olemassa oleva Django-sovellus, joka tarvitsee kuvia

Nyt kun sinulla on tarvittavat riippuvuudet, aloitetaan.

1. Asenna tyyny

Djangolla on Kuvakenttä malleissaan. Kenttä tallentaa kuvien lataukset määritettyyn paikkaan tiedostojärjestelmässä, ei tietokantaan.

instagram viewer
Tyyny on Python-kirjasto, joka tarkistaa ImageFieldissä olevat kuvat.

Asentaa tyyny käytä alla olevaa komentoa:

pipenv install pillow

Jos käytät venv-komentoa, käytä sen sijaan tätä komentoa

pip install pillow

2. Luo malli

Luo an Kuvakenttä viite tietokannassa. Lisää sitten upload_to argumentti mallissa. Argumentti määrittää tallennuspaikan tiedostojärjestelmässä.

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'

Lopussa oleva menetelmä auttaa muuttamaan tiedot merkkijonoiksi.

Siirrä seuraavaksi ja tee uudet muutokset tietokantaan. Sitten sinun on muokattava projektin asetuksia.

Siirry projektiasetuksiin. Otsikon alla # Staattiset tiedostot (CSS, JavaScript, kuvat), lisää median URL-osoite.

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

Median URL-osoitteiden lisääminen asetuksiin määrittää tietyn reitin ladattujen kuvien näyttämiselle. Mediatiedosto tallentaa sovelluksen kuvat. Polku näyttää tältä: 127.0.0.1:8000/media/profile/image.jpg

Päivitä MALLIT matriisi projektin asetuksissa. Lisätä django.template.context_processors.media mallien joukkoon.

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

Prosessorien media-asetus auttaa lataamaan ladatut kuvat sovellusmalleihin.

Seuraavaksi sinun on lisättävä MEDIA_ROOT reitti sovellusten URL-osoitteisiin. Tämä auttaa lataamaan ladatut kuvat kehityspalvelimelle.

Tuo ensin projektin asetukset tiedostosta django.conf moduuli ja a staattinen toiminto. Lisää sitten joukkoon url-malleja staattinen reitti, joka näyttää ladattujen tiedostojen sijainnin.

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. Testaa kuvien latauksia

Suorita seuraavaksi palvelin:

python manage.py runserver

Jos virheitä ei ole, siirry Django-hallintapaneeliin lisäämällä järjestelmänvalvojan reitti perus-URL-osoitteeseen, http://127.0.0.1:8000/admin.

Kun napsautat hallintapaneelin sisällä Profiilimallia, alareunaan on lisätty kuvakenttä.

Kun lataat kuvan, näet uuden kansion, joka on luotu sovelluskansioon nimeltä media. Kun avaat kansion, näet kuvan, jonka lataat hallintapaneelin kautta.

6. Näytä ladattu kuva

Sinun tulee päivittää profiilimalli näyttääksesi profiilikuvan.

Lisäät an img -tunniste ja täytä se profiilikuva attribuutti. The Kuvakenttä sisältää URL-attribuutin, joka tarjoaa tiedoston absoluuttisen URL-osoitteen. Voit määrittää kuvan muodon ja ulkonäön käyttämällä CSS-luokkia.

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

Voit käyttää palvelinta kuvan lataamiseksi. Tarkista sitten selaimen malli nähdäksesi näytettävän kuvan.

Kuinka ladata kuvia Django-sovelluksessa

Django tekee kuvien lataamisesta helppoa sovelluksiisi. Djangon malleissa on erikoiskenttä, joka lisää ja tarkistaa tiedostotyypin ennen lataamista.

ImageField tarjoaa ehdottoman polun tiedostojärjestelmään kuvien tallentamista varten. Kuvien tallentaminen tiedostojärjestelmään lisää sovelluksen nopeutta ja varmistaa, ettei tietokantaan pääse haitallisia tiedostoja.