Forge の学習サイト、Learn Autodesk Forge には、2-Legged OAuth を利用して Bucket 内に保存したデザイン データの表示を説明する View your models があります。手順に沿って実装していくことが出来ますが、GitHub リポジトリにも、ほぼ同じサンプルが記載されています。learn.forge.viewmodels サンプルです。ここでは、このサンプルをローカル Node.js 開発環境にクローンし、セットアップ、テストしていく手順をご案内します。
リポジトリの内容からローカルでテストするには、事前に Git for Windows や Node.js をセットアップしておく必要があります。また、実行時には Forge で利用する Client ID と Client Secret(Consumer Key と Consumer Secret)を事前に Forge ポータル から取得しておく必要があります。これらの手順は、それぞれ、次のブログ記事でご案内しています。
- Web ブラウザで GitHub 上の learn.forge.viewmodels リポジトリ ページを開きます。
- 画面右側の [Clone or download] ボタンをクリックして、表示される URL https://github.com/Autodesk-Forge/learn.forge.viewmodels.git をクリップボードにコピーしておきます。
- GitHub 上のプロジェクトを 、リポジトリから開発に使用するクライアント コンピュータにコピーします。コマンド プロンプトを起動して、リポジトリ内容をコピーしたいフォルダ(ディレクトリ)に CD コマンドで移動し、git clone -b nodejs https://github.com/Autodesk-Forge/learn.forge.viewmodels.git (クリップボード内の URL)と入力します。例えば、C:\Users\<Windows ログイン ユーザ名>\Desktop\GitHub フォルダに移動して git clone -b nodejs https://github.com/Autodesk-Forge/learn.forge.viewmodels.git を実行すると、C:\Users\<Windows ログイン ユーザ名>\Documents\GitHub フォルダ下に learn.forge.viewmodels フォルダが作成され、GitHub リポジトリからソースコードがコピーされます。
- クローン(コピー)されたプロジェクトに Node.js の実行で必要となるパッケージ(ミドルウェア)をインストールします。CD コマンドで現在のフォルダを learn.forge.viewmodels フォルダへ移動してから、npm install と入力します。
- このサンプルでは、実行時にシステム環境変数から Client ID と Client Secret、CallBack URL を取得します。コマンド プロンプト上で SET コマンドを使って環境変数を指定します。作成したアプリから Client ID、Client Secret を読み取り、それぞれ、システム環境変数、FORGE_CLIENT_ID、FORGE_CLIENT_SECRET を設定します。クリップボードとメモ帳などを利用してコピー&ペーストしながら SET コマンドを実行してみてください。
set FORGE_CLIENT_ID=<<YOUR CLIENT ID FROM DEVELOPER PORTAL>> set FORGE_CLIENT_SECRET=<<YOUR CLIENT SECRET>>
- ここまでの手順で実行の準備は完了です。カレント フォルダが learn.forge.viewmodels フォルダであることを確認したら、npm start と入力、リターンキーを押して Node.js サーバーを起動します。
- Web ブラウザを起動して、URL の localhost:3000 と入力してリターンすると、ページ左上に [New bucket] ボタンが表示されるはずです。
- [New bucket] ボタンをクリックして、作成したい Bucket 名を入力後、[Go ahead、create the bucket] ボタンをクリックいてください。
- 入力した Bucket 名が画面左に表示されます。
※ 実際には Bucket 名の重複を避けるため、Client ID + "-" + 入力した名前 の Bucket が作成されます。 - Bucket 名を右クリックして、[Upload File] をクリックして Bucket にアップロードするファイルを選択します。
- アップロードが完了すると、Bucket のフォルダアイコン左側に ▷ 記号が表示されます。
この記号をクリックすると、Bucekt の配下にアップロードしたファイル(Object)が表示されます。 - ファイル名を右クリックすると、SVF 変換を実行するための [Translate] が表示されるので、ここでクリックします。
- 一定の後、ファイル名をクリックすると、画面右に変換された 3D モデル、または 2D 図面が表示されます。
作成した Bucket やアップロードしたファイルは、Forge VS Code Forge Extension を使った Viewer ワークフローの確認 の方法で確認することが出来ます。(同じ Client ID と Client Secret の使用が前提)をご参照ください。
By Toshiaki Isezaki
コメント
コメントフィードを購読すればディスカッションを追いかけることができます。