Django 2.0图片上传并在模板展示问题求助
Django 2.0 Image Upload & Display: Fixes + Working Example
Hey there! Let's work through your problem step by step, fix the blank page issue, and give you a solid reference implementation. Then we'll answer your question about whether models/forms are mandatory.
First, Let's Diagnose Your Blank Page Issue
The blank page after submission is likely caused by a few small but critical gaps in your code and configuration:
- Missing explicit form action: You commented out the
{% url 'imageupload' %}in your form'sactionattribute. While leaving it blank works in some cases, explicitly defining the target URL avoids ambiguity. - Incorrect media configuration: Your URL config includes
static(settings.MEDIA_URL...), but you probably haven't set upMEDIA_ROOTandMEDIA_URLin yoursettings.py—this is required for Django to serve uploaded files. - Suboptimal field choice: Using
FileFieldworks, butImageFieldis better for image uploads because it automatically validates that the uploaded file is an image. - Upload path convention: Storing user-uploaded files in
static/isn't best practice—use Django's dedicatedmedia/directory instead, asstatic/is for fixed app assets.
Complete Working Example
Here's a polished, fixed version of your code that will handle uploads correctly and display images:
1. Updated Model (models.py)
from django.db import models from django.forms import ModelForm class Upload(models.Model): # Use ImageField for image-specific validation, store in media/uploads/ pic = models.ImageField(upload_to="uploads/") upload_date = models.DateTimeField(auto_now_add=True) class UploadForm(ModelForm): class Meta: model = Upload fields = ('pic',)
2. Updated View (views.py)
from django.shortcuts import render, redirect from .models import UploadForm, Upload def home(request): if request.method == "POST": form = UploadForm(request.POST, request.FILES) if form.is_valid(): form.save() # Redirect back to the upload page to avoid duplicate submissions return redirect('imageupload') else: form = UploadForm() # Fetch all uploaded images, sorted by most recent first images = Upload.objects.all().order_by('-upload_date') return render(request, 'image_upload.html', {'form': form, 'images': images})
3. Updated Template (image_upload.html)
{% extends "base.html" %} {% block content %} <div style="padding:40px;margin:40px;border:1px solid #ccc"> <h1>Upload & View Pictures</h1> <!-- Explicitly set form action to your upload URL --> <form action="{% url 'imageupload' %}" method="post" enctype="multipart/form-data"> {% csrf_token %} <!-- Render form fields in a cleaner format --> {{ form.as_p }} <input type="submit" value="Upload Image" /> </form> <hr> <h2>Uploaded Images</h2> {% for img in images %} <div style="margin-bottom:20px"> {{ forloop.counter }}. <!-- Display a thumbnail of the image --> <img src="{{ img.pic.url }}" alt="{{ img.pic.name }}" style="max-width:200px;max-height:200px;"> <br> <a href="{{ img.pic.url }}" target="_blank">{{ img.pic.name }}</a> <span style="color:#666">(Uploaded on: {{ img.upload_date|date:"Y-m-d H:i" }})</span> </div> {% empty %} <p>No images uploaded yet.</p> {% endfor %} </div> {% endblock content %}
4. Critical Settings & URL Config
Add These to settings.py
import os BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__))) # Configure media storage for uploaded files MEDIA_ROOT = os.path.join(BASE_DIR, 'media') MEDIA_URL = '/media/'
Final urls.py
from django.conf import settings from django.conf.urls import url from django.conf.urls.static import static from django.contrib import admin from uploader import views as uploader_views urlpatterns = [ url(r'^admin/', admin.site.urls), url(r'^image_upload/', uploader_views.home, name='imageupload'), ] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
Do You Need to Use Models & Forms?
Short answer: No, but it's strongly recommended.
- Model + ModelForm (Best Practice): This approach leverages Django's built-in tools to handle file validation, secure storage, form rendering, and data persistence. It reduces boilerplate code and ensures your implementation follows Django's security and design standards.
- Alternative: No Models/Forms: If you only need temporary uploads without storing records in the database, you can handle files directly in the view. However, you'll have to manually manage file validation, naming, and storage. Example:
from django.shortcuts import render import os from django.conf import settings def temp_upload(request): if request.method == "POST": if 'pic' in request.FILES: pic = request.FILES['pic'] # Create target directory if it doesn't exist upload_dir = os.path.join(settings.MEDIA_ROOT, 'temp') os.makedirs(upload_dir, exist_ok=True) # Save the file with open(os.path.join(upload_dir, pic.name), 'wb+') as f: for chunk in pic.chunks(): f.write(chunk) return render(request, 'temp_upload.html')
This method lacks database tracking, so you can't easily display or manage uploaded files long-term. Stick with models/forms unless you have a specific reason not to.
内容的提问来源于stack exchange,提问作者NeoVe
相关产品推荐
相关产品推荐

