macOSで普段開発しているWebエンジニアが、IE11(Internet Explorer)の動作確認をmacOS上で簡単に行う方法

by

@wapa5pow

ogp

最近、Nuxt.jsでフロントエンドを開発しているのですが、IE11でチェックしたくなったときに、Windowsを買わなくても対応できたので共有します。
VirtualBox上で、90日しかライセンスがない、Windowsを動かして確認する方法です。

やりたいこと

  • IE11のチェックをmacOS上ですばやく行いたい
  • Windows上ではなくmacOS上で行いたい
  • IE11だけでなくEdgeもチェックしたい

ダウンロード

事前に以下をダウンロードしておきます。OSのイメージなどあるのでファイルサイズは大きいです。

vm1

インストール

まずはVirtualBoxをインストールします。最初インストールしようとすると失敗しますが、[システム環境設定]=>[セキュリティとプライバシー]から許可してからもう一度インストールするといいです。

次に、WindowsをVirtualBox上に展開します。コマンドラインでzipを解凍します。

$ unzip MSEdge.Win10.VirtualBox.zip

IE11 - Win81.ovaというファイルができるのでダブルクリックしてVirtualBox上に展開します。設定はデフォルトで大丈夫です。
VirtualBox上でWindowsを起動したら、IE11を起動してみます。以下のように検索すればIE11が起動できます。

ie1

Microsoft Edgeはデスクトップ上にあります。

ゲストOSからホストOSのlocalhostを参照してブラウザで確認する

これが今回やりたかったことです。普段、macOS上で、Nuxt.jsを動かして確認しているのですが、VirtualBoxで起動したIE11からアクセスするには、ブラウザに10.0.2.2:3000といれます(ポート番号が3000の場合)。

Tips

以下、知っていると便利なことです

  • WindowsのパスワードはPassw0rd!
  • WindowsのVirtual Machineのスナップショットをとっておくと90日制限をロールバックできる。各種設定したあとに、スナップショットを取るとよさそう。ここによると、コマンドプロンプトを管理者権限で起動してslmgr /rearmと実行すれば有効期限がリセットされる。
  • ホストOSとゲストOS間のクリップボードの共有はここを参考にします。
  • Windowsの日本語化はここを参考にします。
    Windowsの設定は以下からいけます。(数年使っていないのでぜんぜんUIがわからない。。。)

settings1

  • 日本語/英語の入力切り替えはここを参考にして好きなキーに割り当てます