以前、Cloud9 仮想環境で View and Data API チュートリアル で、クラウド上の仮想開発環境構築サービスである Cloud9 を利用した Forge サンプルのテスト方法をご紹介したことがあります。当時は、まだ Forge 登場前で、 View and Data API が現在の OAuth API、Data Management API、Model Derivative API、Forge Viewer に分離される前のサンプルを使ってのご案内でした。
Cloud9 は、Web ブラウザをフロント エンド ユーザ インタフェースに持つ、非常に便利なクラウド時代らしい統合開発環境ですが、前回のブログ記事の公開後、一昨年、Amazon Web Services(AWS) に買収されて、昨年、AWS Cloud9 として生まれ変わっています。AWS に統合されて操作手順も変わってしまっているので、今回は、Forge サンプルを使って改めて利用手順をご紹介したいと思います。
- AWS Cloud9 を利用するには、https://aws.amazon.com/jp/ にアクセスして、画面右上の [コンソールにログイン >>] ボタンから AWS マネジメント コンソールにログインしてください。
もし、AWS アカウントをお持ちでないようであればアカウントを作成してください。アカウント作成は、ログイン ページにある 別のアカウントにサインインする をクリックして、次に表示されるページの [新しい AWS アカウントの作成] ボタンから作成することが出来ます。もし、この手順でアカウント作成が出来ないようなら、AWS Cloud9 の開始方法 もご参照ください。
- マネジメント コンソール ページが表示されたら、画面下部の開発者用ツールにある Cloud9 をクリックします。
- Cloud9 ダッシュボードが表示されます。次に、[Create environment] ボタンをクリックして、新しい仮想環境を作成します。
- 仮想環境の名前と概要説明を入力します。この情報は複数登録出来る Cloud9 仮想環境を識別するもので、あまり深い意味はありません。次のページが表示されたら、環境の名前(Name)と説明(Description)に任意に記入後、[Next step] ボタンをクリックします。
- Cloud9 を実行する EC2 インスタンスを新規に作成、指定していきます。ここでは、可能な限り無償枠での利用を想定しているため、既定値のまま最小構成になるようにしています。いままで一度も AWS サービスを利用したことがない場合には、Network settings の VPC と Subnet 欄が空白になっているはずです。その場合、[Create new VPC] をクリックして、画面の指示に従って Cloud9 で使用する VPC(Virtual Private Cloud) を作成してください。作成後には、VPC 欄と Subnet 欄が設定されます。すべての設定が完了したら、[Next step] ボタンをクリックします。
なお、AWS Cloud9 EC2 インスタンスには、Git などのよく使用される開発ツールがあらかじめインストールされています。また、Node.js や Python などの多くの一般的なプログラミング言語の言語ランタイムとパッケージマネージャも含まれているので、以前の Cloud9 のように、環境作成時のそれらを個別に指定する必要はありません。 - ここまでの設定を反映したプレビュー ページが表示されます。問題なければ [Create environment] ボタンで環境を構築を開始します。
次の画面が表示されたら、環境の作成中であることを意味します。環境の構築にはしばらく時間がかかります。 - 環境が作成されると、次のようなページが表示されます。画面下部の Bash を使って、新しい Forge Viewer チュートリアル改定版 ~ その1 でご紹介している Forge サンプルを GitHub リポジトリから Cloud9 環境にクローンしていきます。
- 新しい Forge Viewer チュートリアル改定版 ~ その1 の 6. にある git コマンドを Bash 上に入力して実行します。git clone https://github.com/Autodesk-Forge/viewer-nodejs-tutorial.git と入力してください。
- 新しい Forge Viewer チュートリアル改定版 ~ その1 の 7. の処理を実行します。viewer-nodejs-tutorial フォルダが作成されていることを確認の上、コマンド プロンプトで cd viewer-nodejs-tutorial と入力してカレント フォルダを変更してください。
- 新しい Forge Viewer チュートリアル改定版 ~ その1 の 8. の処理を実行します。ノード パッケージ マネージャ(npm)を利用し、package.json 内に記載された依存関係に沿って 、Node.js 機能を拡張するパッケージ(ミドルウェア)をインストールしていきます。 npm install と入力してください。
- 新しい Forge Viewer チュートリアル改定版 ~ その1 の 9. ~ 12. の内容を実装します。画面右にはクローンされたリポジトリ内容が表示されているので、順次ファイルを開いて必要な項目を入力してください。
- Client ID、Client Secret、URN 等の指定が完了したら、Node.js の Web サーバーを起動します。Bash 上で npm run dev と入力してください。Node start.js と入力しても Web サーバーを起動することが出来ます。この時、カレント フォルダが viewer-nodejs-tutorial になっていないと、Node.js を正しく起動出来ないの注意してください(上記、9. の手順)。
- Node.js が起動してから画面上部の Run ボタンをクリックすると、作成した仮想環境上で Forge サンプルのビューアが表示されるはずです。
ローカルな環境を使わずに、仮想環境上でサンプルの評価が出来るのは魅力的と思います。無償枠は AWS が用意する内容が適用されるほか、使用出来るポート番号にも制約がありますので、詳しくは AWS ブログ記事 AWS Cloud9 – クラウド開発環境 や Cloud9 料金表、Cloud9 に関するよくある質問、Cloud9 ドキュメント などを確認してみてください。
By Toshiaki Isezaki
コメント
コメントフィードを購読すればディスカッションを追いかけることができます。