拦截器：你在浏览器中自己的模拟服务器

在开发过程中，很多时候，前端开发人员不得不等待后端开发人员提供一个API来进行工作。即使在提供了API之后，如果前端团队想要一套不同的数据来工作，他们又需要等待修改和托管。我们，前端开发者诉诸于一些技术，如将数据存储在一个变量中或使用模拟的API。

为了克服这个问题，我们正在开发一个浏览器扩展Interceptor ，它可以让你定义你自己的响应，每当浏览器从一个特定的URL请求数据时，就会用模拟数据代替服务器的数据返回给你。

拦截器的作用

假设我们正在开发一个简单的网络应用程序，它试图自动完成我们正在输入的国家的名称--我们会这样编码它。一个'onkeyup' eventListener 被添加到input 元素中，每当我们输入一个字符时，一个XHR 被触发到restcountries.eu，以查询所有包含所输入字符的国家名称。服务器返回一个包含国家名称的对象数组。我们进一步循环这个数组，并创建一个HTML string ，附加到父ul 。

倾听请求

如果你进入上述jsbin的全屏模式，打开Interceptor ，通过点击START LISTENING 按钮开始监听请求，并输入任何字母，那么Interceptor 将列出我们发送给restcountries.eu API的所有请求。由于我们是在'onkeyup' 事件上发出请求，所以发射的请求数将等于输入的字符数。下面的截图显示了输入IN 时发出的请求列表。如图所示，请求的数量显示在一个小徽章上。蓝色的徽章标志着拦截模式是ON ，这意味着Interceptor 将返回所有被拦截请求的模拟数据。当把拦截模式切换到OFF 状态时，徽章图标变成red ，所有的请求都将查询后台服务器，而不是被扩展拦截。

拦截请求

假设有人想在输入a ，只显示一个名字Afghanistan ，而不是许多国家的名字以字母a 开始。

下面的gif演示了如何拦截相应的请求，并为上述用例改变其响应。

本README描述了该扩展的所有可用功能。我们目前支持Chrome和Firefox浏览器。