Cutting host is normal for normal development, but the “hard to cut host” problem has not been solved, because manually changing the host file will cause many (system DNS, browser) cache problems. Often hear xx say “I this is good ah, you host has a problem…”

I’ve always used Fiddler to toggle host on Windows, which many people may not know about. The essence of his implementation is to use proxy mapping to implement host switching. The biggest advantage of this is that there is no delay, the experience of the second cut to host is very good, and it is system level, that is, other browsers can also be used (provided that the browser proxy is set to system).

However, since I recently switched to the MAC development environment, I found that the solutions under MAC are not perfect, or do not fit my requirements. Nothing more than the following:

Physically modify the host file

IHosts, Switchhosts, things like that, but as far as I know there’s a delay

The packet capture tool agent cuts the host

For example, Wireshark and Charles under MAC are said to be powerful tools, but I am not used to them, and I have very small needs. Fiddler for MAC works, but the experience is terrible and the interface sucks

Browser plug-in proxy cut host

Like Chrome Chrome-host-switch, Switch Host Plus, etc., tried the effect is very ideal. The fly in the ointment is that the experience is not good, only the label is not grouped, when the label is cut into groups of people very painful

After a quick look at the implementation of Switch Host Plus and the fact that I had written a Chrome plugin before, I decided to build my own wheel. Chrome plugins based on HTML, CSS and javascript are naturally suited to the front end

As I have been watching react related things, I just used it to practice my skills. Technical selection is basically a ready-made framework to use on the line

  • React & Redux builds the whole application
  • Bulma. CSS is a compact CSS framework
  • LocalStorage data is directly written to the localStorage
  • Create React app Builds a packaged application

Application screenshots

function

  • Second cut host No delay 😎
  • Based on the Chrome agent ❤️
  • Compatible with socket proxy 🤔
  • Simple and easy to use, no redundant function 👏

The installation

  • Chrome App Store (suggested)
  • Download the.crx file from Chrome. Open chrome://extensions/ and slide the.crx file into the installation

use

Host proxy

This rule is consistent with the host file rule

192.168.100.1 your.domain.com your-anther.domain.com
Copy the code

Socket proxy

Add the following rules to a new group (modify according to your actual situation)

SOCKS5 127.0.0.1:1080
SOCKS 127.0.0.1:1080
Copy the code

The source code

Github(MIT)