Python从搭建环境到测试平台化

向右看齐 2022-12-07 12:29 208阅读 0赞

# Python在测试中的应用 #

基于Python语言的测试，一步步搭建Django的接口测试平台

--------------------

### Python测试平台化 ###

*  Python在测试中的应用
 *  前言
 *  一、Python
 *   *  Anaconda
     *   *  Anaconda的安装
     *  Django
     *   *  Django组成
         *  Django安装
         *  Django使用
         *  Django的settings文件
 *  二、vue
 *   *  MVVM开发模式--双向数据绑定模式
     *  Vue中的关键字
     *  Vue中的事件
     *  Vue改变内容--虚拟dom和diff算法
     *   *  computed 计算属性
         *  watch 监控属性
     *  Vue-Cli
     *   *  vue-cli的使用
     *  vue组件
     *  vue中的参数传递
     *  Axios
     *   *  Axios的使用
     *  路由
 *  总结

--------------------

# 前言 #

现在python在测试中的使用越来越广泛，本身想对学习过程进行整理归类，正好赶上公司领导要进行团队的python分享，所以在这里进行记录

--------------------

本次记录的内容将会从环境搭建到接口框架的编写，再到将接口测试移植进入平台中

# 一、Python #

环境搭建使用Anaconda，开发工具使用Pycharm

## Anaconda ##

Anaconda可以方便的获取包，并且对其进行管理，同时对环境进行统一管理的发行版本，Anaconda包含了conda、Python在内的很多个科学包及其依赖项，Anaconda对环境的管理主要是是conda进行的。

### Anaconda的安装 ###

1.  这里介绍Windows的安装方式，进入到[官方网站下载页面][Link 1]进行下载
2.  下载完成之后双击安装  
    ![双击安装][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center]  
    ![选择安装位置][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center 1]  
    ![安装][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center 2]  
    ![安装完成][2020091523564777.png_pic_center]  
    打开Navigator，能打开说明安装成功  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center 3]
3.  修改为国内源  
    进入Prompt  
    ![进入prompt][prompt]  
    修改conda的源为国内源：清华源  
    conda config --add channels https://mirrors.tuna.tsinghua.edu.cn/anaconda/pkgs/free/  
    conda config --add channels https://mirrors.tuna.tsinghua.edu.cn/anaconda/cloud/conda-forge  
    conda config --add channels https://mirrors.tuna.tsinghua.edu.cn/anaconda/cloud/msys2/  
    查看conda的源  
    可以看到添加的镜像源已经被添加进去  
    ![在这里插入图片描述][20200916002206258.png_pic_center]
4.  创建新的环境  
    conda create -n python36 python=3.6  
    执行完之后:  
    ![在这里插入图片描述][20200916002407401.png_pic_center]  
    conda 会将环境默认放到安装目录下的envs目录下
5.  进入到conda环境中  
    conda activate python36  
    ![在这里插入图片描述][2020091600264279.png_pic_center]
6.  退出conda环境  
    conda deactivate  
    ![在这里插入图片描述][20200916002758374.png_pic_center]
7.  pycharm中使用conda管理的环境进行创建项目  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center 4]  
    创建完成之后，会自动进入到该环境  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center 5]

## Django ##

Django，Python的高级Web框架，功能强大，封装了大量底层，使开发Web代码变得更加高效、快速、简介。具有松耦合、灵活的特性，适合快速开发。

--------------------

### Django组成 ###

Django由以下几部分组成：

*  django-admin  
    用于管理任务的命令行工具，比如常见的会使用 python django-admin.py startproject \[项目名称\]
 *  manage.py  
    命令行实用用具，用户与Django进行各种交互，比如常见的：
    
     *  python manage.py startapp \[appName\] 创建django的应用
     *  python manage.py runserver 命令行启动django的服务
     *  python manage.py createsuperuser 命令行创建django的超级管理员
     *  python manage.py makemigrations 记录model同步到X\_initial.py 文件
     *  python manage.py migrate 迁移同步到数据库
 *  settings.py  
    django的配置文件，记录了django的基础信息，数据库信息，日志信息，端口信息，中间件信息，时区信息和以后扩展的一些信息（比如说与celery的集成信息，与redis的集成信息）。与java中的web.xml配置文件和application.properties功能类似。
 *  model.py  
    模型，用来定义对象与数据库，django使用model来与自带的orm框架进行交互。使用django的orm框架可以不再使用原生sql对数据库进行操作，django会替你完成这一切，model创建的内容即为数据库内的内容。与java中的mybatis、hibernate处于同一位置，进行了高度的封装。
 *  views.py  
    视图，django的视图层进行数据处理，并且返回数据结果（返回结果可以为json，或者交给template进行处理）。
 *  urls.py  
    路由映射，这个文件中的内容描述了django的url如何与编写的视图发生关联。urls中支持使用正则对地址进行匹配。urls的扫描规则为自上至下进行扫描，扫描到匹配的情况会停止扫描，而使用扫描到的内容。django的路由支持url的反向解析，对与template和view层的内容可以使用简单的方式进行url请求。目前没有发现django可以使用注解的方式进行路由的配置，但是django的路由可以进行拆分和分组（namespace）便于维护。
 *  templates  
    模板，python中可以实现在views中编写HTML的编码的动作。Django的模板系统可以做到python与前端的分离。templates里面由html和逻辑控制代码来实现。vue现在也是越来越多，当然如果django使用API提供服务的话，templates系统是可以使用vue进行前端的展示和控制的。
 *  Form  
    表单，Django的表单可以做到：生成HTML标签，对用户提交的数据进行校验，保留上次的输入内容。
 *  admin.py  
    后台模型，将models添加到admin里面可以在django提供的后台对数据进行管理。
 *  django  
    内置函数，django中内置了一系列的函数用来支撑上述的工作包含了http，app，config，db和认证系统等。

### Django安装 ###

进入到前文讲到的conda环境中运行以下代码即可进行安装

conda install django

### Django使用 ###

1.  创建工程：django-admin startproject autotest
2.  迁移数据库： python manage.py makemigrations ----> python manage.py migrate
3.  创建超级用户： python manage.py createsuperuser
4.  启动项目： python manage.py runserver
5.  创建应用 : python manage.py startapp app1

基本上经常用到的命令就都在这里了。

### Django的settings文件 ###

Django的settings文件包含了Django应用的所有配置项。

# 二、vue #

Vue是一个渐进式的JS框架，只注重视图层，结合了HTML+CSS+JS，非常易用，并且有很好的生态系统（日益繁荣的社区），Vue框架体积很小，加载速度快，优化到位。

## MVVM开发模式–双向数据绑定模式 ##

Model层：模型层，表示JavaScript对象  
View层：视图层，表示DOM（HTML操作的对象）  
ViewModel层：连接视图和数据的中间件。Vue.js是MVVM中的ViewModel层的实现者。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center 6]  
VM的作用是连接 View和Model。ViewModel中包含了DOM Listenners 和Data Bindings。

*  DOM Listenners 监听数据变化（监听Model）
 *  Data Bindings 对数据进行绑定（当监听器监听到Model发生变化之后，DataBindings将数据绑定给View进行展示）  
    ViewModel能够观察到数据的变化，并对视图对应的内容进行更新  
    ViewModel能够监听到视图的变化，并且通知数据进行改变

## Vue中的关键字 ##

\{ \{\}\} 表示为差值表达式，插值表达式只能写在html中  
vue中的关键字都是作为html页面中的属性

*  v-model 是将标签中的value值与实例中的data值进行绑定
 *  v-on 事件绑定 （v-on:click=function（））通过配合具体的事件名，绑定vue中定义的函数（函数被定义到vue中的methods中）v-on: 可以简写为@
 *  v-bind 属性绑定，使用vue中的属性作为html标签的属性的内容就可以使用v-bind进行属性绑定 （v-bind:href=“link”） v-bind: 可以简写为 ：
 *  v-once 此标签中的差值表达式，只获取一次数据，之后数据的变化不影响此差值表达式的元素
 *  v-html 好比是innerHtml,v-html会将vue中的属性的值作为html的元素使用
 *  v-text 会将vue中的属性的值只作为文本使用

## Vue中的事件 ##

1.  vue中如何使用事件
2.  事件中的参数传递
3.  事件修饰符  
    @click.stop 阻止事件的传播（冒泡）<根据官网进行补充学习>

## Vue改变内容–虚拟dom和diff算法 ##

Vue是封装了的JS，JS能够做的事分成两部分：第一是改变内容（数据），第二是改变样式。所以Vue能够做的也就是改变内容和样式。  
Vue改变内容的方式：

*  差值表达式 \{ \{ 差值\}\}
 *  计算属性 computed

### computed 计算属性 ###

计算属性的重点在 **属性** 两个字上（属性是名词），首先是个**属性**，其次**属性**有**计算**的能力（计算是动词）,这里的计算就是个函数；简单点说，就是一个能够将计算结果缓存起来的属性（**将行为转化成了静态的属性**）。  
这样对于不需要经常变动的值（常用的函数），我们只需要使用计算属性进行缓存，可以加快vue的效率。  
虽然在computed 里面虽然存放的是函数，但是在调用的时候，computed里是一个属性。

### watch 监控属性 ###

通过watch里给属性绑定函数，当属性的值发生变化时，该函数就会自动被调用，调用时，可以接收两个参数，第一个参数是属性改变后的值，第二个参数是改变前的值。

## Vue-Cli ##

vue-cli类似于java中的maven，使用maven我们可以管理项目的依赖，还可以通过maven来确定项目的结构（文件夹和文件的层级关系）。vue-cli脚手架工具可以解决vue项目里的项目结构，使用vue-cli就可以方便的创建出一个拥有比较成熟的项目结构的项目。

### vue-cli的使用 ###

在使用vue-cli之前，需要先安装node.js环境。有了node.js可以方便的将前端发布出来（提供了一个服务器容器）。来自百科的描述：**Node.js是一个**基于Chrome V8引擎的**JavaScript运行环境**，Node.js使用了一个事件驱动，非阻塞式的I/O模型。Node是一个让JavaScript运行在服务端的开发平台，让JavaScript成为与PHP、Python等服务端语言平起平坐的脚本语言，其**实质是对Chrome V8引擎进行了封装**。

安装好node环境之后，在node里面安装vue-cli。

npm install vue-cli -g
    使用npm 进行包管理，install为安装命令，vue-cli为安装内容，-g标识为全局安装
    如果使用npm过慢，可以使用淘宝镜像进行加速使用，使用cnpm对npm进行替换

创建vue的项目

先创建vue项目的目录
    vue list 命令可以看到官方提供的项目骨架。可以使用这些骨架进行项目搭建。
    vue init webpack-simple vue-cli-demo
    使用init进行初始化，webpack-simple模板进行初始化，初始化的项目名称为vue-cli-demo

webpack-simple 工程目录：  
![webpack-simple工程目录][webpack-simple]  
node\_modules存放依赖的包，写的源码放到src中。inde.html为看到的首页，main.js为程序的入口（入口函数）。import为引入各种依赖的包会有引入app，import App from ./App.vue 会导入App.vue，并且将该vue放入到创建的vue对象中。因为所有的实现放到了各个组件中，然后由main.js进行引用。所以index.html只有那么几行。项目启动的时候main.js里的内容就会被执行。让App.vue中的内容进行展示。  
App.vue这种以vue后缀的文件实际上就是一个vue对象，也称为vue组件。

## vue组件 ##

组件包含了：

*  template 用来存放html
 *  script 暴露vue对象 export default用来暴露默认的vue对象
 *  style css对象  
    组件定义好之后需要在项目中进行注册才能使用；  
    分成局部（本地）注册和全局注册  
    全局注册在APP.vue中进行注册使用  
    局部注册在组件中引入并进行compnents声明即可。

## vue中的参数传递 ##

组件之间的参数传递：  
父组件-》子组件：  
在子组件中设置参数，放到props中使用list进行传参。参数列表与父组件中一致  
父组件使用：进行传参

子组件
    <template>
    	<div>
    		商品列表
    		{
       {MyProductList}}
    	</div>
    </template>
    <script> export default{ name: "content.vue", props:["MyProductList"] } </script>

父组件
    <template>
    	<div id="app">
    		<MyContent :MyProductList="msg"></MyContent>
    	</div>
    </template>
    <script> name="app", data(){ return { msg: "H他来咯" } } </script>

父组件将参数传递给参数MyProductList，然后子组件通过MyProductList参数获取到。  
props的写法 ：

*  props:\[“prop1”, “prop2”\]
 *  props:\{  
    // 参数名称  
    myName:\{  
    // 类型  
    type:String,  
    // 是否必须  
    required:True,  
    // 默认值  
    default:“XX”  
    \}  
    \}  
    使用props进行参数传递有两种方式：list，还有就是对象。

参数由子组件传递给父组件：  
在父组件中定义一个函数，传递给子组件，子组件调用函数并且传递参数给该方法。从而实现将子组件的数据传递给父组件。  
还可以使用事件发射的方式进行子传父的参数传递。this.$emit()进行参数传递。

## Axios ##

Axios 是一个开源的可以用在浏览器端和NodeJS的异步通信框架。Vue.js是一个视图层框架，严格遵守Soc(关注度分离原则)，因此Vue.js并不具备AJAX通信功能，因此提供了vue-resource的插件，但是vue2.0之后推荐使用Axios框架。第三方开源工具，详见：https://github.com/axios/axios

### Axios的使用 ###

安装vue axios

npm install --save axios vue-axios

**Axios发送请求**  
get请求

// 创建axios对象
    const axios = require('axios');
    // 发送get请求，根据id获取信息
    axios.get('/user?ID=12345')
      .then(function (response) { 
        // 处理请求成功之后的响应信息
        console.log(response);
      })
      .catch(function (error) { 
        // 处理发送请求错误的情况
        console.log(error);
      })
      .then(function () { 
        // 不论如何都会进行运行的处理
      });
    
    // 使用异步/等待 
    async function getUser(){ 
    	// async 用于声明一个function是异步的，而await用于等待一个异步方法执行完成
    	try { 
    		const response = await axios.get('/user?ID=12345');
    		console.log(response);
    	}catch (error){ 
    		console.error(error);
    	}
    }

发送post请求

axios.post('/user',{ 
    	firstName: 'Fred',
    	lastName: "JKS",
    })
      .then(function (response){ 
    	console.log(response);
      })

## 路由 ##

在VUE中的路由能够帮助我们在一个vue组件中实现其他组件的相互切换  
安装路由模块  
npm install vue-router  
创建vue模块

# 总结 #

提示：这里对文章进行总结：

[Link 1]: https://docs.anaconda.com/anaconda/install/windows/
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center]: /images/20221123/8d5b71eb35354502be5531671be86017.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center 1]: /images/20221123/70e44d3cdb8b4066aea3bafa94b7b676.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center 2]: /images/20221123/4a16f14c05f744d5a567ff67403b197f.png
[2020091523564777.png_pic_center]: /images/20221123/5bb16397024440039906df254b82364c.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center 3]: /images/20221123/33c0c617b6484113994caa7f41a5163c.png
[prompt]: /images/20221123/7bc912f90bf44c47b25023c8e1f88837.png
[20200916002206258.png_pic_center]: /images/20221123/9c4eb8ea7cf34b8dab48f4992e0bad7d.png
[20200916002407401.png_pic_center]: /images/20221123/9ee803f398404f8589c39062fef4acc6.png
[2020091600264279.png_pic_center]: /images/20221123/5aec28e4cf6c4940b9f8e18fb00305fc.png
[20200916002758374.png_pic_center]: /images/20221123/1551b7a0005d4ab28fcf1a8d49d2e853.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center 4]: /images/20221123/610a741e543a42c2b387082b805fb760.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center 5]: /images/20221123/a5b1fc6d6137422580971ecc8f3d582f.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTMzMDI1ODY_size_16_color_FFFFFF_t_70_pic_center 6]: /images/20221123/1db3f0b92d7249df9c585563cb60966b.png
[webpack-simple]: /images/20221123/596826578e8d4255b071800bc7492264.png