APS チュートリアル：Hub Browser

APS 学習サイト、Learn APS Tutorials（https://tutorials.autodesk.io/）になって、使用するサンプルが更新されていますので、GitHub リポジトリ、Hub Browser（Node.js）- GitHub - autodesk-platform-services/aps-hubs-browser-nodejs: Hubs Browser (Node.js) を題材に、ローカル環境（Windows）にクローンして実行する手順を記しておきたいと思います。

Web ブラウザで GitHub 上の Hubs Browser (Node.js) リポジトリページを開きます。
画面右側の [Code] ボタンをクリックして、クローン元のリポジトリ URL https://github.com/autodesk-platform-services/aps-hubs-browser-nodejs.git をクリップボードにコピーしておきます。
リポジトリの内容をクライアントコンピュータにクローン（コピー）します。コマンドプロンプトを起動して、リポジトリ内容をコピーしたいフォルダ（ディレクトリ）に CD コマンドで移動し、git clone https://github.com/autodesk-platform-services/aps-hubs-browser-nodejs.git（クリップボード内の URL）と入力します。 aps-hubs-browser-nodejs フォルダが作成されて、GitHub リポジトリからソースコードがコピーされます。
クローンされたプロジェクトに Node.js の実行で必要となるパッケージ（ミドルウェア）をインストールします。CD コマンドで現在のフォルダを aps-hubs-browser-nodejsフォルダへ移動してから、npm install と入力します。
このサンプルは実行時にシステム環境変数から Client ID と Client Secret、コールバック URL を取得するので、先にコマンドプロンプトでそれらを指定します。作成したアプリは、システム環境変数、APS_CLIENT_ID（使用する Client ID）、APS_CLIENT_SECRET（使用する Client Secret）、APS_CALLBACK_URL（3-legged OAuth で使用するコールバック URL）、SERVER_SESSION_SECRET（サーバーセッションクッキーの暗号化/復号化で使用する任意のフレーズ）を取得、利用します。メモ帳などのテキストエディタとクリップボードを交互に利用して（コピー＆ペースト）、SET コマンドを実行してみてください。ここでは、ローカル環境での動作を前提に、コールバック URL を http://localhost:8080/api/auth/callback で設定します。コールバック URL は、事前に APS API を利用するアプリの登録とキーの取得 の手順で設定が必要です。
```
set APS_CLIENT_ID=<<YOUR CLIENT ID>>
set APS_CLIENT_SECRET=<<YOUR CLIENT SECRET>>
set APS_CALLBACK_URL=http://localhost:8080/api/auth/callback
set SERVER_SESSION_SECRET=<<セッションクッキーの暗号化/復号化に使用される任意の文字列>>
```
ここまでの手順で実行の準備は完了です。カレントフォルダが aps-hubs-browser-nodejs フォルダであることを確認したら、npm start と入力して Node.js サーバーを起動します。
Web ブラウザを起動して、URL 欄に localhost:8080 と入力すると、ページが表示されるはずです。3-legged OAuth を使ってオートデスククラウドストレージにアクセスするためのアクセストークンを取得します。ページ右上の [Login] ボタンをクリックしてください。
Autodesk ID（オートデスクアカウント）の入力を求める画面が表示されます。A360 や Fusion Team、BIM 360、Autodesk Construction Cloud にアクセス可能なアカウントユーザ名を入力して [次へ] ボタンをクリックします。
アカウントのパスワードを入力して [サインイン] ボタンをクリックします。
左手に Hub - Project - Folder - Item - Version の階層が表示されます。Version に既にクラウドサービスで変換された SVF が存在していれば、クリックして同 Version の内容が Viewer に表示されるはずです。

この例では、Fusion Team の Hub 配下から、既定の Demo Project に用意されている Robot.iam を表示しています。
BIM 360、Autodesk Construction Cloud にアクセスする場合には、Account Admin の方が「カスタム統合」機能を使って Client ID を登録しておく必要があります。カスタム統合については、BIM 360 Docs と Data Management API アクセスを参照してみてください。

なお、Autodesk Construction Cloud へのカスタム統合について、公式ドキュメントの BIM 360 Compatibility | Autodesk Construction Cloud APIs | Autodesk Platform Services でページでは次のように紹介しています。

一方、BIM 360 へのカスタム統合については、Getting Started | BIM 360 API | Autodesk Platform Services で手順が示されています。

カスタム統合でアプリが使用する Client ID が正しく登録されると、BIM 360 ないし、Autodesk Construction Cloud の Hub が表示されるようになります。プロジェクト配下で変換済の SVF を持つファイルがあれば、Viewer 上にモデルを表示出来ます。

3-legged OAuth を使った Viewer への表示プロセスは、Postman による Viewer 利用手順の理解 - 3 legged 認証でも把握いただけます。

このサンプルは、ファイルのアップロードはサポートしていません。Data Management API を使ったストレージへのアップロードは、公式ドキュメント Upload a File | Data Management API | Autodesk Platform Servicesをご確認ください。

By Toshiaki Isezaki