2021-07-21 扩写user表 主页后台模块设计 simpleui后台管理 跨域问题详解

昨日回顾

1 后台数据库配置
	-创建一个用户：lqz
    grant all privileges on luffy.* to 'lqz'@'%' identified by 'Lqz123?';
    -后台配置mysql数据库
    	-pymsql：写两句话，如果是2.0.7版本以后，需要改源码
        -mysqlclient模块
2 django使用日志
	-配置文件字典
    -得到logger对象
    -使用：logger.info()
    
3 drf处理全局异常
	-写一个函数，处理异常，记录日志
    -在配置文件中配置

4 对象加括号
	-会执行类的__call__

    
5 django的配置文件
	-WSGI_APPLICATION
    -wsgi,uwsgi,UWSGI,cgi,fastcgi...:
    http://www.liuqingzheng.top/article/1/05-CGI,FastCGI,WSGI,uWSGI,uwsgi%E4%B8%80%E6%96%87%E6%90%9E%E6%87%82/
   

6 封装response

7 前端创建项目
	-引入了全局css
    -引入全局settings
    -引入axios
    -引入elementui
    -vue-cookies
    -引入bootstrap和jq
    
    
    
 8 django 3.x之前，都是同步框架，3.x异步

	sanic
    fastapi
    tornado

今日内容

1 扩写user表

1 切换到apps路径下，新建user app
python ../../manage.py startapp user
2 在models.py中写入
from django.contrib.auth.models import AbstractUser
class User(AbstractUser):
    mobile = models.CharField(max_length=11, unique=True)
    icon = models.ImageField(upload_to='icon', default='icon/default.png')  # 必须安装pillow
    class Meta:
        db_table = 'luffy_user'  # 表明
        verbose_name = '用户表'  # 后台admin中显示的名字
        verbose_name_plural = verbose_name
    def __str__(self):
        return self.username
3 在配置文件中写入
AUTH_USER_MODEL='user.user'
4 media配置，在配置文件中写入
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

5 配置media路由
  re_path('^media/(?P<path>.*)', serve, {'document_root': settings.MEDIA_ROOT}) # 配置media的访问路径
    # path('media/<path:path>', serve, {'document_root': settings.MEDIA_ROOT}) # 配置media的访问路径

 6 执行迁移命令（安装pillow模块）



#### 国际化相关，配置文件中设置
LANGUAGE_CODE = 'zh-hans'
TIME_ZONE = 'Asia/Shanghai'
USE_I18N = True
USE_L10N = True
USE_TZ = False

2 主页后台模块设计

1 轮播图接口
2 轮播图表
	-建立一个基表，让轮播图表继承它

2.1 在utils下新建models.py

from django.db import models
class BaseModel(models.Model):
    created_time = models.DateTimeField(auto_now_add=True, verbose_name='创建时间')
    updated_time = models.DateTimeField(auto_now=True, verbose_name='最后更新时间')
    is_delete = models.BooleanField(default=False, verbose_name='是否删除')
    is_show = models.BooleanField(default=True, verbose_name='是否上架')
    orders = models.IntegerField(verbose_name='优先级')

    class Meta:
        abstract = True  # 不在数据库生成该表，只用来做继承

2.2 在home app下models新建表

# 轮播图表，继承BaseModel
from luffy_api.utils.model import BaseModel
class Banner(BaseModel):
    title = models.CharField(max_length=16, unique=True, verbose_name='名称')
    image = models.ImageField(upload_to='banner', verbose_name='图片',help_text='必须传入图片大小为 100*200')
    link = models.CharField(max_length=64, verbose_name='跳转链接')
    info = models.TextField(verbose_name='详情')  # 也可以用详情表，宽高出处


    class Meta:
        db_table='luffy_banner'
        verbose_name = '轮播图'  # 后台admin中显示的名字
        verbose_name_plural = verbose_name

    def __str__(self):
        return self.title

2.3 编写视图

class BannerView(ViewSetMixin, ListAPIView):
    serializer_class = BannerSerializer
    queryset = Banner.objects.filter(is_delete=False, is_show=True).order_by('orders')

2.4 配置路由

router=SimpleRouter()
router.register('banner',views.BannerView,'banner')

urlpatterns = [
    path('', include(router.urls)),
]

3 xadmin/simple-ui后台管理

1 admin写
2 xadmin写：在django 1.x版本比较好，对2.x支持不友好，3.x完全不支持
	-jq+bootstrap写的
    -现在作者弃坑了
3 simpleui写，支持2.x，3.x
	-咱们现在使用simpleui
    
4 现在主流后台管理，前后端分离
	-后端：drf，前端：vue
    -django-vue-admin
    
    
    
5 使用simple-ui的步骤
	-下载：pip3 install django-simpleui
    -在配置文件中app注册
    INSTALLED_APPS = [
    'simpleui',
    ]
    -使用，跟之前使用admin一样
    
    -在admin.py中注册表
    from .models import Banner
    @admin.register(Banner)
    class BannerAdmin(admin.ModelAdmin):
        # 展示那些字段
        list_display = ('id', 'title','link', 'created_time')

4 跨越问题详解

1 同源策略
同源策略（Same origin policy）是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现

请求的url地址,必须与浏览器上的url地址处于同域上,也就是域名,端口,协议相同.

比如:我在本地上的域名是127.0.0.1:8000,请求另外一个域名：127.0.0.1:8001一段数据

浏览器上就会报错，这个就是同源策略的保护,如果浏览器对javascript没有同源策略的保护,那么一些重要的机密网站将会很危险

2 cors：跨域资源共享
CORS需要浏览器和服务器同时支持。目前，所有浏览器都支持该功能
实现CORS通信的关键是服务器。只要服务器实现了CORS，就可以跨源通信


3 cors:分两种
    （1） 请求方法是以下三种方法之一：
        HEAD
        GET
        POST
    （2）HTTP的头信息不超出以下几种字段：
        Accept
        Accept-Language
        Content-Language
        Last-Event-ID
        Content-Type：只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain
	# 就是简单请求，否则就是非简单请求
    # 简单请求，发送一次请求；非简单请求，发送两次，第一次是options请求，如果允许跨越，再发送真实请求
    
    
    
4 自己处理跨域，需要再中间件中写

5 我们的项目，使用第三方插件（django-cors-headers）
	-安装：pip install django-cors-headers
    -在app中注册
    	INSTALLED_APPS = [
            ...
            'corsheaders',
            ...
        ]
    -在中间件里注册
    	MIDDLEWARE = [
            ...,
            'corsheaders.middleware.CorsMiddleware',
            ...,
        ]
    -配置文件中配置
        # 允许所有的域
        CORS_ALLOW_ALL_ORIGINS=True
        # 允许的请求头
        CORS_ALLOW_HEADERS = (
            "accept",
            "accept-encoding",
            "authorization",
            "content-type",
            "dnt",
            "origin",
            "user-agent",
            "x-csrftoken",
            "x-requested-with",
            # 额外允许的请求头
        )

        # 允许的请求方式（默认就是这样)
        CORS_ALLOW_METHODS = [
            'DELETE',
            'GET',
            'OPTIONS',
            'PATCH',
            'POST',
            'PUT',
        ]