経験知ロゴ

Windows10のBrowserSyncでスマホなど外部から接続するようにする方法

Windows10でBrowseSyncでスマホから接続できるようにする方法

Windows10でBrowseSyncをそのまま使うと、ファイヤーウォールが邪魔をしてスマホなど外部のデバイスから接続できません。

この記事では、Windows10デフォルトのファイヤーウォールで、BrowseSyncの外部接続を通す方法を紹介します。

MacでESETを使っている場合はこちらの方法で接続できます。
Browser-syncでExternalのアドレスにスマホからアクセスできない場合の対策 | 経験知

ファイヤーウォールの設定

Windowsタスクバー左下の検索窓に「ファイヤーウォール」と検索してファイヤーウォールを開く。

詳細設定をクリック。
詳細設定をクリック

詳細設定画面が開きますが、狭いのでウィンドウの横幅を広くします。

「受信の規則」をクリックし、「Nodejs:Server-dide JavaScript」を探します。

「Nodejs:Server-dide JavaScript」という名前の設定は複数あるので、更に、

プロファイルパブリック
操作ブロック
プロトコルTCP

となっている「Nodejs:Server-dide JavaScript」を探す。(下記画像の「プロトコル」はかなり右側にあります。分かりやすいように移動させたためこの位置にあります。)
コメント 2020 07 29 165557

見つけた「Nodejs:Server-dide JavaScript」を右クリックし、「プロパティ」をクリック。

「全般」タブをクリックし、「有効」にチェックを入れ、「接続を許可する」を選択。
全般の設定

次に「プロトコルおよびポート」タブをクリックし、「ローカルポート」の「特定のポート」にBrowseSyncを実行後に表示されるポートの番号を入れて「OK」をクリック。
ポート番号を入力

僕の場合は「3000」と「3001」なので「3000-3001」と設定しています。
ポート番号の確認

これで上記画像に表示されているURLにスマホや他のPCからアクセスすると接続できるようになりました。

おわりに

BrowseSyncは便利なのですが、外部から接続するときに毎回ハマります。

ウィルス対策ソフトを使っている場合は、使っているウィルス対策ソフトのファイヤーウォールの設定を見直せば接続できるはずです。

役に立ったらこの記事のシェアをお願いします

ブログのフォロー・RSS購読は下記ボタンから