【公开仓库】基于Flask的后端项目spider-admin-pro: https://github.com/mouday/spider-admin-pro
【私有仓库】基于Vue的前端项目spider-admin-pro-web: https://github.com/mouday/spider-admin-pro-web
一、[二次开发] ：Vue前端项目spider-admin-pro-web
1、安装项目
# 克隆项目
git clone git@github.com:mouday/spider-admin-pro-web.git
# 进入项目目录
cd spider-admin-pro-web
# 安装依赖
npm install
# 建议不要直接使用 cnpm 安装以来，会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npm.taobao.org
# 启动服务
npm run dev
-
NVM管理node（一定要以管理员身份运行终端，报错：exit status 5: �ܾ����ʡ�）
由于作者使用的node 10版本，我这里是node16，于是需要使用nvm管理多个node版本
教程【NVM管理node版本】
nvm ls available查看可用版本
nvm install 10.24.1安装指定版本
nvm install latest // 安装最新版的nodejs，会同时一起安装对应的npm
nvm install 10.24.1 // 安装指定版本号的nodejs，会同时一起安装对应的npm
nvm ls // 查看当前已安装的所有nodejs版本
nvm use 10.24.1 // nodejs版本切换
node -v 查看当前node版本
npm -v 查看当前npm版本
3.启动项目
（1）修改.env.development开发环境url地址，地址指向的是本地python Flask项目（spider-admin-pro）的运行地址（需要重启Vue）
（2）分别启动vue项目和flask项目（因为vue依赖的是flask的接口）
（2）1、启动接口服务
$ python dev.py
（2）2、启动前端开发环境
$ npm run dev
4. 修改Vue项目
我这里主要是添加logo和增加了审核记录查询（vue比较熟悉，不多做概述）
{
path: "/aipost",
component: Layout,
redirect: "/aipost/list",
name: "system",
meta: { title: "审核记录", icon: "log" },
children: [
{
path: "aipost-list",
name: "aipost-aipost-list",
component: () => import('@/views/aipost/aipost'),
meta: { title: "审核记录", icon: "log" }
},
]
}
5. 打包发布
（1）打包vue项目
$ npm run build:prod
（2）将打包文件夹 拷贝到如下目录 ：dist -> spider_admin_server/spider_admin_pro/web/public
或者直接执行命令：npm run dep-pub
二、[二次开发]：Flask的后端项目spider-admin-pro
spider-admin-pro的目录结构：
.
├── run.py # 程序入口
├── api # Controller层
├── service # Sevice层
├── model # Model层
├── exceptions # 异常
├── utils # 工具类
└── web # 静态web页
扩展
peewee： 是Python中的ORM框架。
ORM（对象关系映射）是一种将对象与关系数据库之间进行映射的技术（方便数据库的增删查改）
1. 增加配置路由，增加api入口，增加server接口服务
主要完成入口配置、条件查询、分页查询、返回数据
# 路由配置
ROUTERS = {
'/': web,
"/api/auth": auth_api,
....
"/api/aiPost": aipost_api
}
#接口服务
@classmethod
def get_aiPost(cls, page=1, size=20, status=None, search=None):
query = AiPostModel.select()
if status == 'success':
query = query.where(AiPostModel.sug == '正常')
elif status == 'reject':
query = query.where(AiPostModel.sug == '违规')
if search is not None:
query = query.where(AiPostModel.title.contains(search))
rows = query.paginate(page, size).dicts()
total = query.count()
return {
'list': rows,
'total': total
}
2. 使用ORM框架peewee进行数据库操作（主要是查询）
确保model字段跟mysql字段一致
# 定义一个模型类
class AiPostModel(BaseModel):
"""登录日志"""
id = AutoField(primary_key=True)
code = CharField()
sug = CharField()
title = CharField()
newsUrl = CharField()
imageUrl = CharField()
msg = CharField()
creatTime = DateTimeField(default=datetime.datetime.now)
class Meta:
database = db
db_table = 'aipostmodel' # 与数据库中的表名保持一致
模型基类BaseModel：连接数据库、重连
db_config = {
'host': '172.50.',
'port': 3306,
'user': 'root',
'password': 'password',
'database': 'rmzkai',
}
# 同步数据库断线重连类
class ReconnectMySQLDatabase(ReconnectMixin, MySQLDatabase):
pass
register_database(ReconnectMySQLDatabase, 'mysql')
# 数据库实例
db = ReconnectMySQLDatabase(**db_config)
class BaseModel(Model):
class Meta:
database = db
3 . 打包上传服务器并运行
将本地spider_admin_pro项目目录下所有文件（包含已更新的Vue前端web项目）上传覆盖线上项目
>. DEBUG
1. 使用Git clone下载spider-admin-pro，然后pip install -i https://pypi.tuna.tsinghua.edu.cn/simple -r requirements.txt完成后，python dev.py 报错
In Flask2.3.X, flask.json module deprecated JSONEncoder class, override_json_encoder is not working now. It will raise ImportError: cannot import name 'JSONEncoder' from 'flask.json'
解决：flask降级到2.2.5即可 pip install flask==2.2.5
2. 项目上传到服务器后运行报错
File "/xmt-env/lib/python3.11/site-packages/pymysql/err.py", line 143, in raise_mysql_exception
raise errorclass(errno, errval)
peewee.OperationalError: (1045, "Access denied for user 'root'@'cscm-spider' (using password: YES)")
解决：
链接MySQL 数据库 ： 本地运行host：172.50. ，传到服务器运行直接用 localhost 就行了
db = MySQLDatabase(
'rmzkai',
user='root',
password='password',
host='localhost ',
port=3306
)
3. 运行项目gunicorn --bind '172.50.:8000' 'spider_admin_pro.main:app'后关闭xshell窗口 aiPostList接口报错
解决 ：使用nohup运行
nohup gunicorn --bind '172.50.:8000' 'spider_admin_pro.main:app
