当谈到模拟时，我们不得不谈一下前端和后端的分离。H5扑克牌源销售，H5扑克牌源销售前端和后端不分离的理想情况整个人才队伍对产品和基础设施的维度开发，效率是最高的。近年来，企业的复杂性越来越高，很难招募到真正的全员人才。企业只能退到下一步，把开发分成细节，让每个人都做自己最擅长的事情，前端负责UI的显示和交互，后端负责业务逻辑、性能等，从而在ar中实现更高的效率。同时，由于分工的细化，导致前端和后端之间的通信成本增加，对代码的控制通常在后端，稍加修改就可能导致前端和后端之间的重复通信，降低de。开发效率，导致前端和后端解决方案的分离。前端和后端分离通过协议一致和使用协议来同时开发。通信的最后阶段是联合调试，节省了大量的时间。    分离的主要性能是视图层的控制被移交给前端。对于一些部分应用类项目，前端和后端负责各自的部分，直接达到分离状态。而一些受SEO和用户体验影响的显示类系统只能实现部分分离，如FIS方案。无论哪种状态分离，都需要协议来实现业务的并行开发。对于前端，开发的效果更依赖于数据。为了最小化联锁时间，我们需要根据协议生成数据，这也是模拟的要求。    使用模拟开发过程借用YAPI流程图（YAPI用于模拟服务）：    首先，前端和后端是定制的接口，每个接口都是在定制后开发的，前端开发人员使用模拟数据进行开发，在完成实际环境的开发调试后，找出开发中存在的问题，然后进行测试、联机以及ot她的过程。    常用模拟模式1。硬编码代码层直接将数据写入代码（或单独的文件，手动引入的代码），修改代码跳过接口请求，直接使用数据。这种方法的最大问题是耦合性太强，每次格式化时业务代码都与模拟数据混合l提交，以确保代码数据指向右边，否则将产生神奇的结果。同时，它不会真正发出网络请求，并且与真实环境不同。建议只有在没有其他方法的情况下才使用它。    2。用于代码的Ajax库的拦截分为本地服务器和其他服务器。与硬编码相比，拦截通过简单地引入拦截的代码来将请求转发到本地文件或其他服务器，减少了模拟数据和业务代码之间的耦合。方案是需要定制插件为各种库所用的代码，初始成本高；同时，存在一些代码入侵，需要确保库中的代码是正确的。    拦截数据文件：最典型的是Mock.js，通过这种方式，我们可以自由灵活地编写数据，并且mock的数据文件可以与仓库同步，从而可以进行下一次开发。    拦截和更改请求：这是因为服务器的URL与本地URL规则不同，需要根据规则进行转换。这种方法更接近实际情况，并且产生跨域，需要服务器提供相应的头部。    三。所有接口的统一前缀。此方法根据特定的库函数（或实现相同效果的代码结构）将接口前缀直接添加到公共文件。与先前拦截和更改请求类似，但是更简单，只需更改前缀即可，并且还存在代码侵入的问题。n.名词    4。使用其他工具有两种方法：使用本地或软件数据和代理转发。    使用本地或软件数据：最常见的数据，如fiddler、charles、whistle等，可以向指定内容返回请求。主要问题是配置相当繁琐，所有操作都在机器上，并且很难同步。    代理转发：这种方法非常接近真实环境，毕竟，服务器中的纯静态文件也需要代理转发。有更多的工具可用，您还可以使用支持代理转发的开发工具或使用上述工具来转发数据这种方法的最大优点是：没有跨域、实际请求和完全隔离的业务代码。    与上述方案相比，最好的选择是代理转发，其次是代码拦截。拦截数据文件的一个优点是模拟数据和仓库可以同步，但是当不同的分支被开发时，模拟数据会冲突。E服务器最方便，但它需要MOCKServer，这取决于开发。    有些模拟有很多工具模型的实现，基本上每一组复杂的前端开发工具都有自己的模拟机制。近年来，随着NoDEJs的普及，前端可以很容易地实现自己的MoCKServer，因此仍然很难列出所有的。其中有一些比较有名的字符工具。    1。Sw.er address: {https:sw.er.io}.：当您提到mock时，您必须提到sw.er（https:_/sw.er.io    Sw.er是OpenAPI规范（OAS）API开发人员工具的世界最大框架，支持跨整个API生命周期的开发，从设计和文档到测试和部署。    设计不专门提供模拟服务，但是可以为模拟服务提供服务器模板代码并且自己构建模拟服务器的RESTFUL型API是非常有用的。结果。    2。嘲弄。JS地址：https:/github.comuy./Mock/tree重构简介：THX团队制作，用于代码库拦截的本地文件模拟数据规则，在更流行的解决方案之前，许多工具已经集成了Mock JS语法，仓库不再更新。Rap2地址：https:github.com/thx/rap2-delos.：与THX团队一起生产，是rap0.x的升级版本，使用nodejs和关系数据库开发，与mock.js语法兼容。该接口简单且交互，支持接口编辑API。URL设计不同于原始URL，所以我们需要使用代码基拦截模式。4。API地址：http:/APP.APIALI.IO／引言：此模型在国外使用较多，功能更强大：    io平台具有用于协同设计、实时API仿真、快速源代码生成、自动测试和代码调试的开放源代码设计工具。最重要的是能够模拟在线测试，因为该平台有仿真服务器测试服务，可以在线测试和验证所设计的程序。    5。Easy-mock Address：https:/.-mock.com/.：搜索汽车，rest API仿真，基于mockjs语法，可以从sw.er.6生成简单数据。Yapi地址：http:/yapi.qunar.com/getfamiliar.html简介：团队使用nodejs+mongodb开发在哪里完成这项工作，主要特性：    基于JSON5和MOCKJS，定义了接口返回的数据结构和文档。通过特权设计的乘法和扁平化提高了效率，保证了大型企业级项目的管理，也保证了邮递员式接口调试的使用方便和自动化测试。st过滤规则，返回预期数据，支持邮递员、har、大摇大摆的数据导入免费开源，内部网部署，信息不再害怕泄露RAP2和Yapi的一些比较访问的模拟服务器与各种非常方便的使用模拟服务器，想访问的是verMyCoServer的一般使用规则：    URL是相同的。直接代理转发与URL的后半部分相同。URL规则是不同的，如果您直接前缀URL，或者您需要身份验证。使用封装的Ajax库（如jquery、axios或fetch库）需要拦截和转发拦截。有不同的实现方式。如果使用支持模式（如axios），拦截代码相对简单，只需在t.他在中间，指向mockServer或mockjs文件。参见以下代码（以下代码取自其他库，如rap或RAP2）。    函数包Axios（AXIOS）{var URL＝var OLDReQuest= {}}var路由＝假AXIOS。拦截器。请求。函数（CONFIG）{URL= CONFIG。URL配置。URL= http:/root / MoCKjsDATA/PrimeDe+URL；OLDReQuest=对象。为某些不支持或本机方法获取分配函数({}，config)config;.(error){.{Ise..(error)；axios.intercep....use(function(res){return res;function(error){return Promise..(error);}})，它通过覆盖实现(https:/github.comwen龙火/RAP2 DELOS  BLUB/主/公共/ LIBS/FETCH.RA）P.JS：    （RAP，FETCH）{if（！）读取控制台。警告（当前环境不支持FETCH）返回}（如果）！RAP）{控制台。警告（请首先介绍RAP插件）返回}让Next＝FETCH让查找=设置= GT；{for（让RealStid ID在RAP中）。接口（{）（RAP）。接口{ReaveToRyId}{if（ITF）。方法。ToupPase{（）方法。ToupPase{（））ITF。url设置=设置设置。URL）{返回对象。赋值（{}，ITF，{ReaviRoID}}} } } } } } } } } } } }} } } } } } }窗口。FETCH=函数（URL，设置）{//Ajax（设置）：（Type Url StutoReStudioStudioStudioEdvestRooStudio=＝Object）设置{{SETStase=对象。赋值({{{{method：GET}，itf，{GET)同时，有必要研究两者之间的关系。赋值（{方法：GET }，设置，{URL}）var匹配=查找（设置）如果（！）比赛结束后返回。调用（窗口，URL，设置）让重定向＝${rAP。协议}：/${rAP。主机}/APP/MOCK/${Matt。ReaveTyryID}/${Matt。方法}/${URL}设置。证书=设立。方法=获取设置。数据类型= JSONP控制台。日志（取${匹配）。方法}{$Matter。下一步返回URL}= Gt；${ReDe}}。调用（窗口，重定向，设置）}（窗口）。饶舌，窗口。获取）通过直接添加指向HTML结尾的脚本标记（可能存在部分拦截），这些插件易于使用。需要引入多个标签。    修改全局URL表达式适用于需要添加到MOCKServer请求的BaseLL类型。对于支持BaseLL类型的库，设置BaseLL。例如，BaseLL是：    http://yapi .demo.qunar .com /MOCK／1304：我们的商业代码中所要求的API是：    /Web/API，那么我们实际请求的地址是：    http://yapi .demo.qunar .com /MOK/ 1304 /Web/API，因此我们应该将其设置为（例如，AXIOS）：    导出默认AXIOS=新AXIOS（{BaseURL:Posiv.）。EnvNoDeEnEv=＝=开发http://yAPI。演示。库纳尔com/mock/1304:}）如果不对环境敏感，则需要在提交之前将基本URL设置为空，以避免影响仓库代码。    对于不支持BaseLL的库，建议封装该方法并单独保存BaseLL。    代理转发是在使用支持转发的开发工具的前提下实现的，如果不支持，则需要使用Fiddler、Charles和其他工具进行规则重写。    WebPACK DEV服务器：    代理：http:localhost:3000}代理：{api：target：http:localhost:3000 localhost:3000 changeOrigin changeOrigin注意：changeOrigin是一个http-proxy设置选项，它将主机转换为请求头中目标服务器的地址或IP以解决服务器找不到re的问题询问地址。    NGNIX（没有人应该使用它）：    {位置API{proxy_set_头X-代理_set_头部X-X X X前进前进前进的X X代理363636API{proxy代理X X X X X X X X X X X X X X X X X X X X X X代理_set_set_set_set_头部-代理_X X X X X X X X X X X前进前进前进前进原型-原型-原型-原型-原型-原型-原型-原型-原型-HTtHTHTHTtps代理-HTtps-HTtpsXXXXXXXXXXHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTtredi_host：11011；代理；}；在右边的选项卡页中选择自动回复选项卡。    ReXEX:^ http:/ServExist.com（/*）http://www-task.com：3838 /$1MOK模拟不能取代链接的一些问题。虽然模拟数据太真实，无法实现与后端接口相同的逻辑，但只能通过联锁来检测一些逻辑检查或业务问题。COOK不是测试的替代品。模拟本身是为了加快开发速度，对于需要高代码质量的项目，模拟服务只能提供一些案例。总结使用模拟的前提是有明确的前端和后端接口协议，使用近似。RiTE工具可以提高开发效率。强大的模拟服务可以使你对开发的代码更有信心。即使没有后端，新手也可以通过模拟来熟悉先前的业务接口，或者查看特殊的接口以最小化对后端的依赖性。    上面介绍的几种mockServer都是由nodejs开发的。与其他语言开发的mock服务相比，JSON格式已经成为主要的编写格式，虽然易于使用，但是编写起来不方便（json5格式在一定程度上提高了编写体验，但是与yaml等格式相比，它还是不够的。同时，不同的业务条件，有针对性的选择不同的平台，推荐使用RAP2和yapi，前者界面更简洁，操作更方便，后者更强大。如果您有什么特殊需求你可以自己写一个，练习你的手。