View and Data API ワークフロー

View and Data API は2016年6月に Viewer と  Model Derivative API に分離、及び、名称変更されました。

 

以前、次のブログ記事で  View and Data API の開発環境の準備やキーの取得までの手順をご案内しています。

View and Data API とは ? 

A360 API とストレージの考え方

View and Data API の開発環境

View and Data API アプリ登録とキーの入手

もし、まだ、これらをお読みになっていないようであれば、このブログ記事を読み進める前に、先に目を通していただくことをお勧めします。

さて、 今回は、いよいよ View and Data API の利用手順について、オートデスク デベロッパ ポータル(https://developer.autodesk.com)で公開されている機能を使ってご紹介してきます。この手順は、基本的に過去のブログ記事 View & Data API クイック スタート サンプル で紹介した内容と同じです。ただし、今回の機能はオンラインで試すことができので、サンプルをダウンロードするような手間が省けて便利です。

View and Data API の利用手順は、おおまかに次のようになります。

アカウント登録とアプリケーションの作成、アクセス トークンの取得、バケットの作成、デザインファイルのアップロード、変換リクエスト、クライアントからのアクセスの手順を示すフローチャート

最初にある「アカウント登録とアプリケーションの作成」は、前述のブログ記事 View and Data API アプリ登録とキーの入手 でご説明していると思います。 ここでは、それ以降の手順をシミュレーションしていきます。通常、これらはプログラム側で実装するべき内容である点にご注意ください。具体的には、「アクセス トークンの取得」から「変換リクエスト」までは、View and Data API の REST API で、「クライアントからのアクセス」で表現される Web ブラウザ上での 3D モデル/ 2D 図面の表示は、同じく JavaScript API を利用することになります。

REST APIとJavaScript APIを示すアイコン群。左側にはさまざまなファイル形式のシンボル(PDF、Word、Excelなど)があり、中央にクラウドとバケツ、右側にはPCやタブレット、スマートフォンが描かれています。

それでは、ライブデモで手順を確認していきましょう。

ライブデモ ページの表示手順

  1. Web ブラウザで オートデスク デベロッパ ポータル(https://developer.autodesk.com) を開いて、上部の API リンクメニューから View and Data Service をクリックします。
     
  2. View and Data API の Web ページが開いたら、左手のメニューリンクの中から Try This API をクリックします。
  3. 表示された Try View and Data API ページが、手順を確認するライブデモのページです。左手に手順を示す各ステップ(Step)へのリンクメニューが表示されているはずです。手順は、Step 1  から Step 13 までになっているはずです。

ライブデモ ページの操作手順

  1. Step 1 : Try the Viewer Live では、View and Data API の機能を理解するためのサンプルを確認するすことが出来ます。
  2. Step 2 : Sign Up の部分に書かれているのは、デベロッパ ポータルへのサインアップとアプリ登録(Consumer Key と Consumer Secret の取得)方法です。この手順は、ブログ記事 View and Data API アプリ登録とキーの入手 で詳しくご紹介していますので、もし、アプリ登録がまだの方は、そちらをご覧ください。
  3. Step3 : Get Access Token では、View and Data API でクラウドストレージにアクセスするためのアクセス トークンを取得します。ここでは、Curl でアクセス トークンを取得することにします。メモ帳などのテキスト エディタで、Step 2 : Sign Up で 入手した Consumer Key と Consumer Secret を次の Curl 構文に挿入します。

    curl –data “client_id=MY_CONSUMER_KEY&client_secret=MY_CONSUMER_SECRET&grant_type=client_credentials” https://developer.api.autodesk.com/authentication/v1/authenticate –header “Content-Type: application/x-www-form-urlencoded” -k


    デベロッパ ポータルで登録したアプリの Consumer Key と Consumer Secret が、次のようになっていたら、作成すべき Curl 構文は、次のようになります。

    curl –data “client_id=7XYKfPIIYssYPfDgyJTxy8kCmZPt7AB1&client_secret=sp0GZXAuDWVTQPTy&grant_type=client_credentials” https://developer.api.autodesk.com/authentication/v1/authenticate –header “Content-Type: application/x-www-form-urlencoded” -k


    次に、Windows のコマンド プロンプトを起動後に、ブログ記事 View and Data API の開発環境 でセットアップした Curl フォルダに移動して、 作成した Curl 構文を貼り付けてからリターンキーで実行します。ここでは、Curl で REST API がコールされます。

    しばらくすると、コマンド プロンプト上に Consumer Key と Consumer Secret から生成されたアクセス トークンが、JSON 形式で返されてきます。
    黄色い下線の部分がアクセス トークンです。この部分だけをクリップボードにコピーして、Step3 : Get Access Token の Auth Token 欄に貼り付けてから、[Authenticate] リンクボタンをクリックしてください。これで、API からクラウドへアクセスするアクセス権限が手に入りました。

  4. Step 4 : Create Bucket では、2D 図面ファイルや 3D モデル ファイルをアップロードする場所を API 専用領域に Bucket(バケツ)として作成します。ここでは、他の開発者と重複しないよう、Bucket にユニークな名前を付けなければなりません。利用できるのは、小文字アルファベット、数字、”-“(ハイフン) と “_”(アンダーバー)のみです。日本語や大文字アルファベットなどは利用できませんので注意してください。もちろん、この処理でも背後で REST API がコールされています。
    Retention Policy  は、Bucket にアップロードしたファイルの寿命を示します。transient は 24時間、temporary は 30 日間、persistent は削除命令をするまで永久、です。時間が経過すると自動的にクラウドからファイルが削除されます。
    ここでは、Bucket 名を “auj-japan-test-001“、Retention Policy を “transient” として、[Create Bucket] ボタンをクリックします。正常に作成できると、Result 欄に、クラウドからの応答が  JSON で表示されます。同じ名前の Bucket が既に存在している場合には、409 Conflict エラーの JSON が表示されます。
  5. Step 5: Get Bucket Details で、作成した Bucket の情報を取得します。Bucket が既に登録されているか調べるような際にも、この REAT API コードを利用することが出来ます。Bucket Name 欄に作成した Bucket 名を入力して、[Get Bucket Details] ボタンをクリックします。正常に取得できると、Result 欄に、クラウドからの応答が  JSON で表示されます。
  6. Step 6: Get Supported Formats では、[Get Supported Formats] ボタンをクリックすることで、View and Data API で変換処理がサポートされているファイル拡張子を取得できます。必要に応じて、テストしてみてください。 Result 欄をスクロールすることで、すべてのファイル拡張子を把握することが出来ます。
  7. Step 7: Upload File to Bucket で、作成した Bucket に View and Data API で表示したいファイルをアップロードします。Bucket Name 欄に Bucket 名を入力したら、[参照] ボタンでサポートされるファイル形式を持つ任意のデータ ファイルを指定してください。指定後に [Upload File to Bucket] ボタンでアップロードを完了します。
    アップロードが正常に完了すると、Result 欄にクラウドからの応答が JSON で表示されます。”key” となっているのが Bucket 内の識別で使われる Key で、一般には次の赤線部のファイル名となります。
  8. Step 8: Get Bucket Object では、Bucket 内にファイルが存在しているか確認出来ます。Bucket Name 欄に Bucket 名を、Object Key 欄にStep 7 で取得した “key”、ここでは Desktop_Fan.nwd を入力して [Get Bucket Object] ボタンをクリックします。
    Bucket に指定した Object Key のファイルが存在していれば、Result 欄に JSON が返されます。もし、ファイルが存在しなければ、404 Not Found エラーの JSON が表示されます。
  9. Step 9: Set References では、同じ Bucket にアップロードしたファイルの親子関係を JSON で指定します。これには、外部参照を持つ DWG 図面ファイルや、Inventor や Solid Works のアセンブリ構造などがあげられます。今回は、単一ファイルをアップロードしているので、何もせずにスキップします。
  10. View and Data では、クライアントからの表示を JavaScript で行う場合、エンコードされた Bucket 名と Object Key 名を使用して指定します。Step 10: Encode URN では、Step 8 で取得した  JSON から、”id” で示されるドキュメント ID の文字列をエンコードします。
    ここでは、URN to Encode 欄に、Step 8 の Result 欄からクリップボードにコピーした urn:adsk.objects:os.object:auj-japan-test-001/Desktop_Fan.nwd を貼り付けて、[Encode Base64] ボタンをクリックします。変換が完了すると、Result 欄にエンコードされたドキュメント ID が表示されます。右スクロールでドキュメント ID すべての文字列を把握することが出来ます。
  11. Step 11: Translate the File では、エンコードされたドキュメント ID を使って、ストリーミング配信用の変換処理を命令します。Encoded URN of file to translate 欄に、Step 10 の Result 欄からクリップボードにコピーしたドキュメント ID を貼り付けて、[Translate] ボタンで変換を指示してください。
  12. ストリーミング配信用に変換するための処理時間は、アップロードしたファイルのボリュームによって変化します。Step 12: View Translation Status では、変換処理が終了したらチェックするフェーズです。一般には、REST API を定期的に呼び出すポーリング処理を実装して、変換完了を待つように実装します。
    ここでは、Encoded URN of file 欄に Step 11 と同じドキュメント ID を貼り付けて、何回かに渡って [Get Status] ボタンをクリックします。Result 欄に表示される JOSN から、”progress” 値が “complete” になれば、変化処理は完了です。
  13. いよいよ、View and Data API でアップロードしたファイルを表示させる準備が整いました。Encoded URN of file to view 欄に Step 12 で変換処理が終了したファイルのドキュメント ID を貼り付けて [View it] ボタンをクリックしてください。しばらくして、ビューワー上にモデルが表示されるはずです。

少々長めではありますが、これが、ライブデモで把握いただける View and Data API の利用手順です。繰り返しになりますが、Step 3 から Step 13 はプログラム実装でカバーする内容です。また、Bucket の作成やファイルのアップロード、ストリーミング配信用の変換処理は、毎回必須というわけではありません。電子カタログのような場合には、persistent 属性で作成した Bucket 内のドキュメント ID を使いまわすことも出来ます。

さて、ここまでの内容を動画にしてみましたので、内容をご確認ください。

  

あとは、GitHub にある各種サンプルを参照して、目的にあった実装にチェレンジしてみてください。

By Toshiaki Isezaki

Discover more from Autodesk Developer Blog

Subscribe now to keep reading and get access to the full archive.

Continue reading