用Django实现图片上传,并显示在一个页面中,同一张照片可以多次上传并显示出来,上传的图片按时间顺序显示,上传的文件保存在项目的一个文件夹中不用数据库,给出完整代码
时间: 2024-02-19 09:59:26 浏览: 17
好的,下面是基于 Django 的图片上传并显示的完整代码:
首先,我们需要在项目根目录下创建一个名为 `media` 的文件夹,用于存放上传的图片。
接着,在 `settings.py` 文件中添加以下配置:
```python
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
```
这里的 `MEDIA_URL` 是指上传文件的 URL 地址,`MEDIA_ROOT` 是指上传文件的本地路径。
然后,在 `urls.py` 文件中添加以下路由:
```python
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
# 其他路由
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
```
这里的 `static` 函数用于将 `MEDIA_URL` 映射到 `MEDIA_ROOT`。
接下来,我们需要创建一个视图函数来处理图片上传和显示:
```python
import os
from django.shortcuts import render
from django.conf import settings
from django.utils import timezone
from django.http import JsonResponse
def upload(request):
if request.method == 'POST':
file = request.FILES.get('file')
if file:
file_name = timezone.now().strftime('%Y%m%d%H%M%S') + os.path.splitext(file.name)[-1]
file_path = os.path.join(settings.MEDIA_ROOT, file_name)
with open(file_path, 'wb') as f:
for chunk in file.chunks():
f.write(chunk)
return JsonResponse({'success': True, 'url': settings.MEDIA_URL + file_name})
else:
return JsonResponse({'success': False})
else:
files = os.listdir(settings.MEDIA_ROOT)
files.sort(reverse=True)
return render(request, 'upload.html', {'files': files})
```
这个视图函数分为两个部分:
1. 处理文件上传的 POST 请求,将上传的文件保存在 `MEDIA_ROOT` 文件夹中,并返回 JSON 格式的上传成功信息和上传的图片 URL。
2. 处理文件显示的 GET 请求,读取 `MEDIA_ROOT` 文件夹中的图片列表,并根据上传时间倒序排列,然后返回渲染后的 HTML 页面。
最后,我们需要创建一个 HTML 模板来显示上传的图片:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图片上传</title>
</head>
<body>
<form action="" method="post" enctype="multipart/form-data">
{% csrf_token %}
<input type="file" name="file">
<input type="submit" value="上传">
</form>
<hr>
{% for file in files %}
<img src="{{ MEDIA_URL }}{{ file }}">
{% endfor %}
</body>
</html>
```
这个 HTML 模板中包含一个文件上传表单和一个循环遍历 `MEDIA_ROOT` 中的图片列表,并通过 `MEDIA_URL` 显示图片。
好了,以上就是基于 Django 的图片上传并显示的完整代码。