Adobe I/O の REST APIを触ってみよう #AdobeIO #Lightroom #AdobeXD
概要
Adobe I/O にはデスクトップアプリケーションのプラグインだけではなく、Webやモバイルアプリケーション向けのAPIがあります。
今回はWebアプリケーションの中でもLightroom API(Lightroom Classicではなく、Webやモバイルデバイスで画像を閲覧・編集できるLightroomです。）とAdobe XD Cloud Content APIへアクセスするサンプルを作成します。
なお、Lightroom APIはAdobe I/O Consoleより登録することで、誰でも利用できます。
ソースコードはこちらで公開しております。
※本サンプルコードはあくまでAPIの検証用です、本番環境で利用する際は別途セキュリティなどの検討をお願い致します。
構成
Adobe I/O へのアクセスに関係する部分のみコーディングし、それ以外の部分はNode.jsのpackageを利用します。
Client ID, Client Keyなどの管理
- .env ファイルににこれらの情報を環境変数として設定します。
クライアントのホスト
- Node.js のExpressでアプリケーションをホストします。
- Adobe I/O の OAuth のCallback は https が必須なので、http-proxyを用いて、httpsのリクエストを内部のhttpサーバー(express)に転送します。bin/www.js を参照してください。
OAuth認証
- Lightroom, Adobe XD Cloud Content のAPIにアクセスする際にはOAuth認証が必要です。Passport.jsとPassport.js の Adobe OAuth 2.0 向けのStrategy を利用します。
レスポンスの表示
- Expressで一般的に利用されるテンプレートエンジンのPugを利用します。
- レスポンスのJsonデータを整形して表示するために jQuery json-viewerを利用します。
Lightroom API を利用し、Lightroomに保存されている写真を取得する
- まずは、lr_partner_apis の scopeをリクエストする（Passport.js の use() メソッドで設定します。設定値はここの行を参照してください。）ことで、Lightroom APIを利用できるtokenを取得します。
- Lightroomに保存されている写真を取得するには catalog ID と asset ID の2つが必要ですが、tokenの取得後に次の順序でAPIを呼び出すことで、catalog IDと asset IDの両方を取得出来ます。
/v2/catalog(catalog ID取得）/v2/catalogs/{catalog ID}/Assets（asset IDを取得） - もしくは、catalog IDと album IDを取得後にasset IDを得る事もできます。
/v2/catalog(catalog IDを取得)/v2/catalogs/{catalog ID}/albums(album IDを取得)/v2/catalogs/{catalog ID}/albums/{album ID)/assets(asset IDを取得)- catalog ID と asset IDを取得後、次のAPIを呼び出すことでLightroomに保存された画像の表示用画像(rendition)を取得することができます。Rendition の種類は’thumbnail2x’, ‘640’, ‘1280’, ‘2048 から選択できます。
/v2/catalogs/{catalog_id}/assets{asset_id}/renditions/{rendition_type}
注意点
Lightroom APIのリクエスト時のresponse type はjsonを指定します（表示用画像を除く）。しかし、不正使用防止のため、レスポンスには “while(1){}” というテキストが1行付与されています。レスポンスを取得した後、アプリケーション側で取り除いてください。
https://lr.adobe.io//v2/health の responseの例
while (1) {} {"version":"311f0aea3ac9dd4000ab7dd94d15383ac4ad06f5"}
Adobe XD Cloud Content APIを利用し、Adobe XDの各アートボードのサムネイル画像を取得する
Adobe XD Cloud Content APIを利用すると、共有リンクの中に含まれるアートボードのサムネイル画像などを取得することができます。APIの詳細についてはこちらの記事（Adobe XDをプロジェクトチームとつなぐ「Cloud Content API」の公開）も参考になります。
（Adobe XD Cloud Content API 利用に必要なAPI keyはAdobe I/O Consoleでは作成出来ません。まずは、 Overview · Adobe XD Cloud Reference （英語）のページの “Get your unique API key”の項目にあるフォームにkeyの取得に必要な情報を入力してサブミットしてください。開発チームより連絡させていただきます。）
Adobe XD Cloud Content APIを利用してアートボードのサムネイル画像を取得するためには、document IDとartboard ID のふたつが必要です。
/v2/apiより、リンクのURLから、document ID を取得します。response headerの linkプロパティに含まれています。/v2/document/{document ID}より、documentに含まれるartboardのartboard ID を取得します。/v2/document/{linkID}/artboard/{artboardID}より、artboard のサムネイル画像のURLを取得出来ます。
注意点
- /v2/api のHTTPリクエストメソッドはOPTIONSです。GETではありません。
- 非公開リンク（招待されたユーザーのみがアクセスできるリンク）へアクセスする場合はOAuth認証が必要です。
- OAuth のscopeにcreative_sdkを含めて、acceess tokenを取得し、Cloud Content APIのリクエストに、取得したaccess tokenを含めてください。（リクエストヘッダーのヘッダーのAuthorizationフィールドに “Bearer {accessToken}”を付与してください）
- パスワードで保護されたリンクについては、Cloud Content API経由での情報取得はできません。(401エラーが返ってきます）
まとめ
Lightroom APIとAdobe XD Cloud Content APIを利用する方法についてまとめました。Adobe Lightroomに保存された画像や、Adobe XDのプロトタイプのサムネイル画像を他のアプリケーションで利用することができるようになります。面白い、役に立ちそうなアプリケーションを開発したり、アイデアがひらめいたら、ぜひ #AdobeIO のハッシュタグをつけて、つぶやいてください。