Braveでlocalhostにアクセスしたときにhttpsにリダイレクトするのを防ぐ

目次

• Intro
• localhost
• Braveでlocalhostだけhttpを許可する
• localhostは特殊

2024年 ユウトの一人アドベントカレンダーの6日目の記事です。

Intro

Braveでlocalhostにアクセスしたときにhttpsにリダイレクトするのを防ぐ方法のメモです。

localhost

大抵のWebフロントにおいて、立ち上がったdev環境はhttp://localhost:3000/になっているかと思います。

そして使用するフレームワークに応じて、オプションをつけることで、https形式のlocalhostが立ち上がります。

• Viteでは、--hostをつけて（https://ja.vite.dev/config/server-options）
• Next.jsでは、--experimental-httpsをつけて（https://vercel.com/guides/access-nextjs-localhost-https-certificate-self-signed#conclusion）
• Storybookでは、--httpsをつけて（https://storybook.js.org/docs/api/cli-options）

などのようにです。

これらのオプションをつけておけば、https://localhost:PORT/ でアクセスできるようになるので、まだマシかなと思います。

しかし、筆者的にはlocalhostくらい別にhttpでもいいのでは、と思ってしまいます。

Braveでlocalhostだけhttpを許可する

筆者は普段Braveを愛用して使っているので、このブラウザに限ってのみ、http:localhostを許容するようにしました。

やり方は、https://community.brave.com/t/disable-forcing-https/525972/19を見て設定しました。 何個かやりとりをしているので、まとめると以下の通りです。

まず、brave://net-internals/#hstsに遷移します。

すると、以下のような画面になっていると思います。

ここにある、Delete domain security policiesの項目に、localhostと打ち、Deleteボタンを押します。これだけで設定は完了です。

あとはBraveを再起動して、http://localhost:PORT/ にアクセスしてみて、httpsにリダイレクトされなければOKです。

localhostは特殊

ここまで書いておいてなんですが、できればlocalhostも全部httpsでアクセスするようにした方がいいと思います。 詳しくは、ローカル開発環境のhttps化を読んでみてください。

ただ筆者は記事を書く際にサクッと手元で動かしてチェックしたい時とかに、いちいちオプションつけたり設定するのがめんどく無くなってしまったので、 それくらいならhttpでもいいかぁと思って今回設定しました。