切换代理目标工具

简化前端开发多套接口环境切换步骤
通过环境变量控制代理地址切换

环境配置

1. 安装npm install switch-proxy-target -g

2. 初始化配置工具

用户目录下配置

❯ switch-proxy-target init  
init setting /path/to/cwd/.sptrc.json  

3. 配置工具参数,编辑/path/to/cwd/.sptrc.json:

$schema该属性配置可以给开发工具提供json配置提示

{
  "targets": [
      {
          "name":"代理目标地址1",
          "hostname":"target1.example.org"
      }
   ],
  "syncHosts": [
      "选择目标需要同步的hosts域名,如：example.org"
   ]
}

4. 修改项目proxy.conf.js配置中target:

{
    // ...
    target: `https://${process.env.PROXY_TARGET||'192.168.1.1'}`
    //...
}

5. 增加package.json的scripts（可选配置）

{
    "scripts":{
        //...
        "start": "ng serve",
        "start:switch": "switch-proxy-target run \"npm start\""
        //...
    }
}

功能特色

一键选择代理环境执行命令

• switch-proxy-target run "npm start"或 npm run start:switch（需要环境配置5）

❯ npm run start:switch

> [email protected] start:switch /project/example/
> switch-proxy-target run "npm start"

? Please select the proxy target: 3环境:example.org   
----------Start detecting target accessability and fetch ip------------

正在 Ping example.org [192.168.1.1] 具有 32 字节的数据:

来自 192.168.1.1 的回复: 字节=32 时间=72ms TTL=62

192.168.1.1 的 Ping 统计信息:
    数据包: 已发送 = 1，已接收 = 1，丢失 = 0 (0% 丢失)，
往返行程的估计时间(以毫秒为单位):
    最短 = 72ms，最长 = 72ms，平均 = 72ms

ok !
----------Start setting proxy target------------
Create an environment variable "PROXY_TARGET=192.168.1.1"!

> [email protected] start:switch /project/example/
> ng serve

...

一键选择环境更新hosts(需要管理员权限)

• switch-proxy-target hosts

❯ switch-proxy-target hosts 

? Please select the proxy target: 3环境:example.org   
----------Start detecting target accessability and fetch ip------------

正在 Ping example.org [192.168.1.1] 具有 32 字节的数据:

来自 192.168.1.1 的回复: 字节=32 时间=72ms TTL=62

192.168.1.1 的 Ping 统计信息:
    数据包: 已发送 = 1，已接收 = 1，丢失 = 0 (0% 丢失)，
往返行程的估计时间(以毫秒为单位):
    最短 = 72ms，最长 = 72ms，平均 = 72ms

ok !

sync hosts file example.org ok!

一键选择代理环境执行命令并同步修改hosts文件（需要管理员权限）

• npm run start:switch -- --syncEtcHosts

❯ npm run start:switch -- --syncEtcHosts

> [email protected] start:switch /project/example/
> switch-proxy-target run "npm start" --syncEtcHosts

? Please select the proxy target: 3环境:example.org   
----------Start detecting target accessability and fetch ip------------

正在 Ping example.org [192.168.1.1] 具有 32 字节的数据:

来自 192.168.1.1 的回复: 字节=32 时间=72ms TTL=62

192.168.1.1 的 Ping 统计信息:
    数据包: 已发送 = 1，已接收 = 1，丢失 = 0 (0% 丢失)，
往返行程的估计时间(以毫秒为单位):
    最短 = 72ms，最长 = 72ms，平均 = 72ms

ok !
----------Start setting proxy target------------
Create an environment variable "PROXY_TARGET=192.168.1.1"!

> [email protected] start:switch /project/example/
> ng serve

...