$cat2koban->blog;

猫の手も借りたい

Macbook で動かしている Rails アプリを IE11 で確認する

環境

windows 環境 (VM) の用意

VirtualBox でも Vagrant でも好きな方を選んで Microsoft の公式ページ から、仮想マシンを立ち上げるためのイメージファイルをダウンロードします。 リンク先の公式ページに行くと、以下の画像のようなボタンがいっぱい表示されていると思います。

f:id:sorehaedamame:20200607230942p:plain

今回は VirutalBox のケースで考えようと思うので、 [VirtualBox >] のボタンを押します。すると MSEdge - Win10.zip なるもののダウンロードが開始されるはずです。 ダウンロードは結構時間がかかります。なのでゆっくりお茶でも飲んで、積み本していた技術書などを消化するなどして時間を潰しましょう。

終わるまで大体3時間ちょっと程かかった記憶...とはいえ、ダウンロードが終わったら設定は楽なのですぐに環境を用意できると思います。 ダウンロードが終わったら解凍して、一旦中身を確認しましょう。画像のように、MSEdge - Win10.ovf と、MSEdge - Win10-disk001.vmdk の二つのファイルがあれば良いです。

f:id:sorehaedamame:20200607232320p:plain

次に[File > Import Appliance] から、解凍したファイルの中にある MSEdge - Win10.ovf を選択します。

f:id:sorehaedamame:20200607231140p:plain

f:id:sorehaedamame:20200607234436p:plain

そのまま [continue] を押せば、あとは VirtualBox が勝手に VM を作ってくれます。以下の画像のように、Win10 環境が作成された様子がメニューから確認できれば、一通り終わりです。

f:id:sorehaedamame:20200607231903p:plain

あとは起動して、パスワード入力画面に Passw0rd! を入力すれば Windows にログインができます。

Windows (VM) の IE11 で Railsアプリを表示してみる

Rails アプリを起動して確認する前に、IE11 ブラウザの検索窓に、 http://(確認したアドレス):(ポート番号)を 入力する必要があるため ifconfig | grep 192 とターミナルで入力し、Windows (VM) 側から Mac 側へ接続確認ができる IPアドレスを確認しておきましょう。

$ ifconfig | grep 192
    inet 192.168.50.1 netmask 0xffffff00 broadcast 192.168.50.255

確認できたら、Rails アプリを起動してみます。下記のコードは、 Procfile と言って、foreman が読み込む設定ファイルのようなものです。著者の環境では foreman という gem を利用してるので、少し起動の仕方が一般のやり方と異なります。この設定ファイルの通りだと、 bundle exec foreman start とすると、puma と, webpack-dev-server が起動します。web: の部分に書かれている --binding=0.0.0.0 の意味については、こちらの qiita の記事 が参考になるかと思います。Macbook で立ち上げた Rails を、 VM 上で開いたブラウザ (今回だと IE11) で確認する際に、設定する必要がある Rails の起動オプションなので、意味を理解しておくと良いでしょう。

web: bundle exec rails server -p 5000 --binding=0.0.0.0
client: sh -c 'rm -rf public/packs/* || true && bin/webpack-dev-server'

起動が確認できたら、早速 windows で確認してみましょう。

f:id:sorehaedamame:20200608003730p:plain

アプリのログイン画面が表記されていますね。著者が用意したアプリはログイン画面が用意されてあるのでこのようなページが最初に表示されていますが、バニラな状態の Rails アプリで試したりすると、おなじみ「Hello Rails」などのメッセージが表示されていることかと思います。

以上が、 Macbook で動かしている Rails アプリを IE11 で確認する方法でした。