【测试平台开发】

【测试平台开发】

一、 后端开发

1、常见的技术架构与组件

语言:
项目注重高并发:选用go
注重区块链:选用go、rust(主打高性能)
大型浏览网站(如电商):Java

技术架构与组件:
前端技术架构:bootstrap、vue、react
后端技术架构:django、flask、spring boot
数据存储:mysql、res
任务调度架构:jenkins
数据报表:echarts、vega、kibana、grafana、allure

2、常见的测试平台开发模式

大而全(比如公司产品定位是向外出售付费服务,需要花费较多人力):
python Django
Java Sping Boot
React(前端框架)

小而简(适合初学者):
python Flask
Java sparkjava
vue(上手快)

测试平台技术架构:
在这里插入图片描述

3、接口路由技术

Flask 是一个轻量级的 web 开发框架。 它依赖 jinja2 和 Werkzeug WSGI 服务的一个微型框架。

中文文档:http://docs.jinkan.org/docs/flask
英文文档:https://flask.palletsprojects.com/en/2.0.x/
from flask import Flask

#创建应用程序实例
app = Flask(__name__)

#添加路由
#https://ceshiren.com/search?q=appium
#(前端通过URL给后端发送请求,后端接收到请求后,会把请求映射到方法hello_world上,执行代码,并将执行结果返回到前端界面)
#https————协议
#ceshiren.com————域名
#/search————路由
#q=appium————请求参数
@app.route("/")
def hello_word():
    return "<p>Hello, World!</p>"

@app.route("/demo")
def demo():
    return "<p>这是demo</p>"

#动态路由
@app.route("/userinfo/<username>")
def username(username):
    return f"这是{username}同学的信息"

#启动程序
if __name__ == '__main__':
    app.run()

4、HTTP请求方法

HTTP请求方法一共15种,常用的有4种。

请求说明
GET获取服务器资源(对数据有长度限制,如IE浏览器限制2083个字符,超过了点提交,浏览器没有反应)
POST新增服务器资源
PUT更新服务器资源(客户端提供改变后的完整资源)
DELETE删除服务器资源

eg.

from flask import Flask

app = Flask(__name__)


# methods 是一个列表类型,可以添加多种 请求方式 ,get, post, put,delete...
@app.route("/cases", methods=["get"])
def get_case():
    return {"code": 0, "msg": "get success"}


@app.route("/cases", methods=["post"])
def post_case():
    return {"code": 0, "msg": "post success"}


# put 请求
@app.route("/cases", methods=["put"])
def put_case():
    return {"code": 0, "msg": "put success"}


# delete 请求
@app.route("/cases", methods=["delete"])
def delete_case():
    return {"code": 0, "msg": "delete success"}


if __name__ == '__main__':
    app.run()

post请求工具(模拟post请求):curl、postman

5、测试环境配置

if __name__ == '__main__':
    # flask 服务启动起来,
    # 轮询等待的方式 ,等待浏览器发来请求,
    # 会一直接受请求,直到程序停止
    app.run(host="0.0.0.0", port=5008, debug=True)  #监听主机
    # 1、设置 host 参数
    # 127.0.0.1 只能本机访问
    # 0.0.0.0 服务发布到局域网
    # 2、设置端口5000
    # 3、打开debug模式,方便调试(运行过程中修改代码,直接ctrl+s,不需要重新跑)

二、前端界面

1、测试平台原型图
顶部栏、侧边栏、用户界面
三大组件
页面设计:vuetify
页面跳转:router
前后端通过接口交互方式:axios
2、VUE UI初始化项目

  • 安装vue脚手架工具: npm install -g @vue/cli
  • 启动vue ui: vue ui
  • 新建项目: test_fronted
  • 配置项目:选择默认
  • 安装插件:router
  • 安装插件:vuetify
  • 安装依赖:axios
    3、Vuetity搭建主界面Layout
    vuetify UI组件官网:vuetifyjs.com
    4、Vuetity搭建侧边栏
  • 选择UI组件
  • 选择Navigation drawers(导航抽屉)

5、Vuetity搭建测试用例界面

  • 3
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值