高效的代理工具hiproxy-上

1前言

作为前端开发工程师，我们会经常遇到一些环境问题。比如本地调试线上页面、跨域、DNS缓存、网络请求抓包、HTTPS请求开发调试以及证书等等。为了解决这些问题，我们需要使用hosts、Nginx、Fiddler/Charles以及各种各样的hosts切换管理工具等。在使用这写工具的同时，还存在一些问题需要解决。

我们每天都要花费很多时间在环境的配置、切换问题上，因此需要一个更好的方案来统一解决这些问题。

hiproxy就是为了解决这些问题而生。这篇文章的内容主要分为三个方面：hiproxy诞生的背景（现有开发模式反思）、hiproxy介绍以及现壮和未来规划。

2现有开发模式反思

我们每天都会面临多套环境，比如线上环境、Beta环境、Dev环境以及本地开发环境等，这里统一分为两类：线上环境和测试环境。

系统hosts

正常情况下，我们请求资源的时候，走的是线上环境。而我们在开发调试的时候，是不希望这样的，我们需要在不修改请求地址的情况下，将请求定向到测试环境。那么，我们应该怎么做呢？

大家都应该能想到使用hosts就能解决这个问题。hosts使用简单，而且不需要安装任何第三的工具。

Nginx

随着时间的推移，公司的项目越来越多，我们需要维护的项目也越来越多。假设我们为特定域名配置hosts，指向本地开发环境，这个域名下所有请求都到了本地。要使页面各种资源能访问，我们就需要在本地搭建一套完整的运行环境。

但是，不同的项目可能需要使用不同的端口号，加上复杂的后端工程以及数据库，我们不希望也不太可能在本地搭建起一套完整的环境来运行各种依赖的项目。我们只希望把我们关心的这些项目（大部分都是前端项目）在本地运行起来以便开发调试，其他的项目（大部分是后端项目）则使用线上环境。

这时候，我们又该怎么做呢？

聪明的前端开发工程师又想到了使用Nginx来解决这个问题。Nginx是一个优秀、高效的HTTP和反向代理服务器，可以更精确地对请求做代理。

可以说Nginx比较完美的解决了我们遇到的问题。

但是，我们在使用Nginx的过程中，也存在一些不完美的地方，主要分为两个方面：需要hosts配合、每个人都需要各自在本地维护一套Nginx配置，互相拷贝配置文件。

需要hosts配合

前面提到过，正常情况下，请求资源的时候，走的是线上环境。虽然在本地安装了Nginx，也配置了各种个样的请求代理。默认情况下，浏览器是不会请求到本地Nginx服务的，要请求到本地Nginx，需要修改系统hosts。

由此可见，hosts是非常非常的重要，也正是因为hosts的重要性，产生了各种各样的hosts切换、管理工具。

互相拷贝配置文件

此外，大家现在的习惯是，各自在本地维护一套Nginx配置。最初，由一个工程师在本地配置好Nginx，然后其他工程师从他这里复制一份配置，稍作修改在本地运行。如果有新成员加入对应的项目，也是从其他人那里复制一份。

这样的坏处在于，每个人复制配置文件、效率比较低。而且一旦环境变化，其中一个人修改之后，其他人的配置并不会随之被修改，更新不及时。

其他问题

在使用hosts／Nginx以及hosts切换管理工具的同时，还会存在其他问题，比如DNS缓存、HTTPS请求调试以及证书生成和信任问题等。

既然我们使用了这么多工具还有这么多问题，我们在想：到底有没有一种更好的方法来解决这些问题？

要是有一个工具，能一次性解决这些问题，那该多好啊！

于是，hiproxy就这样诞生了。

3hiproxy介绍

hiproxy是一个基于Node.js开发的轻量、可扩展的代理工具。接下来主要从四个方面去介绍它。

特点

hiproxy的特点，主要总结为四点：

轻量可扩展：hiproxy依赖的第三方库比较少，安装快速；支持扩展命令／指令／页面。详情可以查看插件开发指南。

复用现有开发配置习惯：hiproxy采用了大家以前熟悉的hosts和Nginx风格的配置，最大程度地复用了大家之前的开发、配置习惯。学习成本低，使用起来更加轻松！

HTTPS证书自动生成与管理：hiproxy可以扮演CA角色，生成根证书。并且能自动根据每次请求的域名信息，生成相对应的域名证书。

跟浏览器高度融合：hiproxy在启动服务的时候，可以贴心地打开一个新的浏览器窗口并自动配置好代理，省去了用户自己设置代理的步骤。

基本使用

这里简单介绍一下hiproxy的使用步骤，如果需要查看详细的使用文档，请访问hiproxy的文档网站：

第一步：启动hiproxy服务：hiproxy是一个命令行工具，我们可以进入到工作空间（workspace），然后启动一个代理服务。

第二步：查找配置文件：启动之后，hiproxy会自动查找工作空间中所有项目下的配置文件，做语法解析并转换成hiproxy内部可使用的代理规则树。

第三步：打开浏览器窗口：然后hiproxy会打开一个浏览器窗口，并自动为我们配置好代理。在Chrome中，可以访问来查看已生效的代理。这个窗口是独立于其他浏览器窗口的，这配置的代理不影响其他浏览器窗口。

第四步：开发调试：接下来，我们就可以使用这个浏览器窗口了。这个浏览器窗口中的所有请求只要配置了对应的代理规则，hiproxy都会亲自去处理。

配置文件

hiproxy推荐把配置文件存放到项目中并提交到Git，与团队中其他的成员共享配置。如果是简单的配置，可以采用hosts，而比较复杂的配置，可以使用rewrite。

hosts可以看作一个增强版的系统hosts，除了系统hosts语法之外，hiproxy也扩展了hosts语法，支持端口号。

示例：

对于复杂需求的配置，hiproxy采用rewrite配置文件，参考了Nginx配置语法，大部分语法跟Nginx一样。主要特点：

语法跟Nginx配置语法类似；

支持正则表达式／分组；

支持请求、响应内容修改；

支持内置变量；

示例：

跟之前的对比

DNS缓存问题：之前修改系统hosts后，由于DNS缓存的存在，需要等待缓存过期或者重启浏览器。使用了hiporxy，更改配置文件之后，hiproxy会自动更新，不需要重启，刷新浏览器即可生效！

配置文件团队共享：之前每个人本地维护自己的hosts／Nginx配置文件，维护成本高，更新不及时。而hiporxy推荐把配置文件放到项目中并提交git，团队共享。缩减维护成本，提高生产力。

https证书问题：之前用复杂的OpenSSL命令生成自签名证书或找他人新增域名，证书不被信任。而hiporxy能自动生成证书，不用自己新增域名。唯一要做的就是导入一次根证书。详细的配置请查看SSL/TLS证书配置。

统一解决痛点：之前每个人都要维护hosts、使用Nginx和一些其他的辅助工具。使用了hiproxy，可以不再用使用各种工具维护系统hosts，不再需要用nginx。

4hiproxy现状和未来规划

现状

开源：hiproxy现在已经开源，所有代码和文档都在github：。欢迎大家star、为hiproxy贡献代码或者给出建议。

测试：从代码层面来讲，覆盖率已经达到了90%以上，基本使用的case已经全部覆盖。

文档：现在我们为hiproxy编写了主要的文档：，但是目前文档中可能存在一些细节方面的缺失，我们会不断完善。

维护：目前主要是我(@zdying)、狼叔(@i5ting)、zhouhailong、huaziHear和其他几个贡献者在维护，我们会长期维护，欢迎大家使用hiproxy。

插件：目前我们为hiproxy开发了一个Dashboard插件，可在线管理hiproxy的配置文件，详情可以查看hiproxy-plugin-dashboard;

未来规划

测试／文档：hiproxy会不断完善测试，争取代码覆盖率达到100%，添加更多的Case。编写更加完善细致的文档，方便大家查阅。

更多实用插件：hiproxy未来会有更多实用的插件、指令和CLI命令，解决更多实际的问题。比如可编程mock、网络请求抓包等。

性能：hiproxy会不断改进代码、优化数据结构和算法，进一步提升性能。

5最后

hiproxy正处于成长时期，欢迎大家关注并使用hiproxy并提出宝贵的建议，让hiproxy更适合大家、更加强大。同时也希望大家能为hiproxy贡献一些源代码或者文档的编写、翻译。

hiproxy地址：;hiproxy文档：