Fiddler实现App前后端隔离开发

需求

现在基本的一个App开发流程都是在定好需求后,就开始Agile development。需要客户端与服务端共同商量一套协议之后,服务端和客户端开始并行开发。原则上客户端应该相信服务端,但是事与愿违,经常会出现服务端返回一些并非客户端想要的数据,造成上线后App的各种异常。为了让服务端对客户端造成的影响最小,我们可以借助一些工具来协助我们开发。今天要说的就是Fiddler(http://www.telerik.com/fiddler)这个神器了。

原理

Fiddler算是一个抓包工具,不同的是这个抓包工具只针对于HTTP协议。而且它可以打开一个本地的代理服务器,让手机连接上Fiddler,抓取手机上面的所有HTTP报文(如果搭配上WireShark还可以抓到除了HTTP以外的数据)。

安装

Fiddler安装异常简单:

1、安装.NetFramework(已安装的请忽略)

2、安装Fiddler。(Next即可)

连接手机

要用Fiddler调试手机上面的通信,需要简单的设置一下:

1、点击Tools–>Fiddler Options,选中Connections的选项卡,然后勾选Allow remote computers to connect如图:

2、让手机连接Fiddler的代理服务器,先找到本机的IP地址:在cmd下输入ipconfig命令:

然后在手机上面配置代理服务器,以Android为例,在WIFI高级设置里面有设置代理选项,改为手动:

点击“确定”后,就可以看到在Fiddler里面捕捉到的手机HTTP请求了。是不是很简单。还附带调试报文的效果喔~

伪造请求数据

Fiddler的其他一些功能,比如Filter,Log,Timeline等,读者可以慢慢研究哦。我们今天要说的主角是AutoResponder(自动回复)。顾名思义,就是可以自动返回接口数据。在Fiddler右边第三个选项卡就是AutoResponder。我们只需要在这里配置好规则即可。

点击Add Rule,在Rule Editor处可以自己写上规则,可以使用具体的一个网址,也可以写正则表达式。如果我们在左边报文处有选中某一个选项,则Rule Editor会自动填入左侧报文对应的请求地址。现在我们随便在电脑上面创建一个.json文件,在里面写入接口想要返回的内容,保存后,然后我们可以在最底部的输入框选中”Find a file”来选中定义好的协议文件,如图:

最后点击”Enable automatic responses”,这些规则就开始生效了。我们还可以导出规则,然后给别人使用:选中要导出的规则,右键,选择”Export all”,即可把配置导出,然后给其他人使用了。是不是很方便?

总结

Fiddler的这个功能可以让我们设置一系列的Rule,自己定义请求某一个接口返回的数据。比如我们的服务端地址是10.128.127.10,我们就可以按照接口文档里面定义好的规则创建并且维护一套假数据配置,然后给所有开发客户端的程序猿使用,在并行开发的情况下,效率可以大大加大。我们甚至可以专门建立一个git的repository来管理这份配置文件,如果接口有更新,配置也需要跟着更新。这样完全不需要我们自己在代码或者本地文件里面伪造接口数据进行调试了,直接可以模拟真实环境来写代码,真正的实现Runtime debug。

版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-10-26 18:26:53

Fiddler实现App前后端隔离开发的相关文章

vue+mockjs 模拟数据,实现前后端分离开发

在项目中尝试了mockjs,mock数据,实现前后端分离开发. 关于mockjs,官网描述的是 1.前后端分离 2.不需要修改既有代码,就可以拦截 Ajax 请求,返回模拟的响应数据. 3.数据类型丰富 4.通过随机数据,模拟各种场景. 等等优点. 总结起来就是在后端接口没有开发完成之前,前端可以用已有的接口文档,在真实的请求上拦截ajax,并根据mockjs的mock数据的规则,模拟真实接口返回的数据,并将随机的模拟数据返回参与相应的数据交互处理,这样真正实现了前后台的分离开发. 与以往的自己

[转] 前后端分离开发模式的 mock 平台预研

引入 mock(模拟): 是在项目测试中,对项目外部或不容易获取的对象/接口,用一个虚拟的对象/接口来模拟,以便测试. 背景 前后端分离 前后端仅仅通过异步接口(AJAX/JSONP)来编程 前后端都各自有自己的开发流程,构建工具,测试集合 关注点分离,前后端变得相对独立并松耦合 开发流程 后台编写和维护接口文档,在 API 变化时更新接口文档 后台根据接口文档进行接口开发 前端根据接口文档进行开发 开发完成后联调和提交测试 面临问题 没有统一的文档编写规范,导致文档越来越乱,无法维护和阅读 开

前后端分离开发部署模式

前后端分离开发部署模式 Other 2015-06-13 在开始讨论这个话题之前我们先来认识一下传统的开发模式. 一.传统开发模式 相信很多做过Web开发童鞋应该都会经历这样一种开发模式,利用后端语言提供的模版引擎编写HTML/XML页面,比如: PHP 开发有 Smarty模板引擎 Java web工程有jsp页面 Python 各个Web框架都有各自的模板引擎 NodeJS 的express你懂得 都有一个共同的特点,服务器端后台语言生成解析后的HTML/XML格式返回给客户端,例如浏览器端

关于一次前后端同时开发的体验---从建表开始

作为<关于一次前后端同时开发的体验---从写接口开始>的升级版,这次花掉一个星期,把前后端统统写了一遍,一来近期时间不再奢侈,项目维护期哈哈:二来算是java的入门,这次彻底的被检验了一番.同时感谢强哥在百忙之中抽空对我进行的指导.下面是这个功能点的全部开发过程: [需求描述] 需求:客户增加产品黑名单规则 配置规则:针对需要限制的客户,配置需要限制的产品(如有必要也可以配置相应的国家:默认不配置,限制客户通过该产品走所有国家) 接口协议:customerCode String T 客户编码 

spring boot + vue + element-ui全栈开发入门——前后端整合开发

一.配置 思路是通过node的跨域配置来调用spring boot的rest api. 修改config\index.js文件,设置跨域配置proxyTable: proxyTable: { '/api': { target: 'http://localhost:18080/', changeOrigin: true, pathRewrite: { '^/api': '/' } } } 完整的config\index.js代码如下: 'use strict' // Template versio

2018 Vue+Django API前后端分离开发电商新技术跨域项目实战

课程目标帮助大家快速入门Django REST framework这一个API框架. 帮助大家详细了解Django REST framework中序列化.视图.路由等模块的使用. 帮助大家使用Django REST framework快速开发一套可用的API服务,并且自动生成API文档.适用人群Python开发工程师,后端开发工程师课程简介目前前后端分离的架构设计越来越流行,前后端通过API来实现数据通信.那如何快速开发一套符合RESTful风格的API呢?Django REST framewo

基于RAP(Mock)实现前后端分离开发

看看RAP的官方定义: 什么是RAP? (Rigel API Platform) 在前后端分离的开发模式下,我们通常需要定义一份接口文档来规范接口的具体信息.如一个请求的地址.有几个参数.参数名称及类型含义等等.RAP 首先方便团队录入.查看和管理这些接口文档,并通过分析结构化的文档数据,重复利用并生成自测数据.提供自测控制台等等... 大幅度提升开发效率. RAP的特色 强大的GUI工具 给力的用户体验,你将会爱上使用RAP来管理您的API文档. 完善的MOCK服务 文档定义好的瞬间,所有接口

前后端分离开发与跨域问题

前后端分离 传统开发方式 曾几何时,JSP和Servlet为Java带来了无限风光,一时间大红大紫,但随着互联网的不断发展,这样的开发方式逐渐显露其弊端,在移动互联网炙手可热的今天,应用程序对于后台服务的要求发生了巨大的变化; 传统的项目开发与交互流程: 在传统的web开发中,页面展示的内容以及页面之间的跳转逻辑,全都由后台来控制,这导致了前后端耦合度非常高,耦合度高则意味着,扩展性差,维护性差,等等问题 传统开发的问题如下: 耦合度高 调试麻烦,出现问题时往往需要前后台一起检查 开发效率低,前

Python前后端分离开发Vue+Django REST framework实战

链接:https://pan.baidu.com/s/1YNIw7ayEvRfU9Og4zv97iA 提取码:加Q:1642261812  V信:SH66668888QH 获取 第1章 课程介绍 介绍课程目标.通过课程能学习到的内容.和系统开发前需要具备的知识 1-1 课程导学 第2章 开发环境搭建 介绍系统开发所需的开发环境的搭建, 包括前后端开发所需要的IDE. mysql.navicat.nodejs.cnpm的配置等, 还介绍了如何配置python虚拟环境 2-1 pycharm的安装和