Django+simpleui实现文件上传预览功能(详细过程)

更新时间：2025年02月10日 10:09:34 作者：Summer@123

该文章详细介绍了如何在Django框架中实现文件上传、预览和下载功能,并使用SimpleUI美化Django后台界面,通过创建模型、表单、视图和配置URL,实现了文件的存储和管理,同时,文章还提到了配置媒体文件、创建模板以及在生产环境中的部署注意事项,感兴趣的朋友一起看看吧

1. 创建 Django 项目和应用

如果还没有项目和应用，先创建一个：

django-admin startproject myproject
cd myproject
python manage.py startapp myapp

2. 配置 MySQL 数据库

在 settings.py 中配置 MySQL 数据库连接：

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql',
        'NAME': 'mydatabase',  # 数据库名称
        'USER': 'root',        # 数据库用户名
        'PASSWORD': 'password',# 数据库密码
        'HOST': 'localhost',   # 数据库主机
        'PORT': '3306',        # 数据库端口
    }
}

确保已安装 MySQL 客户端库：

pip install mysqlclient

3. 创建模型

在 myapp/models.py 中创建一个模型来存储文件信息：

from django.db import models
class UploadedFile(models.Model):
    name = models.CharField(max_length=255, verbose_name="文件名称")
    file = models.FileField(upload_to='uploads/', verbose_name="文件")
    uploaded_at = models.DateTimeField(auto_now_add=True, verbose_name="上传时间")
    def __str__(self):
        return self.name
    class Meta:
        verbose_name = "上传文件"
        verbose_name_plural = "上传文件"

4. 创建表单

在 myapp/forms.py 中创建一个表单来处理文件上传：

from django import forms
from .models import UploadedFile
class UploadFileForm(forms.ModelForm):
    class Meta:
        model = UploadedFile
        fields = ['name', 'file']

5. 创建视图

在 myapp/views.py 中创建视图来处理文件的上传、预览和下载：

from django.shortcuts import render, get_object_or_404
from django.http import HttpResponse
from .models import UploadedFile
from .forms import UploadFileForm
import os
def upload_file(request):
    if request.method == 'POST':
        form = UploadFileForm(request.POST, request.FILES)
        if form.is_valid():
            form.save()
            return render(request, 'upload_success.html')
    else:
        form = UploadFileForm()
    return render(request, 'upload.html', {'form': form})
def preview_file(request, file_id):
    file = get_object_or_404(UploadedFile, id=file_id)
    return render(request, 'preview.html', {'file': file})
def download_file(request, file_id):
    file = get_object_or_404(UploadedFile, id=file_id)
    response = HttpResponse(file.file, content_type='application/force-download')
    response['Content-Disposition'] = f'attachment; filename={os.path.basename(file.file.name)}'
    return response

6. 配置 URL

在 myapp/urls.py 中配置 URL 路由：

from django.urls import path
from . import views
urlpatterns = [
    path('upload/', views.upload_file, name='upload_file'),
    path('preview/<int:file_id>/', views.preview_file, name='preview_file'),
    path('download/<int:file_id>/', views.download_file, name='download_file'),
]

在 myproject/urls.py 中包含应用的 URL：

from django.contrib import admin
from django.urls import path, include
urlpatterns = [
    path('admin/', admin.site.urls),
    path('myapp/', include('myapp.urls')),
]

7. 配置媒体文件

在 settings.py 中配置媒体文件的存储路径：

MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

在 myproject/urls.py 中添加媒体文件的 URL 配置：

from django.conf import settings
from django.conf.urls.static import static
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

8. 创建模板

在 myapp/templates/ 目录下创建以下模板文件：

upload.html（文件上传页面）

<!DOCTYPE html>
<html>
<head>
    <title>Upload File</title>
</head>
<body>
    <h1>Upload File</h1>
    <form method="post" enctype="multipart/form-data">
        {% csrf_token %}
        {{ form.as_p }}
        <button type="submit">Upload</button>
    </form>
</body>
</html>

upload_success.html（上传成功页面）

<!DOCTYPE html>
<html>
<head>
    <title>Upload Success</title>
</head>
<body>
    <h1>File Uploaded Successfully</h1>
    <a href="{% url 'upload_file' %}" rel="external nofollow" >Upload another file</a>
</body>
</html>

preview.html（文件预览页面）

<!DOCTYPE html>
<html>
<head>
    <title>Preview File</title>
</head>
<body>
    <h1>{{ file.name }}</h1>
    <p>Uploaded at: {{ file.uploaded_at }}</p>
    <a href="{% url 'download_file' file.id %}" rel="external nofollow" >Download</a>
</body>
</html>

9. 配置 SimpleUI

在 settings.py 中安装并配置 SimpleUI：

INSTALLED_APPS = [
    ...
    'simpleui',
    'myapp',
    ...
]

SimpleUI 会自动美化 Django 后台界面，你可以在 settings.py 中进一步配置 SimpleUI 的主题和其他选项。

10. 运行服务器并测试

运行 Django 开发服务器：

python manage.py runserver

访问 http://127.0.0.1:8000/myapp/upload/ 进行文件上传、预览和下载的测试。

11. 部署

在生产环境中，确保配置好静态文件和媒体文件的处理方式，并考虑使用云存储服务（如 AWS S3）来存储上传的文件。

总结

通过以上步骤，可以实现管理员上传文件并将文件信息存储到 MySQL 数据库，同时支持前端预览和下载的功能。SimpleUI 用于美化 Django 后台界面，提升用户体验。

到此这篇关于Django+simpleui实现文件上传预览功能的文章就介绍到这了,更多相关Django simpleui文件上传预览内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

django admin 使用SimpleUI自定义按钮弹窗框示例

用表格帮你了解Python数据类型
这篇文章主要为大家介绍了Python数据类型，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助<BR>
2022-01-01
Python 实现数组相减示例
今天小编就为大家分享一篇Python 实现数组相减示例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2019-12-12
Python强大的自省机制详解
这篇文章主要为大家介绍了Python强大的自省机制，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助
2021-11-11
tensorflow之如何使用GPU而不是CPU问题
这篇文章主要介绍了tensorflow之如何使用GPU而不是CPU问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2023-05-05
关于python中inspect模块用法详解
这篇文章主要介绍了关于python中inspect模块用法详解,获取函数签名对象。函数签名包含了一个函数的信息，包括函数名、它的参数类型、它所在的类和名称空间及其他信息,需要的朋友可以参考下
2023-07-07
Python如何利用IMAP实现邮箱客户端功能
IMAP是另一种读取电子邮件的协议,IMAP是读取邮件服务器的电子邮件与公布栏信息的方法,也就是说IMAP 允许客户端的邮件程序存取远程的信息,这篇文章主要给大家介绍了关于Python如何利用IMAP实现邮箱客户端功能的相关资料,需要的朋友可以参考下
2021-09-09
Python设计模式之装饰模式实例详解
这篇文章主要介绍了Python设计模式之装饰模式,结合实例形式详细分析了装饰模式的概念、原理并结合Python实例形式分析了装饰模式的相关使用技巧,需要的朋友可以参考下
2019-01-01
Python反编译的两种实现方式
这篇文章主要介绍了Python反编译的两种实现方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
2024-06-06
python基础学习之如何对元组各个元素进行命名详解
python的元祖和列表类似，不同之处在于元祖的元素不能修改，下面这篇文章主要给大家介绍了关于python基础学习之如何对元组各个元素进行命名的相关资料，文中通过示例代码介绍的非常详细，需要的朋友可以参考下
2018-07-07
Python利用pyHook实现监听用户鼠标与键盘事件
这篇文章主要介绍了Python利用pyHook实现监听用户鼠标与键盘事件,很有实用价值的一个技巧,需要的朋友可以参考下
2014-08-08