likes
comments
collection
share

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

作者站长头像
站长
· 阅读数 315

文章目录

三、ApiFox 在企业中的应用 前后端分离开发利器partly_sunny:需求分析snowman:设计接口 编写代码hourglass_flowing_sand:导入文档四、在线生成代码提高效率recycle:在线生成项目源代码,直呼 YYDS!hotsprings:接口请求代码 一应俱全

一、什么是ApiFox?

Apifox 是 API 文档、API 调试、API Mock、API 自动化测试一体化协作平台,定位 Postman + Swagger + Mock + JMeter 。通过一套系统、一份数据,解决多个系统之间的数据同步问题。只要定义好 API 文档,API 调试、API 数据 Mock、API 自动化测试就可以直接使用,无需再次定义;API 文档和 API 开发调试使用同一个工具,API 调试完成后即可保证和 API 文档定义完全一致。高效、及时、准确!

一句话概括:ApiFox = Postman + Swagger + Mock + JMeter ,开发利器!

二、ApiFox的好处

Apifox的优势在于它能自动对A pi 进行更新和维护,使得项目接口的新增和变更能同步到项目所有成员中,避免数据不同步和沟通不及时带来的麻烦;使得测试人员无须重建新项目或手动导入更新部分, 减少了不必要的工作量

API 文档设计

  • 可视化 API 文档管理,零学习成本。
  • 支持数据模型,接口之间可以复用相同数据结构。
  • 接口文档完全遵循 OpenAPI(Swagger) 规范。
  • 支持在线分享 API 文档,方便与外部团队协作。

API 调试

  • Postman 有的功能 Apifox 都有(如环境变量、前置/后置脚本、Cookie/Session 全局共享等),并且比 Postman 更高效好用。
  • 自动校验数据结构:校验返回的数据结构是否符合文档定义,自动发现接口数据异常。
  • 可视化的断言、提取变量、数据库(SQL)操作等功能。
  • 支持接口用例功能(一个接口多个用例)。

更多ApiFox的优势,移步官网查看 ApiFox 官网

PostMan 对比 国产化测试工具 Apifox

导入数据

  • PostMan 不支持导入数据
  • ApiFox 支持导入PostMan数据、等多种格式数据

测试接口

  • PostMan 测试接口,有时可能会出现延迟情况,打不开软件,文档难以维护
  • ApiFox 一体化测试 ,速度快,效率高,可一键导出接口文档,利于后期的开发维护

三、ApiFox 在企业中的应用 前后端分离开发利器

需求分析

需求:使用SpringBoot + Swagger 完成接口开发,具体要求如下:

  • 完成信息接口的开发
  • 导出文档,提供接口文档
  • 采用ApiFox 完成需求开发

项目环境 为 微服务项目,后续我会提供相关项目

项目结构如下:

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

设计接口 编写代码

ApiFoxController

package com.chen.controller;

import com.chen.common.ResultBean;
import io.jsonwebtoken.impl.crypto.MacProvider;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import java.util.HashMap;
import java.util.Map;

@RestController
@CrossOrigin
@RequestMapping("/apifox")
public class  ApiFoxController  { 

    @PostMapping("/test")
    public ResultBean<Map<String, Object>> test() { 
        Map<String, Object> map = new HashMap<>();
        map.put("ApiFox", "YYDS!!!");
        return ResultBean.create(0, "success", map);
    }

}

接口编写完毕,接下来我们对接口进行测试

测试接口

下载[ApiFox]http://apifox.cn/a1csdbbug)

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

下载桌面版本64位即可,具体情况根据电脑来下载

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

清新的UI界面,很舒服~

新建项目

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

进入项目

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

整体项目工作台

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

管理环境

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

下面我们新建一个快捷请求,请求刚刚编写的接口,看看返回的结果

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

生成接口文档

点击右上保存接口

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

填写接口相关信息

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

成功生成接口

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

生成接口如此方便~ 真香!

四、ApiFox 更多功能

导入文档

项目设置 – > 导入数据 --> 选择URL导入 --> 输入 url --> 点击提交即可

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

提交后如下界面

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

导入成功

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

查看主页接口已导入成功

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

导入成功~ 如此快捷!

导出文档

点击接口后的 … ,等待下拉菜单出现 点击导出

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

选择想要的格式,导出

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

五、在线生成代码提高效率

在线生成项目源代码,直呼 YYDS!

功能说明

根据接口模型定义,自动生成各种语言/框架(如 TypeScript、Java、Go、Swift、ObjectiveC、Kotlin、Dart、C++、C#、Rust 等 130 种语言及框架)的业务代码(如 Model、Controller、单元测试代码等)和接口请求代码。目前 Apifox 支持 130 种语言及框架的代码自动生成。

更重要的是:你可以通过 自定义代码模板 来生成符合自己团队的架构规范的代码,满足各种个性化的需求。

安装插件

打开 生成代码 面板,点击 安装插件 即可自动下载并安装。

安装Java环境

运行代码生成插件需要 Java 环境。请查看 安装 Java 环境

生成代码

获取apifox接口生成代码

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

打开后,炫酷的生成页面迎面而来

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

点击按钮 下载代码生成插件

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

生成Spring代码即可

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

生成项目目录

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

接口请求代码 一应俱全

查看接口请求代码,无需手写,直接复制即可调用接口

原力计划【云原生】前后端分离项目下 如何优雅的联调程序?

该页面包含了大部分的网络接口请求,真的很香~