zoukankan      html  css  js  c++  java
  • 关于Django图片上传

    • 首先要设置settings
    # 上传文件
    MEDIA_ROOT = 'media'  # 项目下的目录
    MEDIA_URL = "/media/"  # 跟STATIC_URL类似,指定用户可以通过这个url找到文件
    • setting 设置模板中使用MEDIA_URL
    TEMPLATES = [
        {
            'BACKEND': 'django.template.backends.django.DjangoTemplates',
            'DIRS': [
                os.path.join(BASE_DIR, 'templates')
            ],
            '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',
                ],
            },
        },
    ]
    模板中使用MEDIA_URL
    • url中要设置
    from django.conf import settings
    from django.conf.urls.static import static
    
    urlpatterns = [
    #省略中间url
    ] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
    • models设置图片字段和保存位置
    class UserProfile(models.Model):
        username = models.ForeignKey(User, related_name='User_Profiles', on_delete=models.CASCADE)
        avatar = models.FileField(upload_to='avatar', blank=True,null=True, verbose_name='头像')

    如上将会保存在/media/avatar目录下

    • HTML页面
                            <form role="form" enctype="multipart/form-data" action="{% url 'upload_avatar' %}"
                                  method="POST">
                                {% csrf_token %}
                                <div>
                                    {% for img in imgs %}
                                        <img src="{{ user.User_Profiles.first.avatar }}" alt="">
                                    {% endfor %}
                                </div>
                                <div>
                                    <input class="btn-success" type="file" name="img">
                                    <button class="btn btn-success" type="submit">变成头像</button>
                                </div>
                            </form>
    HTML代码
    • views后端保存图片
    def upload(request):
        if request.method == 'POST':
            # 如果有头像,先删除照片再删除数据库
            if not UserProfile.objects.filter(username=request.user, avatar=''):
                project_path = os.path.abspath(os.path.dirname(os.path.dirname(__file__)))
                media_path = os.path.join(project_path, 'media')
                print(media_path)
                try:
                    avatar_name = request.user.User_Profiles.first().avatar.name
                    avatar_path = os.path.join(media_path, avatar_name)
                    os.remove(avatar_path)
                except Exception as e:
                    print(e)
                UserProfile.objects.filter(username=request.user).delete()
    
            new_img = UserProfile(username=request.user, avatar=request.FILES.get('img'))
            new_img.save()
            return redirect('my_account')
    后端保存图片
  • 相关阅读:
    vue打包传递参数配置域名
    相同域名nginx下部署两个vue项目
    vue项目改造服务端渲染
    vue项目使用less全局变量
    postMessage跨域实现localstorage跨域共享
    node_webkit打包成桌面应用程序
    vue项目本地服务器设置既能localhost访问又能手机ip访问
    GATT scan的流程
    Windows下面的常用的快捷键
    把驱动编译进内核和编译成模块
  • 原文地址:https://www.cnblogs.com/Neroi/p/12377617.html
Copyright © 2011-2022 走看看