• 5 项目---自定义用户模型以及轮播图图片url返回格式


    创建自定义的用户模型类

     1. 用命令创建users 应用

    2. 将users 注册到settings.py

    INSTALLED_APPS = [
        'django.contrib.admin',
        'django.contrib.auth',
        'django.contrib.contenttypes',
        'django.contrib.sessions',
        'django.contrib.messages',
        'django.contrib.staticfiles',
        'rest_framework',
        'corsheaders',
        # 'luf.apps.home',
        'home',
        'xadmin',
        'crispy_forms',
        'reversion',
        'users'
    ]

    3. 在项目主配置文件中  settings.py

    AUTH_USER_MODEL 参数的设置以点.来分隔,表示应用名.模型类名

    AUTH_USER_MODEL = 'users.User'

    我们自定义的用户模型类还不能直接被Django的认证系统所识别,需要在配置文件中告知Django认证系统使用我们自定义的模型类。

    4. 自定义用户模型表

    class User(AbstractUser):
        """用户模型类"""
        mobile = models.CharField(max_length=11, unique=True, verbose_name='手机号')
    
        class Meta:
            db_table = 'ly_users'
            verbose_name = '用户'
            verbose_name_plural = verbose_name
    View Code

    5. 进行数据迁移

    注意:Django建议我们对于AUTH_USER_MODEL参数的设置一定要在第一次数据库迁移之前就设置好,否则后续使用可能出现未知错误。

    python manage.py makemigrations
    python manage.py migrate

    解决home应用中模型类中的,image字段,url返回给前端格式问题

    1.在配置文件中设置

    # 访问静态文件的url地址前缀
    STATIC_URL = '/static/'
    
    # 设置django的静态文件目录
    STATICFILES_DIRS = [
        os.path.join(BASE_DIR,"luffy/static")
    ]
    
    # 项目中存储上传文件的根目录[暂时配置],注意,static目录需要手动创建否则上传文件时报错
    MEDIA_ROOT=os.path.join(BASE_DIR,"luffy/static")
    # 设置访问上传文件的url地址前缀
    MEDIA_URL = "/media/"   # 避免和STATIC_URL 的路径相同所有用“/media/”

    # 当前站点的域名
    HOST = "http://api.luf.cn:8000"

     

    2. 总路由中设置

    from django.contrib import admin
    from django.urls import path,include,re_path
    
    import xadmin
    xadmin.autodiscover()
    
    # version模块自动注册需要版本控制的 Model
    from xadmin.plugins import xversion
    xversion.register_models()
    from django.conf import settings
    from django.views.static import serve
    
    urlpatterns = [
        re_path(r'^media/(?P<path>.*)$', serve, {"document_root":settings.MEDIA_ROOT}),
        path(r'xadmin/', xadmin.site.urls),
        path('admin/', admin.site.urls),
        path('home/', include("home.urls")),
        path('users/', include("users.urls")),
        # include 的值必须是 模块名.urls 格式,字符串中间只能出现一个圆点
    ]

    3. home /views.py 中:

    from django.db.models import Q
    from rest_framework.views import APIView
    from rest_framework.response import Response
    from .models import bannerInfo
    from django.conf import settings
    class BannerInfoAPIView(APIView):
        """
        轮播图列表
        """
        def get(self,request):
            # 获取数据
            banners = bannerInfo.objects.filter(Q(is_show=True) & Q(is_delete=False)).order_by("-orders")
            # 调整banners的images字段
    
            # 序列化
            data = []
            for item in banners:
                data.append({
                  # 拼接图片的url地址
                  "image": settings.HOST+item.image.url,
                  "link":item.link,
                  "orders":item.orders,
                })
            return Response(data)

    后端轮播模型的调整,让用户可以不上传图片,前端表单提交数据的时候可为空

    home/models.py中: 通过设置 null =True  和  blank =True   

    from django.db import models
    
    # Create your models here.
    
    class BannerInfo(models.Model):
        # update_to 存储子目录,真实存放地址会使用配置中的MADIE_ROOT+upload_to
        image = models.ImageField(upload_to='banner',verbose_name='轮播图',null=True,blank=True)
        name = models.CharField(max_length=150,verbose_name='轮播图名称')
        link = models.CharField(max_length=150,verbose_name='轮播图广告地址')
        orders = models.IntegerField(verbose_name='显示顺序')
        is_show = models.BooleanField(verbose_name='是否上架',default=False)
        is_delete = models.BooleanField(verbose_name='逻辑删除',default=False)
        class Meta:
            db_table='ly_banner'
            verbose_name='轮播图'
            verbose_name_plural=verbose_name
        def __str__(self):
            # 从orm 模型操作中读取的image字段其实是一个对象
            # print(type(self.image))
            # 真实的图片地址是自动保存到了对象下面的url  self.image.url
    
            return self.name
    View Code

     后端提供的轮播图数据接口

    前端的axios请求函数:banner.vue组件中:

     mounted:function () {
          //获取轮播图
          this.$axios.get('http://api.luf.cn:8000/home/banner').then(res=>
    
          {
            console.log(res);
            this.banner_list=res.data;
    
          }).catch(error=>{
            console.log(error)
          })
        }

     前端浏览器中点击检查:

  • 相关阅读:
    使用jQuery的validation后,无法引发asp.net按钮的事件处理程序
    近期一些超值文章及工具收集
    修复MOSS2007备份还原后搜索服务出现的问题(续)
    给ASP.net程序配置代理服务器
    vue 2.0 路由切换以及组件缓存源代码重点难点分析
    [模板]大整数相加、相乘
    PKU 3468 A Simple Problem with Integers
    USACO sec1.4 Packing Rectangles
    HDOJ 2795 Billboard
    [贪心] COJ 1236 删数游戏
  • 原文地址:https://www.cnblogs.com/knighterrant/p/10597572.html
Copyright © 2020-2023  润新知