webpack-dev-serverでdisableHostCheckを使うのはもうやめろ

origamium

Origami

Posted on December 23, 2019

webpack-dev-serverでdisableHostCheckを使うのはもうやめろ

TL;DR

DO NOT USE disableHostCheck. because its potentially vulnerable.
USE host: "0.0.0.0 and useLocalIp. its safe, for now.

ハローこんにちは。disableHostCheck: trueを使うのをやめろ。

disableHostCheckを使うのにはだいたい理由があって、たとえばiPhoneからPC上のlocalhostで動いているサイトを見たいという理由でdisableHostChecktrueにしたりしてアクセスしたりします。

Alt Text

[マシン名].local:[ポート番号]でアクセスするのはiPhoneを使った開発ではよく見る光景ですね。このときdisableHostCheckはだいたいInvalid Host headerを回避するために使います。

しかし、disableHostCheckを有効にするとDNS rebinding attack脆弱性を抱えてしまいますし、実際に webpack-dev-serverのdocumentationでも非推奨 の方法となっています。
代わりに今の所、useLocalIP: trueを使えば解決することができます。

config.devServer = {
    host: "0.0.0.0",
    useLocalIp: true,
}

Enter fullscreen mode Exit fullscreen mode

host: "0.0.0.0"はないと動かないので注意。
この方法を使えばdisableHostCheckを回避できます。自分のローカルIPアドレスを使ってやればアクセスできるので、ネットワークによってURLは変更されますが。

Alt Text

💖 💪 🙅 🚩
origamium
Origami

Posted on December 23, 2019

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related