开发者社区> 游客pxprrm2iipsfu> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

接口测试平台代码实现98:全局域名-5

简介: 接口测试平台代码实现98:全局域名-5
+关注继续查看

  之前一节我们迅速 复制粘贴搞定了 全局域名的:

models.py,urls.py,views.py。


    所以本节我们要搞定的是P_apis.html中的部分了。

首先看看我们现在的html页面的结构,全部收缩,看的直观一些:微信图片_20220628232220.png

如上图,我们开辟一块空间,用来存放全局域名,整体内容,基本和全局请求头类似,所以我们依然是复制粘贴,然后改各个标签的id和内部其他字段数据。

当然不要忘了 给这个按钮onclick属性连接上我们的打开host设置框的函数:微信图片_20220628232233.png

经常有同学反馈找不到图里的行数,其实我们可以通过ctrl+f 来搜索其中关键字。)

需要注意的是,请求头是 name = key : value ,每行三个框。

而域名是  name  = host ,每行俩个框。


复制完后,改动的时候注意要一行一行的改。千万不要漏掉,整个过程要保持大脑非常清晰,虽然几乎全都是把header改成host,但是也要注意其他地方。当然,style内的样式属性基本不用改。但是注意,有些是host,有些是hosts。而且要保持好心态,因为一次性改动这么大一堆代码,很难做到一遍成,一次通。


改完后代码如下:(注意host输入框的宽度调整为了70%)

{# 全局域名 #}

<div id="project_host_div" style="display: none;border-radius:5px;width: 70%;height: 70%;
position: absolute;left: 15%;top: 15%;box-shadow: 4px 4px 8px grey;
padding-left: 10px;background-color: white">
    <div class="btn-group" style="float: right">
        <button onclick="project_host_save()" type="button" class="btn btn-success">保存</button>
        <button onclick="project_host_close()" type="button" class="btn btn-default">取消</button>
    </div>
    <h4>请设置本项目的全局公共请求头:</h4>
    <div id="host_plan">
        {% for i in project_host %}
            <input type="text" name="host_id" value="{{ i.id }}" style="display: none;">
            <input type="text" name="host_name" value="{{ i.name }}" style="width: 20%;margin-top: 3px" placeholder="name"> = "
            <input type="text" name="host_host" value="{{ i.host }}" style="width: 70%" placeholder="host"> "
            <br>
        {% endfor %}
    </div>
    <br>
    <button onclick="add_project_host()">新增</button>

</div>
<script>
    function project_host_div_show() {
        document.getElementById('project_host_div').style.display = 'block';
    }
    function project_host_close() {
        document.location.reload()
    }
    function project_host_save() {
        var names = document.getElementsByName('host_name');
        var hosts = document.getElementsByName('host_host');
        var ids = document.getElementsByName('host_id');
        var req_names= [];
        var req_hosts=[];
        var req_ids=[];
        for(var i=0;i<names.length;i++){
            req_names.push(names[i].value);
            req_hosts.push(hosts[i].value);
            req_ids.push(ids[i].value)

        }
        $.get('/save_project_host/',{
            "project_id":"{{ project.id }}",
            "req_names":req_names.toString(),
            "req_hosts":req_hosts.toString(),
            "req_ids":req_ids.toString(),
        },function (ret) {
            document.location.reload();
        })
    }
    function add_project_host() {
        var host_plan = document.getElementById('host_plan');
        var i0 = document.createElement('input');
        i0.name = 'host_id';
        i0.value = 'new';
        i0.style.display ='none';
        var i1 = document.createElement('input');
        i1.style='width: 20%;margin-top: 3px';
        i1.placeholder='name';
        i1.name='host_name';
        var i2 = document.createElement('input');
        i2.style='width: 70%';
        i2.placeholder='host';
        i2.name='host_host';
        host_plan.appendChild(i0);
        host_plan.appendChild(i1);
        host_plan.appendChild(document.createTextNode(' = " '));
        host_plan.appendChild(i2);
        host_plan.appendChild(document.createTextNode(' "'));
        host_plan.appendChild(document.createElement("br"));
    }
</script>


然后我们刷新页面,进行各种测试。我这边发现测试全部正常:微信图片_20220628232239.png

好,本节内容到此结束,欢迎大家持续关注和分享。

下节我们去把这个全局变量-域名插入到接口库/用例库 的使用中的前后端开发。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
接口测试平台代码实现100:全局域名-7
本节作为全局域名的最后一节,也是代码实现的第100章。 我们本节就来实际去后台进行修改,让全局域名可以真实生效,目前我们接口库接口和用例库步骤,保存的host中,若是全局域名,前面四个字符一定是:“全局域名”
17 0
接口测试平台代码实现128: 全局变量-7
本节课我们处理一些 上节课遗留的 前端问题。 这也是养成开发自测的好习惯,毕竟我们是测试出身,所以自测水平一定要很高,不然会被开发同学笑话。而且我们的程序之后可没有正式的测试阶段了。直接上线,所以最好别有严重bug。
10 0
接口测试平台代码实现130: 全局变量-9
本文开始,全局变量 要正式进入 复杂的后台实现了,当然如果能跟到这里,那么也应该没什么难度。 这里还是要重申一下,代码出现问题请先仔细比对教程源码,实在找不出来就先在群里问,没加群的请先加 vx: qingwanjianhua 博主每天的时间并不充裕,私聊的人也很多,如果群里解决不了后可以直接@我去热饭 即可。
10 0
接口测试平台代码实现129: 全局变量-8
接口测试平台代码实现129: 全局变量-8
12 0
接口测试平台代码实现146: 平台主题-夏日清凉5
接口测试平台代码实现146: 平台主题-夏日清凉5
9 0
接口测试平台代码实现127: 全局变量-6
接口测试平台代码实现127: 全局变量-6
15 0
接口测试平台代码实现124: 全局变量-3
接口测试平台代码实现124: 全局变量-3
15 0
接口测试平台代码实现80: 多接口用例-20
接口测试平台代码实现80: 多接口用例-20
14 0
接口测试平台代码实现65: 多接口用例-5
接口测试平台代码实现65: 多接口用例-5
13 0
接口测试平台代码实现57-首页重构5
本节我们接着开发首页, 主要内容是 让左侧的请求记录和右侧的请求模块 联动起来。 具体联动需求: 右侧请求一次之后,左侧生成记录 点击左侧记录,右侧则会显示这次记录的请求数据 我们本节课的内容是想办法实现1-生成记录。
21 0
+关注
游客pxprrm2iipsfu
我去热饭
435
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载