ChromeBookのLinuxで立てたローカルサーバにアクセスする方法

はじめに

最近初めてChromeBookを購入し、早速Linux環境を使って開発をしてみよう！と思ったのだが、いつもの感覚でLinux側で立てたローカルサーバーlocalhostにChromeOS側のブラウザからアクセスしたところ、CONNECTION_REFUSEDが表示されアクセスできなかった。まだネット上に情報が少なく、解決に少々時間を要したため備忘録として投稿してみる。

使用環境

ASUS ChromeBook Detachable CM3
ChromeOS 90.0
Linux(Debian) ARM64bit版

解決方法

端的に言うとローカルサーバーを立てる際にLinux側(ChromeOSにホストされているcrostiniというコンテナ？)のIPアドレスを指定して立て、ブラウザでlocalhostではなく直接そのIPを叩くことでアクセスすることができた。

Linux側のIPアドレスを調べる

ターミナルにて以下を実行し確認する。

hostname -I

このIPアドレス（おそらく100.115.92.xxという形式）をコピーしておく。

ローカルサーバーを立てる

冒頭にも書いたが、ここでホストをデフォルトのlocalhostのままではなく先程確認したIPアドレスに指定するのが重要！ 今回はnpm（nuxtのプロジェクト）なので以下の通り。
参考：Nuxt公式ドキュメント

HOST=100.115.92.xxx npm run dev

ちなみにfirebaseのプロジェクトなら

firebase serve --host 100.115.92.xxx

ブラウザからアクセス

ブラウザからアクセスする際もlocalhostではなく先程指定したIPアドレスを使い100.115.92.xxx:{PORT番号}へアクセスすればOK！

またはpenguin.termina.linux.test:{PORT番号}でもアクセスできた。

補足＆余談

penguin.linux.testとやらについて

ブラウザでローカルサーバにアクセスする際に、IPアドレスの代わりにpenguin.linux.testやpenguin.termina.linux.testとしてもアクセス可能という情報があったため試してみたところ、後者のみアクセスすることができた。これについてはChromeOSのアップデートによる仕様変更も絡んでいる？という情報もあり真相はわからず...

Linux側のIPアドレスの調べ方について

上記で紹介した以外にも、ChromeOS側のシェル（crosh）で確認する方法もあるようです。

Ctrl+Alt+T でcroshを起動する。

vmc start termina 

でターミナルの表示が(termina) chronos@localhost ~ $へと変化したら、lxc lsというコマンドを実行する。すると以下のようにコンテナのIPアドレスの一覧のようなものが出てきて、確認できる。

+---------+---------+-----------------------+------+------------+-----------+
|  NAME   |  STATE  |         IPV4          | IPV6 |    TYPE    | SNAPSHOTS |
+---------+---------+-----------------------+------+------------+-----------+
| penguin | RUNNING | 100.115.92.xxx (eth0) |      | PERSISTENT | 0         |
+---------+---------+-----------------------+------+------------+-----------+

はずだったが、私の環境ではlxc lsと打ち込んで実行しても-bash: lx: command not foundのように入力した文字「lxc ls」が「lx」と解釈され？思うように実行できないような現象が発生した。日本語入力に関係する不具合かなと個人的には思うが詳細不明。
仕方ないのでブラウザやメモ帳で「lxc ls」と入力したものをcroshにコピペしたところきちんと実行された。