zoukankan      html  css  js  c++  java
  • web前端自动接口扫描

    第一次发博客,还请大家多多指教。

    目前在做的项目是前后台分离的,使用wiremock造的数据,但是接口一般都是后台推动的(版本经理在后台那边)。很多次后台改动了接口往往没有告知前台,导致联调时候经常出现接口错误,而且很多时候各个接口之间有依赖关系,如果前面的接口没法测试后续的接口也没法进行。基于此,很有必要开发一套能够自动测试接口的方法。

    直接上代码,testPortForConsole.js:

    var postDatas = [
        {
            url : '/getStudents.do'  ,
            portName:'',
            description :'',
            data:{
                serviceName : "getStudents",
                class : "six",
                grade : "two"
            }
        },
        {
            url : "/getScore.do",
            portName:'',
            description :'',
            data:{
                serviceName : "getScore",
                studentID : "08070146",
                subject : "Math"
            }
        }
    //这里每一个元素对应一个接口 ]; (function(){ localStorage.removeItem('success'); localStorage.removeItem('failed'); var send = function(url,param,portName){ $.ajax({ url : url, type: 'POST', data: JSON.stringify(param), dataType: 'application/json,text/plain.*/*' }) .success(function(data){ localStorage.setItem('success',localStorage.getItem('success') + portName + '接口返回成功|'); }) .error(function(data){ localStorage.setItem('failed',localStorage.getItem('failed') + portName + '接口返回失败|') ; throw portName + '接口返回失败'; }) }; for(var s = 0,len = postDatas.length;s < len;s++){ send(postDatas[s].url,postDatas[s].data, postDatas[s].portName); } })();

    如果接口过多的话可以考虑使用grunt命令来从项目中合并各个下发的请求的mock数据,这样便于分模块维护和管理。

    module.exports = function (grunt) {
        // 项目配置
        grunt.initConfig({
            pkg: grunt.file.readJSON('package.json'),
            concat: {
                options: {
                    banner: '[
    ',
                    separator:',
    ',
                    footer:']',
                    stripBanners:'true'
                },
                build: {
                    src: 'src/**/*.json',
                    dest: 'dest/dest.json'
                }
            }
        });
        grunt.loadNpmTasks('grunt-contrib-concat');
        grunt.registerTask('default', ['concat']);
    }
    

    这样直接在原有的项目中直接将testPortForConsole.js中的代码拷贝运行即可自动完成接口的扫描。扫描的结果都保存在localStorage中,通过如下方法可以得到

    console.dir(localStorage.getItem('success').split('|'));
    console.dir(localStorage.getItem('failed').split('|'));

    新手求支持 ~_~.

    学而时习之不亦悦乎。
  • 相关阅读:
    CSS团队协作规范
    百度前端学院-基础学院-第四课
    百度前端学院-基础学院-第三课
    百度前端学院-基础学院-第二课
    vue(三)-父子组件通信
    setTimeout()与clearTimeout()
    vue(二)-父子组件语法
    vue(一)使用vue-cli搭建项目
    CSS table-layout 属性
    git学习
  • 原文地址:https://www.cnblogs.com/xianZJ/p/4534386.html
Copyright © 2011-2022 走看看