路飞项目创建和配置
路飞项目创建和配置
luffy后台创建目录调整
项目的创建
1.创建项目的时候要在虚拟环境中创建
2.再使用虚拟环境创建路飞项目前，一定要先安装django，否则会以最先django创建
3.或者使用djagno-admin创建
如果之前有了项目，先切换解释器，再pycharm中切换
调整路飞后端项目的目录
-
目录
├── luffyapi ├── logs/ # 项目运行时/开发时日志目录 - 包 ├── manage.py # 脚本文件 ├── luffyapi/ # 项目主应用，开发时的代码保存 - 包 ├── apps/ # 开发者的代码保存目录，以模块[子应用]为目录保存 - 包 ├── libs/ # 第三方类库的保存目录[第三方组件、模块] - 包 ├── settings/ # 配置目录 - 包 ├── dev.py # 项目开发时的本地配置 └── prod.py # 项目上线时的运行配置 ├── urls.py # 总路由 └── utils/ # 多个模块[子应用]的公共函数类库[自己开发的组件] └── scripts/ # 保存项目运营时的脚本文件 - 文件夹 -
运行操作，需要修改manage.py
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'luffy_api.settings.dev') -
上线操作（后期上线修改）
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'luffy_api.settings.prod') -
创建app时，要进入apps的文件夹下执行
python ../../manage.py startapp home -
注册app
导入包，都要从环境变量开始导起
或者在
settings/dev.py中import sys import os BASE_DIR = Path(__file__).resolve().parent.parent #小luffy_api # 把小luffy_api和apps路径都加入到环境变量。以后直接从这俩路径下导起即可 sys.path.append(str(BASE_DIR)) sys.path.append(os.path.join(BASE_DIR,'apps'))以后注册app，直接写app名字即可
路飞后台配置
封装logger
记录日志
每个项目，都需要记录日志，后期可以通过日志来排查问题，分析错误
管理员也可通过日志来分析用户的行为
之前学过的logging模块，django就是基于原生的logging模块创建的日志
路飞项目的日志功能的创建流程
1.将logging中的代码复制在配置文件中
2.在utils中新建一个common_logger.py
import logging
# 通过配置问中的名字拿到logger对象，以后只需要导入，直接使用对象写日志即可
logger=logging.getLogger('django')
3.在想用的地方，导入（注意路径），直接使用logger.info....
封装全局异常
drf,处理了全局异常，只需要写个函数，配置在配置文件中，出了异常，这个函数就会执行
封装全局异常
编写的函数中要统一返回格式
记录日志：出现了异常，程序有问题，后期排查问题
创建全局异常
在uitl文件夹下，新建exceptions.py
from rest_framework.views import exception_handler as drf_exception_handler
from rest_framework.response import Response
from utils.common_logger import logger
def exception_handler(exc, context):
# 程序出了异常，会走到这,我们都要记录日志
# 请求地址，请求方式，请求时间，请求哪个视图函数，如果登录了，记录一下用户id
request = context.get('request')
try:
user_id = request.user.pk
if not user_id:
user_id = '匿名用户'
except:
user_id = '匿名用户'
view = context.get('view')
logger.error('用户：【%s】，使用：【%s】 请求，请求：【%s】 地址，视图函数是：【%s】，出错了，错误是：【%s】' % (
user_id, request.method, request.get_full_path(), str(view), str(exc)
))
# 第一步：执行一下原来的异常处理:它只处理drf的异常，django的异常没有处理
# res如果有值是Response的对象，说明是drf的异常
# res如果是None，说明是django的异常
res = drf_exception_handler(exc, context)
# 在这里，可以通过状态码，把异常分的更细一些：比如有数据的异常，除以0的异常，列表越界异常。。。。
if res:
# drf异常
# res=Response(data={'code':999,'msg':'服务器出错，请联系系统管理员'})
res = Response(data={'code': 999, 'msg': res.data.get('detail', '服务器出错，请联系系统管理员')})
else:
# django的异常，状态码是888，错误信息是 exc异常对象转成字符串
res = Response(data={'code': 888, 'msg': str(exc)})
return res
二次封装response
drf提供的Response对象，不能很方便的加入code和msg字段
自己封装一个Response类，以后都用我们自己封装的，方便写code和msg
封装步骤
1.在utils/response.py 文件夹下
from rest_framework.response import Response
class APIResponse(Response):
def __init__(self, code=100, msg='成功', status=None, headers=None, **kwargs):
data = {'code': code, 'msg': msg}
if kwargs:
data.update(kwargs)
super().__init__(data=data, status=status, headers=headers)
2.在视图类中，导入使用
return APIResponse(token='asfdasfd')
return APIResponse(token='asfdasfd',status=201,code=101)
路飞数据库配置
路飞项目数据库选择
数据库选择使用MySQL ， 配置mysql
以往使用的root用户权限太高，一般公司中会给项目单独建立一个用户，使用这个用户只能对当前库有权限
在MySQL中创建一个用户，并给用户授权luffy库的所有权限
-
链接mysql,创建一个luffy库
创建的方式：
①使用命令行创建
②navicate客户端创建
-
查看数据库中存在的用户
select user,host from mysql.user; -
创建一个只针对路飞项目库的用户luffy_api
授权账号命令为
grant 权限(create, update) on 库.表 to '账号'@'host' identified by '密码'授权方式有两种，分别是允许远程链接和允许本地链接
1.把luffy库下所有表的权限都授予luffy_api这个用户，允许远程链接 grant all privileges on luffy.* to 'luffy_api'@'%' identified by 'Luffy.123'; 2.把luffy库下所有表的权限都授予luffy_api这个用户，允许本地链接 grant all privileges on luffy.* to 'luffy_api'@'localhost' identified by 'Luffy.123'; -
以luffy_api用户登录，查看，只能看到luffy库
在项目中配置使用MySQL数据库
1.在配置文件中
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.mysql',
'NAME': 'luffy',
'USER': user,
'PASSWORD': password,
'HOST': '127.0.0.1',
'PORT': 3306
}
}
2.运行项目会报错，django默认使用mysqlDB操作mysql，mysqlDB这个模块，在python2可以的，在python3中不支持，于是咱们使用pymysql替换，到了django2.0.7以后，如果使用pymysql替换，需要改django的源代码，后期使用mysqlclient，替换pymysql，mysqlclient是mysqlDB的python3.x版本
有两种解决办法：
①使用pymysql
使用pymysql，需要改源码，需要执行
import pymysql
pymysql.install_as_MySQLdb() # 猴子补丁，把里面所有mysqlDB的对象，都替换成pymysql
-
补充——猴子补丁
猴子补丁是：在程序运行过程中得动态替换技术:https://www.liuqingzheng.top/python/Python并发编程/24-协程之gevent模块/
使用完猴子补丁，以后再django中不使用pymysql，使用mysqlclient，不需要再执行任何补丁了
-win，linux，mac，这个模块不太好装，看人品，有时候很顺利，有时候装不上 -
mysql的utf8编码和utf8mb4的区别？
-utf8：一个字符，占两个字节（byte--->1个byte是8个比特位 10101010）
-utf8mb4：一个字符，占4个字节，表情符号
-咱们学的utf-8：可变长可以1---4字节表示一个字符
② 只需要装 mysqlclient，一切都解决了
User模块User表配置
配置好mysql了，项目的用户表是，会用Auth的User表，扩写字段
使用步骤
1.创一个用户app：python ../../manage.py startapp user
2.user 的app的models.py中扩写用户表
class UserInfo(AbstractUser):
mobile = models.CharField(max_length=11, unique=True)
# 需要pillow包的支持 ImageField继承了 FileField只存储图片
icon = models.ImageField(upload_to='icon', default='icon/default.png')
class Meta:
db_table = 'luffy_user' # 指定表明
verbose_name = '用户表' # 后台管理中显示中文
verbose_name_plural = verbose_name
def __str__(self):
return self.username
3.配置文件配置，注册app，安装pillow模块
用户表配置中添加AUTH_USER_MODEL='user.UserInfo'
4.执行两条命令迁移
开放media访问
1.在配置文件中配置
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
2.新建media文件夹，icon文件夹，放一张图片进去
3.路由中加入：
path('media/<path:path>', serve, kwargs={'document_root': settings.MEDIA_ROOT}),
路飞前台项目创建和配置
项目创建
-
创建项目
-
删除一些不用的数据
-
保留的数据
1.App.vue中只保留 <template> <div id="app"> <router-view/> </div> </template> 2. HomeView.vue <template> <div class="home"> <h1>首页</h1> </div> </template> <script> export default { name: 'HomeView', } </script> 3. router/index.js const routes = [ { path: '/', name: 'home', component: HomeView }, ]
安装axios
- 安装
cnpm install axios
-
配置 main.js中
import axios from 'axios' Vue.prototype.$axios=axios -
使用的时候可以在任意组件中执行
this.$axios.get()使用
elementui
- vue2 使用elementui
1.安装：cnpm i element-ui -S
2.配置：main.js中
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
使用：在任意组件中复制粘贴（template，script，style）
- vue3 使用 element-plus
bootstrap，jquery
bootstrap基于jquery,可以在vue中引入使用
使用步骤
1.安装
cnpm install jquery -S
cnpm install bootstrap@3 -S
2.配置mains.js
import 'bootstrap'
import 'bootstrap/dist/css/bootstrap.min.css'
3.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"]
})
]
}
};
vue-cookies
1.安装cnpm install vue-cookies -S
2.配置 main.js
import cookies from 'vue-cookies'
Vue.prototype.$cookies=cookies
3.使用
在任意组件中使用this.$cookies.set()即可
前端全局样式和js配置
前端标签都有一些默认样式，编写路飞前端的时候需要统一去掉前端的默认样式
1.在src/assets文件夹下新建css文件夹
在css文件夹下创建global.css，声明全局样式和项目初始化的样式
body, h1, h2, h3, h4, h5, h6, p, table, tr, td, ul, li, a, form, input, select, option, textarea {
margin: 0;
padding: 0;
font-size: 15px;
}
a {
text-decoration: none;
color: #333;
}
ul {
list-style: none;
}
table {
border-collapse: collapse; /* 合并边框 */
}
2.在src/assets文件夹下新建js文件夹
在js文件夹下创建settings.js，配置后端接口的地址，便于以后统一更改
export default {
BASE_URL:'http://127.0.0.1:8000/'
}
3.在main.js中
1.去掉所有标签的默认样式
import '@/assets/css/global.css'
2.进行js全局配置
import settings from "@/assets/js/settings";
Vue.prototype.$settings=settings
浙公网安备 33010602011771号