How to make Chrome allow http request to custom local domain?

398 Views Asked by At

I am creating a simple light/dark mode toggle in a create-react-app, with the following code in my <App /> component:

  const [darkMode, setDarkMode] = useState<boolean>(() => {
    const storedDarkMode: string | undefined = Cookies.get('my_dark_mode');
    console.log(storedDarkMode);

    if (storedDarkMode !== undefined) {
      return JSON.parse(storedDarkMode);
    } else if (
      window.matchMedia &&
      window.matchMedia('(prefers-color-scheme: dark)').matches
    ) {
      return true;
    } else {
      return false;
    }
  });

  const toggleDarkMode = () => {
    setDarkMode((prev) => !prev);
  };

  useEffect(() => {
    if (darkMode) {
      document.body.classList.add('dark-mode');
    } else {
      document.body.classList.remove('dark-mode');
    }
    Cookies.set('ap_dark_mode', JSON.stringify(darkMode), {
      domain: 'myname.dev',
    });
  }, [darkMode]);

I have the following in /etc/hosts:

127.0.0.1 localhost.myname.dev

(and I have executed sudo dscacheutil -flushcache, also restarted the computer, FWIW)

I have the following in my React project's .env.development:

HOST=localhost.myname.dev
PORT=3000

When I start the dev server via npm run start, I see the following:

Compiled successfully!

You can now view portfolio_v4 in the browser.

  http://localhost.myname.dev:3000

Note that the development build is not optimized.
To create a production build, use npm run build.

webpack compiled successfully
Files successfully emitted, waiting for typecheck results...
Issues checking in progress...
No issues found.

However, when I attempt to visit http://localhost.myname.dev:3000, Chrome converts the request to https. I do not want to configure https right now, I just want Chrome to allow me to make an http request.

I have entered localhost.myname.dev into the Delete option found at chrome://net-internals/#hsts but that didn't work. I've also tried clearing the browser cache.

EDIT:

You can see Chrome redirecting me to https here: enter image description here

0

There are 0 best solutions below