web前端怎么使用Yapi

1、要完整运行前端代码，通常并不需要完整的后端环境，我们只要在mock server中实现以下几点就行了：

能渲染模板

实现请求路由映射

数据接口代理到生产或者测试环境

能渲染模板很简单，在mock server中集成模板引擎就行了，然后提供模拟的页面数据用于完整渲染页面，不过有时候生产环境中的模板引擎可能有一些环境依赖的扩展，这个要单独实现。请求路由映射，实现原理就是要让本地的mock server有一个router，能接收所有HTTP请求，然后在router中根据线上的路由约定，实现一套一样的规则，这个也不难，不赘述了。

2、最后数据接口代理。与前端相关的HTTP请求一共就3种响应情况：

渲染页面的请求；

静态资源的请求；

获取数据的请求。

由于实现了router，我们把渲染页面的请求在mock server中处理掉，直接输出本地模板的渲染结果；静态资源的请求直接返回文件内容；而把数据请求代理到测试或者生产环境，本地就不用mock了（当然，如果出现新的接口测试环境没有的，可以追加router，在mock server想响应假数据）

3、一、api管理工具

二、Yapi的参考文档

Yapi的官方参考文档：https://yapi.ymfe.org/index.html

三、Yapi的部署

https://yapi.ymfe.org/devops/index.html

四、Yapi的项目和用户管理

https://yapi.ymfe.org/documents/index.html

五、Yapi的使用

接口列表

数据mock

测试集合

数据传输

六、Yapi的自定义开发

4、第一步注册

第二部：创建项目

第三步：

第四步：接口预览

第五步：编译接口（也就是修改接口 ）

第六步：返回参数的携带

也可以实时编译返回的json数据

还可以修改header头

 在谷歌浏览器窗口可以直接输入当前接口的地址可以访问

在项目中也可以直接调用 不会存在跨域问题 具体原因参考官方文档