python django vue httprunner 实现接口自动化平台（最终版）

news2024/10/6 2:27:07

一、项目介绍：

1.1 项目地址

前端地址：

GitHub - 18713341733/test_platform_service: django vue 实现接口自动化平台

后端地址：

GitHub - 18713341733/test_platform_front: Django vue实现接口自动化平台

1.2 项目介绍

1.2.1 环境准备

Python >= 3.8.0 (推荐3.9+版本)
nodejs >= 14.0 (推荐最新) 或者 16，千万不要使用18（会报错）
Mysql >= 5.7.0 (可选，默认数据库sqlite3，推荐8.0版本)
Redis(可选，最新版)
项目运行及部署 | Django-Vue-Admin

1.2.2 django-vue-admin 介绍（只做了解，不重要）

接口自动化平台，是基于开源项目 Django-vue-admin 来写的。

Django-vue-admin 地址：

django-vue-admin: 基于RBAC模型的权限控制的一整套基础开发平台，前后端分离，后端采用 django+django-rest-framework，前端采用 vue+ElementUI。

二、前端项目 test_platform_front

2.1 项目启动

1、克隆项目

git clone https://github.com/18713341733/test_platform_front.git

2、进入 test_platform_front 项目

cd test_platform_front

3、安装依赖

方式一：

npm install

方式二：

npm install --registry=https://registry.npm.taobao.org

方式三：

先安装cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.org

再使用cnpm安装依赖

sudo cnpm install --registry=https://registry.npm.taobao.org

4、启动服务

npm run dev

5、浏览器访问

http://localhost:8080

初始账号：superadmin 密码：admin123456

后端接口文档地址：http://127.0.0.1:8000/swagger

三、后端项目 test_platform_service

3.1 项目启动

1、克隆项目

git clone https://github.com/18713341733/test_platform_service.git

2、进入test_platform_service 项目

cd test_platform_service

3、安装依赖

pip install -r requirements.txt

4、配置mysql

在conf/env.py 中，配置mysql连接信息

3、在 env.py 中配置数据库信息 

# 使用mysql时，改为此配置
DATABASE_ENGINE = "django.db.backends.mysql"
DATABASE_NAME = 'backend' # mysql 时使用
 
# 数据库地址 改为自己数据库地址
DATABASE_HOST = "127.0.0.1"
# # 数据库端口
DATABASE_PORT = 3306
# # 数据库用户名
DATABASE_USER = "root"
# # 数据库密码
DATABASE_PASSWORD = "123456"

5、创建mysql数据库

需要手动在mysql中，创建名为backend的数据库

1、mysql数据库版本建议：8.0 mysql数据库字符集：utf8mb4
2、在mysql中，创建名为backend的库

CREATE DATABASE backend charset=utf8mb4;

6、生成迁移脚本

python3 manage.py makemigrations

7、执行迁移

python3 manage.py migrate

8、执行初始化数据

python3 manage.py init

9、启动项目

python3 manage.py runserver 127.0.0.1:8000

或者：

python3 manage.py runserver 0.0.0.0:8000

初始账号：superadmin 密码：admin123456

后端接口文档地址：http://127.0.0.1:8000/swagger

四、前后端联调

4. 1 修改前端监听后端服务的地址

4.1.1 启动后端项目

python3 manage.py runserver 0.0.0.0:8000

启动项目后，查一下后端的ip地址

4.1.2 启动前端项目

1、修改前端项目监听的后端地址

将两个文件： .env.development 与.env.test 中的监听地址，改成真实的后端地址

# 后端接口地址及端口(域名)
VUE_APP_API = "http://192.168.43.224:8000"

2、启动项目：

npm run serve

http://192.168.43.224:8080/

登录前端页面

初始账号：superadmin 密码：admin123456

后台手册 | Django-Vue-Admin

4.2 配置左侧菜单栏

4.2.1 项目初始菜单配置

在dvadmin/system/fixtures/init_menu.json 中，配置初始菜单。

 {
                "name": "部门管理",
                "icon": "bank",
                "sort": 3,
                "is_link": false,
                "is_catalog": false,
                "web_path": "/dept",
                "component": "system/dept/index",
                "component_name": "dept",
                "status": true,
                "cache": false,
                "visible": true,
                "parent": 277,
                "children": [],
                "menu_button": [

is_link：如果不是外部的连接，就填写 false

is_catalog: 是否是目录

web_path: 当前页面的uri地址。

"component": "system/dept/index" 前端组件的地址

component_name：前端组件名称