05 luffy后台配置

05 luffy后台配置

一、封装response和异常处理

1、utils/response.py:封装response

1、安装rest_framework
pip install djangorestframework

from rest_framework.response import Response


# 自己封装Response
class APIResponse(Response):
    def __init__(self, code=1, msg='成功', result=None, status=None, headers=None, content_type=None, **kwargs):
        dic = {
            'code': code,
            'msg': msg
        }
        if result:
            dic['result'] = result
        dic.update(kwargs)
        # 对象来调用对象的绑定方法，会自动传值
        super().__init__(data=dic, status=status, headers=headers, content_type=content_type)

2、utils/response.py:封装异常处理

from rest_framework.views import exception_handler
from luffyapi.utils.response import APIResponse
from luffyapi.utils.logger import log  # 加日志


# 自定义异常处理
def common_exception_handler(exc, context):
    # 记录错误日志
    log.error('view是%s, 错误是%s' % (context['view'].__class__.__name__, str(exc)))

    # ret如果是Response，表示是drf异常，并且会处理，如果返回的是Node，会丢给django
    ret = exception_handler(exc, context)
    if not ret:
        if isinstance(exc, KeyError):
            return APIResponse(code=0, msg='key error')

        return APIResponse(code=0, msg='error', result=str(exc))
    else:
        return APIResponse(code=0, msg='error', result=ret.data)  # ret是Response对象，它内部有个data，data是返回的数据

二、封装logger

1、dev.py

# 真实项目上线后，日志文件打印级别不能过低，因为一次日志记录就是一次文件io操作
LOGGING = {
    'version': 1,
    'disable_existing_loggers': False,
    'formatters': {
        'verbose': {
            'format': '%(levelname)s %(asctime)s %(module)s %(lineno)d %(message)s'
        },
        'simple': {
            'format': '%(levelname)s %(module)s %(lineno)d %(message)s'
        },
    },
    'filters': {
        'require_debug_true': {
            '()': 'django.utils.log.RequireDebugTrue',
        },
    },
    'handlers': {
        'console': {
            # 实际开发建议使用WARNING
            'level': 'DEBUG',
            'filters': ['require_debug_true'],
            'class': 'logging.StreamHandler',
            'formatter': 'simple'
        },
        'file': {
            # 实际开发建议使用ERROR
            'level': 'INFO',
            'class': 'logging.handlers.RotatingFileHandler',
            # 日志位置,日志文件名,日志保存目录必须手动创建，注：这里的文件路径要注意BASE_DIR代表的是小luffyapi
            'filename': os.path.join(os.path.dirname(BASE_DIR), "logs", "luffy.log"),
            # 日志文件的最大值,这里我们设置300M
            'maxBytes': 300 * 1024 * 1024,
            # 日志文件的数量,设置最大日志数量为10
            'backupCount': 10,
            # 日志格式:详细格式
            'formatter': 'verbose',
            # 文件内容编码
            'encoding': 'utf-8'
        },
    },
    # 日志对象
    'loggers': {
        'django': {
            'handlers': ['console', 'file'],
            'propagate': True, # 是否让日志信息继续冒泡给其他的日志处理系统
        },
    }
}

2、utils/logger.py

import logging
logger = logging.getLogger('django')  # 跟配置文件中loggers日志对象下的名字对应上

三、跨域问题及解决

1、跨域问题

# 浏览器的安全策略：同源策略
	-请求的url地址,必须与浏览器上的url地址处于同域上,也就是域名,端口,协议相同.
    -如果不一样浏览器上就会报错，这个就是同源策略的保护,如果浏览器对javascript没有同源策略的保护,那么一些重要的机密网站将会很危险
    -请求，服务的执行了，数据返回了，但是浏览器拦截掉了
    
    
# 解决同源策略导致的数据不能正常加载

# CORS：跨域资源共享---》后端技术（后端代码中加东西）---》通过它，就可以解决跨域问题
	-CORS需要浏览器和服务器同时支持。目前，所有浏览器都支持该功能
    
    -浏览器将CORS请求分成两类：简单请求（simple request）和非简单请求（not-so-simple request）
    	-如果请求满足以下两种情况，就是简单请求，否则就是非简单请求
        （1） 请求方法是以下三种方法之一：
            HEAD
            GET
            POST
        （2）HTTP的头信息不超出以下几种字段：
            Accept
            Accept-Language
            Content-Language
            Last-Event-ID
            Content-Type：只限于三个值urlencoded、form-data、text/plain
            
      	-简单请求发送一次请求，数据拿回来，但是被浏览器同源策略拦截了
        -非简单请求发送两次，一次options请求，如果允许再发真正的请求，如果不允许就不发了

2、简单请求解决办法

# 在请求头中添加res['Access-Control-Allow-Origin'] = '*'
def test(request):
    res = HttpResponse('ok')
    res['Access-Control-Allow-Origin'] = '*'
    return res

3、写一个中间件配置在配置文件中

'''
xss:跨站脚本攻击,cors：跨域资源共享，csrf：跨站请求伪造
'''
# 放到中间件处理复杂和简单请求：
from django.utils.deprecation import MiddlewareMixin

class CorsMiddleWare(MiddlewareMixin):
    def process_response(self, request, response):
        response["Access-Control-Allow-Origin"] = "*"
        if request.method == "OPTIONS":
            # 可以加*
            response["Access-Control-Allow-Headers"] = "Content-Type"
        return response

    
# dev.py
MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    # 'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
    # 配置解决跨域问题中间件
    'luffyapi.utils.middle.CorsMiddleWare'
    
]

四、 django 使用django-cors-headers 解决跨域问题

1、使用pip安装

pip install django-cors-headers

2、添加到setting的app中

INSTALLED_APPS = (
	...
	'corsheaders',
	...
)

3、添加中间件

MIDDLEWARE = [  # Or MIDDLEWARE_CLASSES on Django < 1.10
	...
	'corsheaders.middleware.CorsMiddleware',  # 添加这条
	'django.middleware.common.CommonMiddleware',
	...
]

4、setting下面添加下面的配置

CORS_ALLOW_CREDENTIALS = True
CORS_ORIGIN_ALLOW_ALL = True
CORS_ORIGIN_WHITELIST = (
	'*'
)
CORS_ALLOW_METHODS = (
	'DELETE',
	'GET',
	'OPTIONS',
	'PATCH',
	'POST',
	'PUT',
	'VIEW',
)

CORS_ALLOW_HEADERS = (
	'XMLHttpRequest',
	'X_FILENAME',
	'accept-encoding',
	'authorization',
	'content-type',
	'dnt',
	'origin',
	'user-agent',
	'x-csrftoken',
	'x-requested-with',
	'Pragma',
    'token'
)

五、luffy前台配置

1、axios前后台交互

# 前台可以发送ajsx的请求，axios
# 安装：前端项目目录下的终端
cnpm install axios

1.1、配置：main.js

import axios from 'axios'     # 导入安装的axios
Vue.prototype.$axios = axios; # 把axion对象放到了Vue对象中，以后用Vue对象.

2、cookies操作

2.1、安装：前端项目目录下的终端

>: cnpm install vue-cookies

2.2、配置：main.js

import cookies from 'vue-cookies'
Vue.prototype.$cookies = cookies;

3、element-ui页面组件框架

3..1、安装：前端项目目录下的终端

>: cnpm install element-ui

3.2、配置：main.js

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);

4、bootstrap页面组件框架

4.1、安装：前端项目目录下的终端

>: cnpm install jquery
>: cnpm install bootstrap@3

2.2、配置jquery：vue.config.js（项目根路径创建）

const webpack = require("webpack");

module.exports = {
    configureWebpack: {
        plugins: [
            new webpack.ProvidePlugin({
                $: "jquery",
                jQuery: "jquery",
                "window.jQuery": "jquery",
                "window.$": "jquery",
                Popper: ["popper.js", "default"]
            })
        ]
    }
};

4.3、配置bootstrap：main.js

import 'bootstrap'
import 'bootstrap/dist/css/bootstrap.min.css'

六、simpleui的使用

1、下载

# 地址：https://simpleui.72wo.com/docs/simpleui/doc.html
pip3 install django-simpleui

2、app注册

INSTALLED_APPS = [
    'simpleui',
]

3、配置文件二次开发(settings.py)

    ## simpleui的配置
import time
SIMPLEUI_CONFIG = {
    'system_keep': False,
    'menu_display': ['我的项目', '权限认证','主页',],      # 开启排序和过滤功能, 不填此字段为默认排序和全部显示, 空列表[] 为全部不显示.
    'dynamic': True,    # 设置是否开启动态菜单, 默认为False. 如果开启, 则会在每次用户登陆时动态展示菜单内容
    'menus': [
        {
        'name': '我的项目',
        'icon': 'fab fa-apple',
        'url': '/backend/'  # 咱们用自己的
    },
        {
        'app': 'auth',
        'name': '权限认证',
        'icon': 'fas fa-user-shield',
        'models': [
            {
            'name': '用户',
            'icon': 'fa fa-user',
            'url': 'auth/user/'
        },
            {
            'name': '组',
            'icon': 'fa fa-user',
            'url': 'auth/group/'
        },
            {
                'name': '权限',
                'icon': 'fa fa-user',
                'url': 'auth/permission/'
            }
        ]
    },
        {
            'app': 'home',
            'name': '主页',
            'icon': 'fas fa-user-shield',
            'models': [
                {
                    'name': '轮播图',
                    'icon': 'fa fa-user',
                    'url': 'home/banner/'
                },

            ]
        },
 ]
}

# SIMPLEUI_LOGIN_PARTICLES = False
SIMPLEUI_HOME_INFO = False
    
    
    -#####4 在admin.py中写
    @admin.register(models.Banner)
class EmployeAdmin(admin.ModelAdmin):
    # 一行数据显示哪些字段
    list_display = ('id', 'title', 'link', 'is_show')

    # 增加自定义按钮
    actions = ['make_copy']
    def make_copy(self, request, queryset):
        # 点击触发它
        # queryset：选中的数据
        # request 请求对象
        print(queryset)

    make_copy.short_description = '我叫按钮'
    make_copy.confirm = '你是否执意要点击这个按钮？'

4、监控大屏设置

1、在gitee中搜索监控大屏，并下载http压缩包
2、把静态文件开放，放到static文件夹中
3、开放端口