Canvas 開発者ガイド
バージョン 37.0, Summer ’16
@salesforcedocs
最終更新日: 2016/04/22
本書の英語版と翻訳版で相違がある場合は英語版を優先するものとします。
© Copyright 2000–2016 salesforce.com, inc. All rights reserved. Salesforce およびその他の名称や商標は、salesforce.com,
inc. の登録商標です。本ドキュメントに記載されたその他の商標は、各社に所有権があります。
目次
はじめよう
.......................................................1
第 1 章: Force.com Canvas の概要 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
Force.com Canvas のシナリオ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
キャンバスアプリケーションの表示場所 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
サポートされるブラウザ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
サポート対象の Salesforce のエディション . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
必要なユーザ権限 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
ユーザインターフェースの考慮事項 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
キャンバスアプリケーションのプロセス . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
キャンバス個人用アプリケーション . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
キャンバス個人用アプリケーションのプロセス . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
組織でのキャンバス個人用アプリケーションの有効化 . . . . . . . . . . . . . . . . . . . . . 10
キャンバス個人用アプリケーションへのアプリケーションの変更 . . . . . . . . . . . . . 11
キャンバス個人用アプリケーションのアンインストール . . . . . . . . . . . . . . . . . . . . 12
第 2 章: クイックスタート . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
前提条件 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
アプリケーションの作成 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
アプリケーションの場所の設定 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
第 3 章: クイックスタート — 詳細 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
前提条件 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
GitHub からのプロジェクトのコピー . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
ローカルでの Web アプリケーションの実行 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
キャンバスアプリケーションの作成 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
キャンバスアプリケーションにアクセスできるユーザの設定 . . . . . . . . . . . . . . . . . . . . 25
Heroku への Web アプリケーションのリリース . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
キャンバスアプリケーションの更新 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28
キャンバスアプリケーションのパッケージ化 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
キャンバスアプリケーションパッケージのアップロード . . . . . . . . . . . . . . . . . . . . . . . 30
キャンバスアプリケーションのインストール . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
インストール済みキャンバスアプリケーションにアクセスできるユーザの設定 . . . . . . . 31
Force.com Canvas の使用
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
第 4 章: Force.com Canvas SDK . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
Force.com Canvas SDK の参照 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
認証 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
目次
署名付き要求認証 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
OAuth 認証 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
キャンバスアプリケーションの SAML シングルサインオン . . . . . . . . . . . . . . . . . . 47
キャンバスアプリケーションでのコンテキストの取得 . . . . . . . . . . . . . . . . . . . . . . . . . 47
クロスドメイン XHR . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 48
Chatter ユーザリストの取得 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
Chatter フィードへの投稿 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
キャンバスアプリケーションのサイズ変更 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
自動的なキャンバスアプリケーションのサイズ変更 . . . . . . . . . . . . . . . . . . . . . . . 50
明示的なキャンバスアプリケーションのサイズ変更 . . . . . . . . . . . . . . . . . . . . . . . 51
キャンバスアプリケーションのサイズの取得 . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
親イベントの登録 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
キャンバスアプリケーションの方向の変更の処理 . . . . . . . . . . . . . . . . . . . . . . . . 53
キャンバスアプリケーションイベントの実装 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54
キャンバスアプリケーションイベントの考慮事項 . . . . . . . . . . . . . . . . . . . . . . . . 54
キャンバスアプリケーションイベントの作成 . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55
キャンバスアプリケーションイベントの登録 . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
キャンバスアプリケーションイベントからの登録解除 . . . . . . . . . . . . . . . . . . . . . 57
キャンバスアプリケーションでのストリーミング API の使用 . . . . . . . . . . . . . . . . . . . . 57
ストリーミング API イベントの使用 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58
ストリーミング API イベントの登録 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58
ストリーミング API イベントからの登録解除 . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59
キャンバスアプリケーションのデバッグ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60
キャンバスアプリケーションでの <select> タグの使用 . . . . . . . . . . . . . . . . . . . . . . . . . 60
第 5 章: キャンバスアプリケーションと Visualforce ページ . . . . . . . . . . . . . . . . . . 61
Visualforce ページのコード例 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62
Visualforce の考慮事項 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63
apex:canvasApp コンポーネント . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63
レコードオブジェクトで返される項目 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 66
Visualforce ページとキャンバスアプリケーション間でのイベントの使用 . . . . . . . . . . . . 68
Visualforce ページからのキャンバスイベントの公開 . . . . . . . . . . . . . . . . . . . . . . . 69
Visualforce ページでのキャンバスアプリケーションのサイズ変更 . . . . . . . . . . . . . 70
イベントの登録 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70
Visualforce ページでのイベントからの登録解除 . . . . . . . . . . . . . . . . . . . . . . . . . . . 71
第 6 章: ページレイアウトまたはモバイルカードのキャンバスアプリケーショ
ン . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72
ページレイアウトでのキャンバスアプリケーションの表示場所 . . . . . . . . . . . . . . . . . . 73
ページレイアウトへのキャンバスアプリケーションの追加 . . . . . . . . . . . . . . . . . . . . . 73
第 7 章: パブリッシャーのキャンバスアプリケーション . . . . . . . . . . . . . . . . . . . . 75
キャンバスアプリケーションの場所の設定とアクションの作成 . . . . . . . . . . . . . . . . . . 76
アクションの手動作成 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 76
目次
Force.com Canvas SDK のパブリッシャーイベント . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77
パブリッシャーのコンテキストに関する考慮事項 . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79
パブリッシャーのキャンバスアプリケーションアクセスに関する考慮事項 . . . . . . . . . . 80
第 8 章: Chatter フィードのキャンバスアプリケーション . . . . . . . . . . . . . . . . . . . 81
Chatter フィードのコンテキストに関する考慮事項 . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82
Chatter フィードのキャンバスアプリケーションアクセスに関する考慮事項 . . . . . . . . . 83
第 9 章: Salesforce1 アプリケーションのキャンバス . . . . . . . . . . . . . . . . . . . . . . . 84
キャンバスアプリケーションの場所の設定とナビゲーションメニューへの追加 . . . . . . 86
Salesforce1 のコンテキストに関する考慮事項 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 86
Salesforce1 のアクセスに関する考慮事項 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87
Salesforce1 カスタムアイコン . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 88
キャンバスアプリケーションで使用する Salesforce1 の navigation メソッド . . . . . . . . . . 89
第 10 章: アプリケーションライフサイクルのカスタマイズ . . . . . . . . . . . . . . . . . 93
CanvasLifecycleHandler の作成 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94
CanvasLifecycleHandler とアプリケーションの関連付け . . . . . . . . . . . . . . . . . . . . . . . . . 94
CanvasRequest コンテキストデータの絞り込み . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95
キャンバスアプリケーションの動作の制御 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95
ユーザエラーメッセージの表示 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 97
CanvasLifecycleHandler 実装のテスト . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 97
CanvasLifecycleHandler クラスの配布 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 99
リファレンス
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 100
第 11 章: オブジェクト . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 100
CanvasRequest
Client . . . .
Context . .
Controller . . . .
SignedRequest .
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
100
103
104
120
120
第 12 章: Force.com Canvas の制限 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 122
はじめよう
第1章
トピック:
•
Force.com Canvas の
シナリオ
•
キャンバスアプリ
ケーションの表示
場所
•
サポートされるブ
ラウザ
•
サポート対象の
Salesforce のエディ
ション
•
必要なユーザ権限
•
ユーザインター
フェースの考慮事
項
•
キャンバスアプリ
ケーションのプロ
セス
•
キャンバス個人用
アプリケーション
Force.com Canvas の概要
Force.com Canvas を使用すると、サードパーティのアプリケーションを Salesforce に簡
単に統合することができます。Force.com Canvas は、アプリケーションをキャンバス
アプリケーションとして公開するために使用できるツールと JavaScript API のセットで
す。これを活用することで、ユーザは任意の新しいアプリケーションまたは既存の
アプリケーションを Salesforce の一部として使用できるようになります。
外部アプリケーションを再設計して再統合する代わりに、これらのツールを使用し
て、Force.com Canvas 内の独自技術を統合できるようになりました。Force.com Canvas に
は、次の項目を処理するためのツールが用意されています。
• 認証 — アプリケーションで認証が必要な場合、署名付き要求または OAuth 2.0 を
使用してそれを実装できます。
• コンテキスト — キャンバスアプリケーションが実行されている環境に関するコ
ンテキスト情報を取得できる API サポート。
• クロスドメイン XHR — クロスドメイン XML HTTP 要求を Salesforce ドメインに戻す
ための JavaScript サポート。
• サイズ変更 — キャンバスアプリケーションをサイズ変更する機能をサポートす
る方法。
• イベント — イベントは、キャンバスアプリケーション間でイベントを送受信す
るための JavaScript ベースの方法を提供します。イベントを使用すると、単一ペー
ジ上の複数のキャンバスアプリケーション間のコミュニケ ションが可能になり
ます。
• Visualforce のキャンバスアプリケーション — キャンバスアプリケーションを
Visualforce ページで公開できる Visualforce コンポーネント。
• パブリッシャーのキャンバスアプリケーション — キャンバスアプリケーション
をカスタムアクションとして追加し、キャンバスアプリケーションを含むように
パブリッシャーを拡張できます。
• Chatter フィードのキャンバスアプリケーション — キャンバスアプリケーション
をフィード項目として公開できます。
• Salesforce1 アプリケーションのキャンバス — Salesforce1 でキャンバスアプリケー
ションを使用可能にします。
1
Force.com Canvas の概要
キャンバスアプリケーションとして公開するサードパーティアプリケーションは、
どの言語でも作成できます。唯一の要件として、アプリケーションに安全な URL
(HTTPS) がある必要があります。
関連トピック:
Force.com Canvas のシナリオ
キャンバスアプリケーションのプロセス
クイックスタート
2
Force.com Canvas の概要
Force.com Canvas のシナリオ
Force.com Canvas のシナリオ
Force.com Canvas が実装される一般的なシナリオとして、大まかに次の 2 つの例があります。
• アプリケーション統合 — クラウドアプリケーションを作成するパートナー、システムインテグレータ、ま
たは顧客で、Salesforce を使用してこれらのアプリケーションを統合したいと思っている場合。
• アプリケーション合理化/エンタープライズデスクトップ — Salesforceのほかにもユーザがアクセスする多数
の既存のアプリケーションを持つ大規模組織に属していて、ユーザが 1 つの場所ですべてのタスクを完了
できるように、これらのアプリケーションを Salesforce に統合したいと思っている場合。
関連トピック:
Force.com Canvas の概要
キャンバスアプリケーションの表示場所
キャンバスアプリケーションの表示場所
次のように、キャンバスアプリケーションはいくつかの場所に表示されます。
• キャンバスアプリケーションが作成された組織のキャンバスアプリケーションのプレビューア内
• キャンバスアプリケーションがChatterフィードに表示されるようにコーディングされ、現在のユーザにキャ
ンバスアプリケーションへのアクセス権がある場合は、Chatter フィード内
• Chatter タブの Chatter アプリケーションリストへのアクセス権をユーザが持つ場合、そのリスト内
• アクセス権を持つすべてのユーザに対して、Salesforce1 内にナビゲーションメニューのオプションとして
• コールセンターの定義ファイルに Open CTI 通話制御ツールを追加した後、そのツール内
• クイックアクションとして表示するよう設定した場合、Chatter パブリッシャーおよび Salesforce1 アクション
バー内
• カスタムコンソールコンポーネントとして追加した後、Salesforce コンソール内
• Visualforce ページに追加され、ユーザに対してそのページが有効化された後、そのページ内
• Chatter アプリケーションリストにアクセスできるユーザには、Chatter アプリケーションリストの [プロファ
イル] ページ内
• キャンバスアプリケーションをページレイアウトに追加した後、標準オブジェクトまたはカスタムオブジェ
クトのページレイアウト内。キャンバスアプリケーションをページレイアウトのどこに配置したかに応じ
て、キャンバスアプリケーションはレコード詳細ページまたは Salesforce1 のモバイルカードに表示されま
す。
インストール済みのキャンバスアプリケーションの表示場所は、Salesforceに接続アプリケーションを作成する
ときに、Locations 項目で選択する値によって異なります。
• Chatter フィード — キャンバスアプリケーションをフィードに表示します。このオプションが選択されてい
る場合、CanvasPost フィード項目を作成し、現在のユーザがキャンバスアプリケーションにアクセスできる
ようにする必要があります。
3
Force.com Canvas の概要
サポートされるブラウザ
• [Chatter] タブ — キャンバスアプリケーションを Chatter タブのアプリケーションナビゲーションリストに表
示します。このオプションを選択すると、キャンバスアプリケーションはその場所に自動的に表示されま
す。
• コンソール — キャンバスアプリケーションを Salesforce コンソールのフッターまたはサイドバーに表示しま
す。このオプションを選択した場合、キャンバスアプリケーションをカスタムコンソールコンポーネント
として追加して、コンソールのどこにキャンバスアプリケーションを表示するのかを選択する必要があり
ます。
• レイアウトおよびモバイルカード — キャンバスアプリケーションをページレイアウトまたはモバイルカー
ドに表示できます。このオプションを選択した場合、ページレイアウトに追加してキャンバスアプリケー
ションが表示される場所を選択します。
• モバイルナビゲーション — キャンバスアプリケーションを Salesforce1 のナビゲーションメニューからアク
セス可能にします。
• Open CTI — キャンバスアプリケーションを通話制御ツールに表示します。このオプションを選択した場合、
キャンバスアプリケーションを表示するにはコールセンターの定義ファイルにキャンバスアプリケーショ
ンを指定する必要があります。
• パブリッシャー — キャンバスアプリケーションを Chatter パブリッシャーおよび Salesforce1 アクションバー
に表示します。このオプションが選択されている場合は、キャンバスカスタムアクションを作成して、グ
ローバルパブリッシャーレイアウトまたはオブジェクトのページレイアウトに追加する必要もあります。
• Visualforce ページ — キャンバスアプリケーションを Visualforce ページに表示できます。Visualforce ページに
キャンバスアプリケーションを公開するために <apex:canvasApp> コンポーネントを追加する場合、キャ
ンバスアプリケーションの表示場所にこの場所を必ず選択してください。これ以外の場所を選択するとエ
ラーになります。
関連トピック:
Force.com Canvas の概要
アプリケーションの場所の設定
サポートされるブラウザ
サポートされるブラウザ
Force.com Canvas では、次のブラウザの最新のバージョンがサポートされます。
• Mozilla® Firefox® (推奨)
• Google Chrome™
• Microsoft® Internet Explorer® (互換モードは必ず無効にしてください)
• Apple® Safari® ([Cookie をブロック] の設定が [しない] に設定されていることを確認してください)
特定のバージョンと重要な考慮事項については、Salesforceヘルプのサポートされるブラウザに関するトピック
を参照してください。
4
Force.com Canvas の概要
サポート対象の Salesforce のエディション
アプリケーションでセッション Cookie が使用される場合、サードパーティの Cookie を許可するように P3P ヘッ
ダーを設定するか、すべてのセッション Cookie を許可するようにブラウザの設定を変更する必要が生じること
があります。
関連トピック:
サポートされるブラウザ
Force.com Canvas の概要
サポート対象の Salesforce のエディション
サポート対象の Salesforce のエディション
Force.com Canvas では、次の Salesforce エディションをサポートしています。
エディション
キャンバスアプリケーショ キャンバスアプリケーショ キャンバスアプリケーショ
ンの作成
ンの公開
ンのインストール
Group
○*
×
○*
Professional
○*
×
○*
Enterprise
○
×
○
Unlimited
○
×
○
Performance
○
×
○
Developer
○
○
○
* Group Edition と Professional Edition は、組織でプロファイルとページレイアウトが有効な場合にのみ、許可され
ているユーザの値が [管理者が承認したユーザは事前承認済み] のキャンバスアプリケーションを使用または作
成できます。
関連トピック:
Force.com Canvas の概要
必要なユーザ権限
必要なユーザ権限
キャンバスアプリケーションの作成、およびキャンバスアプリケーションのプレビューアでの表示には、次の
ユーザ権限が必要です。
• 「アプリケーションのカスタマイズ」
5
Force.com Canvas の概要
ユーザインターフェースの考慮事項
• 「すべてのデータの編集」
関連トピック:
Force.com Canvas の概要
キャンバスアプリケーションにアクセスできるユーザの設定
インストール済みキャンバスアプリケーションにアクセスできるユーザの設定
ユーザインターフェースの考慮事項
キャンバスのサイズ
キャンバスアプリケーションのフレームサイズはアプリケーションが表示されている場所によって異なりま
す。SDK を使用する場合、これらの値は Dimensions オブジェクトで返されます。
メモ: キャンバスアプリケーションを Salesforce1 で使用する場合は、モバイルデバイスの画面サイズを考
慮してください。詳細は、「Salesforce1 アプリケーションのキャンバス」を参照してください。
場所
説明
Chatter タブ
デフォルトのサイズは 800 ピクセル (幅) × 900 ピクセル (高
さ) です。最大サイズは 1,000 ピクセル (幅) × 2,000 ピクセル
(高さ) です。
Chatter フィード
デフォルトのサイズは 420 ピクセル (幅) × 100 ピクセル (高
さ) です。最大サイズは 420 ピクセル (幅) × 400 ピクセル (高
さ) です。
Open CTI
デフォルトのサイズと最大サイズはカスタムコンソールコ
ンポーネントの設定方法によって決まります。
パブリッシャー
デフォルトの高さは、キャンバスパブリッシャーアクショ
ンの設定方法によって決まります。デフォルトの幅は 522
ピクセルです。最大サイズは 522 ピクセル (幅) × 500 ピクセ
ル (高さ) です。
Salesforce コンソール
デフォルトのサイズと最大サイズはカスタムコンソールコ
ンポーネントの設定方法によって決まります。
Visualforce ページ
デフォルトのサイズは 800 ピクセル (幅) × 900 ピクセル (高
さ) です。開発者は apex:canvasApp Component の属性を変更
することで、これらのサイズを変更できます。
6
Force.com Canvas の概要
キャンバスアプリケーションのプロセス
ロゴ画像
キャンバスアプリケーションに関連付けられたロゴ画像は、ユーザがそのキャンバスアプリケーションをイン
ストールするときか、アプリケーションの実行を許可するように要求され、OAuth 認証を行っている間に表示
されます。256 ピクセル (高さ) × 256 ピクセル (幅) のサイズの画像を使用することをお勧めします。
アイコン画像
キャンバスアプリケーションに関連付けられたアイコン画像は、次の場所に表示されます。
• Chatter タブの Chatter アプリケーションリストにある、自分のキャンバスアプリケーションへのリンクの左
側
• キャンバスアプリケーションのプレビューアにある、自分のキャンバスアプリケーションへのリンクの左
側
• Salesforce1 のナビゲーションメニュー
Salesforce1 と Salesforce の両方でアイコンが適切に表示されるように、60 ピクセル (幅) × 60 ピクセル (高さ) のサ
イズの画像を使用することをお勧めします。Salesforce1 でアイコンを表示しない場合は、16 ピクセル (幅) × 16
ピクセル (高さ) よりも小さいサイズのアイコンを使用できます。
サムネイル画像
キャンバスアプリケーションのフィード項目に関連付けられたサムネイル画像は、フィードのキャンバスアプ
リケーションにアクセスすると表示されます。指定されている場合は、この画像はフィード項目のタイトルと
説明の横に表示されます。
120 ピクセル (幅) × 120 ピクセル (高さ) 以下のサイズの画像を使用することをお勧めします。
関連トピック:
Force.com Canvas の概要
キャンバスアプリケーションのサイズ変更
キャンバスアプリケーションのプロセス
キャンバスアプリケーションのプロセス
キャンバスアプリケーションを作成、公開、インストール、実行するプロセスでは、開発者、システム管理
者、ユーザが、次の図のようにアクションを実行する必要があります。
7
Force.com Canvas の概要
キャンバスアプリケーションのプロセス
関連トピック:
Force.com Canvas の概要
クイックスタート
クイックスタート — 詳細
キャンバス個人用アプリケーションのプロセス
組織でのキャンバス個人用アプリケーションの有効化
キャンバスアプリケーションのパッケージ化
8
Force.com Canvas の概要
キャンバス個人用アプリケーション
キャンバス個人用アプリケーション
キャンバス個人用アプリケーションでは、複数の組織にわたるエンドユーザ向けに、専用に設計した接続アプ
リケーションを作成できます。キャンバス個人用アプリケーションを使用すると、作成したアプリケーション
をインストール可能にすることができます。各組織のシステム管理者がアプリケーションを配布する必要はあ
りません。
以前は、システム管理者のみがキャンバスアプリケーションをインストールできました。システム管理者は引
き続きキャンバスアプリケーションをインストールできますが、エンドユーザが自分でインストールできる
キャンバス個人用アプリケーションを開発者が作成できるようになりました。
エンドユーザは、Chatter タブから直接キャンバス個人用アプリケーションをインストールして使用します
(Salesforceの適切な権限を持つ場合)。エンドユーザがアプリケーションをインストールすると、アプリケーショ
ンによる Salesforce データの使用を許可するように求められます。
キャンバス個人用アプリケーションの作成は、次の点を除いて、キャンバスアプリケーションの作成と似てい
ます。
• ユーザは、アクセス方法として OAuth と署名付き要求のどちらを使用しているかに関係なく、最初にアプ
リケーションにアクセスしたときにキャンバス個人用アプリケーションを承認または拒否するように求め
られます。これは、最初のアクセスで OAuth 承認フローがトリガされるためです。最初のアクセスの後は、
ユーザは透過的に識別され、承認や資格情報は求められません (Salesforce にログインしている限り)。
• キャンバス個人用アプリケーションでは、アプリケーションのメタデータのみがインストールされ、他の
パッケージコンポーネント (Apex クラスや Visualforce コンポーネントなど) はインストールされません。これ
によって、アプリケーションを容易に広範囲にインストールでき、アプリケーションの機能をエンドユー
ザが必要とする内容に制限できます。
管理パッケージと未管理パッケージについての詳細は、『ISVforce ガイド』の「パッケージの概要」を参照し
てください。
キャンバス個人用アプリケーションのプロセス
キャンバス個人用アプリケーションの作成は、キャンバスアプリケーションの作成と似ています。ただし、
キャンバス個人用アプリケーションはエンドユーザに直接配布します。エンドユーザは、指定されたリンクか
らそのアプリケーションをインストールし、アプリケーションを Salesforce データと統合します。アプリケー
ションをインストールしたら、エンドユーザは Chatter タブから直接実行します。
キャンバス個人用アプリケーションをエンドユーザが使用できるようにする手順は次のとおりです。
1. 組織のシステム管理者が対象組織内の個人用アプリケーションを有効にしていることを確認します。詳細
は、「組織でのキャンバス個人用アプリケーションの有効化」 (ページ 10)を参照してください。
2. アプリケーションを作成し、これをキャンバス個人用アプリケーションとして指定します。詳細は、「キャ
ンバス個人用アプリケーションへのアプリケーションの変更」 (ページ 11)を参照してください。
3. エンドユーザは、指定されたアプリケーションリンクをクリックします。たとえば、リンクは Web サイト
に表示されるボタンであったり、リンクがメールで送信されたりします。リンクをクリックすると、アプ
9
Force.com Canvas の概要
組織でのキャンバス個人用アプリケーションの有効化
リケーションの OAuth 承認プロセスが呼び出されます。たとえば、アプリケーションへのリンクは、次の
ように表示されます。
https://login.salesforce.com/services/oauth2/authorize?response_type=code&client_id=<your_client_id>&redirect_uri=<your_redirect_uri>
4. プロンプトが表示されたら、エンドユーザはアプリケーションを承認し、Salesforce データへのアクセスを
許可します。
5. OAuth 承認フローは非同期モードでキャンバスインストーラをトリガします。キャンバスインストーラは
API からアプリケーションのコンテキスト情報を取得し、アプリケーションのメタデータをインストールし
ます。アプリケーションはバックグラウンドでインストールされ、インストールが完了するとエンドユー
ザにメールが送信されます。
メモ: キャンバス個人用アプリケーションのメタデータのみがインストールされます。キャンバスア
プリケーションのパッケージに通常含まれる追加のコンポーネントは、アプリケーションと一緒には
インストールされません。これは、ユーザが必要な機能のみを取得し、すばやく軽快にインストール
できることを意味します。ただし、システム管理者が組織全体にキャンバス個人用アプリケーション
をインストールするように選択すると、キャンバスアプリケーションと同様に、追加のパッケージコ
ンポーネントがインストールされます。
6. ユーザは、Chatter タブからアプリケーションのアイコンをクリックして、キャンバス個人用アプリケーショ
ンの使用を開始します。
関連トピック:
キャンバスアプリケーションのプロセス
キャンバス個人用アプリケーションへのアプリケーションの変更
組織でのキャンバス個人用アプリケーションの有効化
組織のシステム管理者は、その組織内でユーザがキャンバス個人用アプリケーションをインストールできるか
どうかを制御します。キャンバス個人用アプリケーションを作成する前に、組織のシステム管理者がキャンバ
ス個人用アプリケーションを有効にしていることを確認してください。
組織のシステム管理者がキャンバス個人用アプリケーションを有効にする手順は次のとおりです。
1. [設定] から、[クイック検索] ボックスに「接続アプリケーション」と入力し、接続アプリケーションを管理
するオプションを選択します。
2. [アプリケーションアクセス設定] の横にある [編集] をクリックします。
3. [キャンバス個人用アプリケーションのインストールをユーザに許可する] チェックボックスをオンにしま
す。
10
Force.com Canvas の概要
キャンバス個人用アプリケーションへのアプリケーショ
ンの変更
4. [保存] をクリックします
システム管理者がこれらの手順を完了したら、開発者はキャンバスアプリケーションをキャンバス個人用アプ
リケーションとして指定できます。詳細は、「キャンバス個人用アプリケーションへのアプリケーションの変
更」 (ページ 11)を参照してください。
関連トピック:
必要なユーザ権限
キャンバス個人用アプリケーションのプロセス
キャンバス個人用アプリケーションへのアプリケーションの変更
アプリケーションの開発者は、アプリケーションを最初に作成するときにキャンバス個人用アプリケーション
として有効にすることも、既存のキャンバスアプリケーションをキャンバス個人用アプリケーションにするこ
ともできます。このプロセスには、組織設定が有効であることの確認と、アプリケーションの詳細ページの設
定を有効にする手順が含まれます。
アプリケーションをキャンバス個人用アプリケーションにする手順は次のとおりです。
• アプリケーションの対象組織のシステム管理者は、その組織のキャンバス個人用アプリケーションを有効
にする必要があります。これを行うには、[設定] から [クイック検索] ボックスに「接続アプリケーション」
と入力し、接続アプリケーションを管理するオプションを選択します。
• 次のように、アプリケーションをキャンバス個人用アプリケーションとして有効にします。
1. [場所] 項目で、[[Chatter] タブ]を選択します。キャンバス個人用アプリケーションがある場合、Chatter タ
ブのみにキャンバス個人用アプリケーションが表示されます。
2. [キャンバスアプリケーション設定] で、[キャンバス個人用アプリケーションとして有効化]チェックボッ
クスをオンにします。この設定は、[[Chatter] タブ] がアプリケーションの場所として選択されていると
きのみ使用できます。
11
Force.com Canvas の概要
キャンバス個人用アプリケーションのアンインストール
キャンバス個人用アプリケーションを作成し、そのアプリケーションへのリンクを指定すると、エンドユーザ
はそのアプリケーションにアクセスして自分でインストールできます。
関連トピック:
キャンバス個人用アプリケーションのプロセス
キャンバス個人用アプリケーションのアンインストール
ユーザがキャンバス個人用アプリケーションをインストールして許可すると、更新トークンが作成され、この
更新トークンが OAuth トークンを生成します。エンドユーザによるこのアプリケーションへのアクセスを停止
するには、この更新トークンを取り消す必要があります。このアクションによって、キャンバス個人用アプリ
ケーションが事実上アンインストールされます。
キャンバス個人用アプリケーションをアンインストールする手順は次のとおりです。
• 組織のシステム管理者が、[設定] の [接続アプリケーションの OAuth の利用状況] ページで、組織の 1 人また
はすべてのユーザの更新トークンを削除します。
• エンドユーザが、[接続アプリケーション] リストのキャンバス個人用アプリケーションを取り消します。
• システム管理者が、[設定] の [アプリケーションを管理する] ページで、組織からキャンバス個人用アプリ
ケーションを明示的にアンインストールします。このアクションによって、アプリケーションが組織から
削除されます。
キャンバス個人用アプリケーションがインストールされた後に組織のシステム管理者が組織内のキャンバス個
人用アプリケーションを無効にした場合、キャンバス個人用アプリケーションは引き続き機能します。これ
は、組織のキャンバス個人用アプリケーションの設定に関係なく、アプリケーションのバージョン番号と URL
が保持されるためです。
12
Force.com Canvas の概要
キャンバス個人用アプリケーションのアンインストール
ただし、システム管理者はアプリケーションを明示的にアンインストールして、組織内で使用できないように
完全に削除できます。
関連トピック:
署名付き要求認証
13
第2章
トピック:
•
前提条件
•
アプリケーション
の作成
•
アプリケーション
の場所の設定
クイックスタート
ここでは、Heroku のクイックスタートを使用して、Force.com Canvas の使用を簡単に
開始する方法を説明します。Heroku のクイックスタートでは、選択したテンプレー
トに応じて Java または Ruby で「hello world」アプリケーションが Heroku に作成されま
す。同時に、対応するキャンバスアプリケーションが Salesforce に作成されます。
Heroku アプリケーションは、Force.com Canvas SDK をコールする「hello world」Web ペー
ジです。これにより、現在のユーザに関する情報を表示したり、現在のユーザの
Chatter フィードを投稿したりできます。
関連トピック:
前提条件
アプリケーションの作成
アプリケーションの場所の設定
14
クイックスタート
前提条件
前提条件
クイックスタートの手順を実行するには、適切なアクセス権とツールが必要です。
• Developer Edition 組織にアクセスします。
まだ Force.com 開発者コミュニティのメンバーでない場合、developer.salesforce.com/signup にアク
セスし、Developer Edition 組織のサインアップの説明に従ってください。すでに Enterprise Edition、Unlimited
Edition、または Performance Edition を所有している場合でも、組織の使用中のデータを保護するために、サン
プルデータに対するソリューションの開発、ステージングおよびテストには Developer Edition を使用します。
これは、特に、(データをただ参照するだけのアプリケーションに対し) データを挿入、更新または削除す
るアプリケーションの場合に該当します。
既存の Developer Edition 組織があるにもかかわらず [キャンバスアプリケーションのプレビューア] メニュー
項目が [設定] に表示されない場合、Salesforce にお問い合わせください。
• 「アプリケーションのカスタマイズ」および「すべてのデータの編集」ユーザ権限。ほとんどの場合、管
理者にはすでにこれらの権限があります。管理者以外の場合、キャンバスアプリケーションのプレビュー
アを表示してキャンバスアプリケーションを作成できるようにこれらの権限を追加する必要があります。
• Heroku アカウント。https://api.heroku.com/signup に移動し、Heroku アカウントを作成します。
• 作成した「hello world」アプリケーションのローカルインスタンスを実行する Java バージョン 1.6 または 1.7
(アプリケーションの Heroku インスタンスでは、正しいバージョンの Java が自動的にダウンロードされま
す)。
関連トピック:
クイックスタート
サポート対象の Salesforce のエディション
アプリケーションの作成
アプリケーションの作成
ここでは、Heroku「hello world」アプリケーションおよびそれに関連付けられたキャンバスアプリケーションを
Salesforce 組織で作成する手順を説明します。
1. Salesforce で、[設定] から [クイック検索] ボックスに「キャンバスアプリケーションのプレビューア」と入力
し、[キャンバスアプリケーションのプレビューア] を選択します。
2. [Heroku のクイックスタート] をクリックします。
3. [テンプレート] 項目で、[Java – クイックスタートテンプレート] を選択します。
4. [キャンバスアプリケーション名] 項目に、30 文字までの一意の名前を入力します。
5. [Heroku アプリケーション名] 項目に、文字で始まり、小文字、数字、ダッシュのみを含む 30 文字までの
一意の名前を入力します。newappName は、すべての Heroku アプリケーションで一意である必要がありま
す。この名前は、newappName.herokuapp.com のようにアプリケーションの URL の一部になります。
6. [認証種別] 項目で、[ユーザ名/パスワード] を選択します。
15
クイックスタート
アプリケーションの場所の設定
7. [Heroku ユーザ名] 項目に、Heroku にログインするために使用するアカウントのユーザ名を入力します。
通常、これはメールアドレスになります。Heroku アプリケーションは、このユーザのログイン情報に基づ
いて作成されます。
メモ: この項目には、最大で 30 文字を含めることができます。Heroku ユーザ名が 30 文字を超える場
合、アカウントに関連付けられた API キーを使用する必要があります。この値は、Heroku [私の取引先]
ページで確認できます。
8. [Heroku パスワード] 項目に、Heroku にログインするために使用するアカウントのパスワードを入力しま
す。
ヒント: Heroku アカウントのユーザ名とパスワードを使用する代わりに、アカウントの関連付けられ
ている API キーを使用することもできます。この値は、Heroku [取引先] ページで確認できます。また
は、Heroku OAuth を介して Heroku OAuth フローを開始するか、現在 Heroku にログインしている場合は
Heroku トークンを使用することができます。
9. [作成] をクリックします。アプリケーションが左側のナビゲーションペインに表示されます。
「Heroku コピーである REST サービスへの POST を実行中にエラーが発生しました: 読み取りタイムアウト。」
のようなエラーが表示された場合、Heroku への接続操作がタイムアウトしたことを意味します。
http://status.heroku.com で Heroku の状況を確認できます。
10. 左側にある新しいアプリケーションへのリンクをクリックします。
アプリケーションが表示され、Hello User.FullName というメッセージと現在のユーザに関するその他
の情報が表示されます。
キャンバスアプリケーションが作成されました。「アプリケーションの場所の設定」の手順に従って、アプリ
ケーションを表示できる場所を設定するまで、キャンバスアプリケーションを表示できる場所はキャンバスア
プリケーションのプレビューアに限定されます。この手順では、各組織にアプリケーションをインストールし
た後で、ユーザがアプリケーションを参照する場所を定義します。
Heroku のクイックスタートにより、バックグラウンドでキャンバスアプリケーションの [許可されているユー
ザ] が設定されます。これには、システム管理者が承認したユーザとプロファイルが含まれます。たとえば、
ユーザプロファイルがシステム管理者の場合、そのプロファイルが作成したキャンバスアプリケーションに追
加され、そのプロファイルが設定された任意のユーザがキャンバスアプリケーションにアクセスできるように
なります。
関連トピック:
クイックスタート
前提条件
Force.com Canvas の制限
アプリケーションの場所の設定
アプリケーションの場所の設定
ここでは、Salesforce のユーザにキャンバスアプリケーションを表示する場所を指定する手順を説明します。
16
クイックスタート
アプリケーションの場所の設定
1. Salesforce アプリケーションで、[設定] から [クイック検索] ボックスに「アプリケーション」と入力し、[ア
プリケーション] を選択します。
2. [接続アプリケーション] 関連リストで、作成したアプリケーションをクリックして [編集] をクリックしま
す。
3. [キャンバスアプリケーション設定] セクションの [場所] 項目で、キャンバスアプリケーションをユーザに
表示する場所を選択します。このステップでは、[[Chatter] タブ] を選択します。
• Chatter フィード — キャンバスアプリケーションをフィードに表示します。このオプションが選択され
ている場合、CanvasPost フィード項目を作成し、現在のユーザがキャンバスアプリケーションにアクセ
スできるようにする必要があります。
• [Chatter] タブ: キャンバスアプリケーションを Chatter タブのアプリケーションナビゲーションリストに
表示します。このオプションを選択すると、キャンバスアプリケーションはその場所に自動的に表示さ
れます。
• コンソール — キャンバスアプリケーションを Salesforce コンソールのフッターまたはサイドバーに表示
します。このオプションを選択した場合、キャンバスアプリケーションをカスタムコンソールコンポー
ネントとして追加して、コンソールのどこにキャンバスアプリケーションを表示するのかを選択する必
要があります。
• レイアウトおよびモバイルカード — キャンバスアプリケーションをページレイアウトまたはモバイル
カードに表示できます。このオプションを選択した場合、ページレイアウトに追加してキャンバスアプ
リケーションが表示される場所を選択します。
• モバイルナビゲーション — キャンバスアプリケーションを Salesforce1 のナビゲーションメニューからア
クセス可能にします。
• Open CTI — キャンバスアプリケーションを通話制御ツールに表示します。このオプションを選択した場
合、キャンバスアプリケーションを表示するにはコールセンターの定義ファイルにキャンバスアプリ
ケーションを指定する必要があります。
• パブリッシャー — キャンバスアプリケーションを Chatter パブリッシャーおよび Salesforce1 アクション
バーに表示します。このオプションが選択されている場合は、キャンバスカスタムアクションを作成し
て、グローバルパブリッシャーレイアウトまたはオブジェクトのページレイアウトに追加する必要もあ
ります。
• Visualforce ページ — キャンバスアプリケーションを Visualforce ページに表示できます。Visualforce ページ
にキャンバスアプリケーションを公開するために <apex:canvasApp> コンポーネントを追加する場
合、キャンバスアプリケーションの表示場所にこの場所を必ず選択してください。これ以外の場所を選
択するとエラーになります。
4. [保存] をクリックします。
17
クイックスタート
アプリケーションの場所の設定
[[Chatter] タブ] を選択したため、Chatter タブの左側のナビゲーションペインにキャンバスアプリケーション
が表示されます。
関連トピック:
クイックスタート
アプリケーションの作成
キャンバスアプリケーションの表示場所
クイックスタート — 詳細
18
第3章
トピック:
•
前提条件
•
GitHub からのプロ
ジェクトのコピー
•
ローカルでの Web
アプリケーション
の実行
•
•
•
キャンバスアプリ
ケーションの作成
キャンバスアプリ
ケーションにアク
セスできるユーザ
の設定
Heroku への Web ア
プリケーションの
リリース
•
キャンバスアプリ
ケーションの更新
•
キャンバスアプリ
ケーションのパッ
ケージ化
•
キャンバスアプリ
ケーションパッ
ケージのアップ
ロード
•
キャンバスアプリ
ケーションのイン
ストール
•
インストール済み
キャンバスアプリ
ケーションにアク
セスできるユーザ
の設定
クイックスタート — 詳細
この詳細クイックスタートでは、Force.com Canvas のさまざまな機能を開始する方法
について説明します。キャンバスアプリケーションの作成、パッケージ、アップロー
ド、インストール、実行の各プロセスをステップごとに説明します。サンプルのキャ
ンバスアプリケーションとして、Force.com Canvas SDK をコールして現在のユーザ名を
表示する「hello world」という Web ページを使用します。
この例では、次の操作を実行します。
• GitHub から「hello world」アプリケーションをコピーする
• アプリケーションをローカル Web サーバで実行する
• Web アプリケーションをSalesforce開発組織でキャンバスアプリケーションとして
公開し、キャンバスアプリケーションのプレビューアでテストする
• Web アプリケーションを Heroku にリリースする
• キャンバスアプリケーションをパッケージ化およびアップロードする
• キャンバスアプリケーションを別のSalesforce組織にインストールし、ユーザが行
うように実行する
このクイックスタートの手順では、Windows を使用することを想定しています。別
の OS も使用できますが、手順が多少異なる場合もあります。
関連トピック:
Force.com Canvas の概要
前提条件
19
クイックスタート — 詳細
前提条件
前提条件
クイックスタートの手順を実行するには、適切なアクセス権とツールが必要です。
• キャンバスアプリケーションを作成するための Developer Edition 組織へのアクセス権。キャンバスアプリケー
ションをインストールするには、キャンバスアプリケーションを作成するために使用する Developer Edition
組織以外の Developer Edition 組織が必要になります。
まだ Force.com 開発者コミュニティのメンバーでない場合、developer.salesforce.com/signup にアク
セスし、Developer Edition 組織のサインアップの説明に従ってください。すでに Enterprise Edition、Unlimited
Edition、または Performance Edition を所有している場合でも、組織の使用中のデータを保護するために、サン
プルデータに対するソリューションの開発、ステージングおよびテストには Developer Edition を使用します。
これは、特に、(データをただ参照するだけのアプリケーションに対し) データを挿入、更新または削除す
るアプリケーションの場合に該当します。
既存の Developer Edition 組織があるにもかかわらず [キャンバスアプリケーションのプレビューア] メニュー
項目が [設定] に表示されない場合、Salesforce にお問い合わせください。
• 「アプリケーションのカスタマイズ」および「すべてのデータの編集」ユーザ権限。ほとんどの場合、管
理者にはすでにこれらの権限があります。管理者以外の場合、キャンバスアプリケーションのプレビュー
アを表示してキャンバスアプリケーションを作成できるようにこれらの権限を追加する必要があります。
• Git のインストール。https://help.github.com/articles/set-up-git に移動し、Git をインストール
して設定します。
Git のインストール後、keygen ツールを使用した SSH の設定が必要になることがあります。詳細は、
https://help.github.com/articles/generating-ssh-keysを参照してください。Windows を使用し
ている場合、このツールは Git \bin ディレクトリにあります。このディレクトリは、Git をインストールし
てもパスに追加されません。コントロールパネルを使用してパスに \bin ディレクトリを追加します。イ
ンストールディレクトリに応じて、パスは C:\Program Files (x86)\Git\bin のようになります。
• コード例をコピーする GitHub アカウント。https://github.com/plans に移動し、GitHub アカウントを設
定します。
• サンプルアプリケーションをパッケージ化する Maven 3.0 以降のインストール。
http://maven.apache.org/download.html に移動し、Maven をダウンロードしてインストールします。
• Heroku アカウント (Heroku からアプリケーションを実行する場合)。https://api.heroku.com/signup に
移動し、Heroku アカウントを作成します。
• Heroku Toolbelt (コマンドラインから Heroku アプリケーションを管理する場合)。
https://toolbelt.heroku.com に移動し、Heroku Toolbelt をダウンロードしてインストールします。
関連トピック:
クイックスタート — 詳細
サポート対象の Salesforce のエディション
GitHub からのプロジェクトのコピー
20
クイックスタート — 詳細
GitHub からのプロジェクトのコピー
GitHub からのプロジェクトのコピー
「hello world」サンプルプロジェクトは、GitHub にある Force.com Canvas SDK の一部です。ここでは、このプロジェ
クトのコピーをローカルマシンに作成する手順を説明します。
1. https://github.com にログインします。
2. https://github.com/forcedotcom/SalesforceCanvasFrameworkSDK にアクセスして、Force.com Canvas
SDK およびコード例を含むプロジェクトを検索します。
3. [Zip] をクリックし .zip ファイルをダウンロードして、プロジェクトをコピーします。
4. zip ファイルに含まれるすべてのファイルを c:\SalesforceCanvasFrameworkSDK ローカルディレクトリ
に抽出します。または、Git コマンドラインを使用し git clone
git@github.com:forcedotcom/SalesforceCanvasFrameworkSDK.git コマンドを発行して、プロジェ
クトをダウンロードすることもできます。
5. コマンドウィンドウを開き、c:\SalesforceCanvasFrameworkSDK に移動します。
6. コマンド git submodule init を入力します。
7. コマンド git submodule update を入力します。これにより、他のプロジェクトが現在のプロジェクト
に追加されます。ファイル c:\SalesforceCanvasFrameworkSDK\.gitmodules に、サブモジュールと
して含まれるプロジェクトが示されます。
プロジェクトをコピーすると、src という名前のサブディレクトリと、pom.xml および README.md という
ファイルが c:\SalesforceCanvasFrameworkSDK ディレクトリに含まれます。
関連トピック:
クイックスタート — 詳細
前提条件
ローカルでの Web アプリケーションの実行
ローカルでの Web アプリケーションの実行
ここでは、Maven で Web アプリケーションをパッケージ化し、Jetty を使用してローカルで実行する手順を説明
します。Web アプリケーションをパッケージ化する場合、このプロセスにより、Web アプリケーションの実行
に必要なすべてのコンポーネント (Jetty を含む) がダウンロードされます。
1. コマンドウィンドウを開き、c:\SalesforceCanvasFrameworkSDK に移動します。
2. コマンド mvn package を入力します。Maven によってアプリケーションとその連動コンポーネントがパッ
ケージ化されると、コマンドウィンドウに出力が表示されます。このプロセスが正常に完了すると、次の
ような出力が表示されます。
[INFO]
[INFO]
[INFO]
[INFO]
[INFO]
-----------------------------------------------------------------------BUILD SUCCESS
-----------------------------------------------------------------------Total time: 28.016s
Finished at: Tue Jul 03 08:00:42 PDT 2012
21
クイックスタート — 詳細
ローカルでの Web アプリケーションの実行
[INFO] Final Memory: 8M/59M
[INFO] ------------------------------------------------------------------------
3. Jetty を使用してアプリケーションを実行するには、ローカル SSL サポートを有効にする必要があります。こ
の手順はアプリケーションごとに 1 回実行すれば済むため、すでに実行している場合はスキップします。
コマンドウィンドウが開いていて、現在の場所がディレクトリ c:\SalesforceCanvasFrameworkSDK で
あることを確認します。
4. コマンド keytool -keystore keystore -alias jetty -genkey -keyalg RSA を実行します。
このコマンドを実行すると、次の情報の入力を要求されます。キーストアのパスワードとして 123456 と
入力し、最後に yes と入力して確定します。「Enter key password for <jetty>」というメッセージが表示された
場合、Enter を押してキーストアのパスワードを使用します。その他の情報については、値を入力しても空
白のままにしても問題ありません。
Enter keystore password: <Choose Your Password>
Re-enter new password: <Choose Your Password>
What is your first and last name?
[Unknown]: <Enter First and Last Name>
What is the name of your organizational unit?
[Unknown]: <Enter an Org Unit>
What is the name of your organization?
[Unknown]: <Enter an Org>
What is the name of your City or Locality?
[Unknown]: <Enter a City>
What is the name of your State or Province?
[Unknown]: <Enter a State>
What is the two-letter country code for this unit?
[Unknown]: <Enter a Country>
Is CN=XXXX, OU=XXXX, O=XXXX, L=XXXX, ST=XX, C=XX correct?
[no]: yes
Enter key password for <jetty>
(RETURN if same as keystore password):
これにより、ディレクトリ c:\SalesforceCanvasFrameworkSDK に keystore という名前のファイルが
作成されます。キーストアは、SSL をサポートするために Jetty で使用されます。
5. target\bin\webapp.bat コマンド (Windows) または sh target/bin/webapp コマンド (Unix/OS X) を実行
して Web サーバを実行します。
Unix/OS X を使用している場合は、必要に応じて実行前に実行権限を webapp に追加します。これを行うに
は、chmod +x target/bin/webapp コマンドを使用します。
6. ブラウザを開いて https://localhost:8443/examples/hello-world/index.jsp の URL に移動し、
アプリケーションが実行されていることを確認します。
署名されていない SSL 証明書でサイトを実行しているため、ブラウザやセキュリティ設定によってはセキュ
リティ例外を追加する必要が生じる場合もあります。
「This App must be invoked via a signed request!」というメッセージが表示されます。これは、Web アプリケーショ
ンがローカルで実行されていることを意味します。このメッセージが表示されるのは、Salesforce から署名
22
クイックスタート — 詳細
キャンバスアプリケーションの作成
付き要求を受信するようにアプリケーションが設計されているためです。そのため、アプリケーションは
Salesforce キャンバス環境外では実行されません。
関連トピック:
クイックスタート — 詳細
GitHub からのプロジェクトのコピー
キャンバスアプリケーションの作成
キャンバスアプリケーションの作成
ここでは、Salesforce組織でキャンバスアプリケーションを作成する手順を説明します。キャンバスアプリケー
ションを作成するユーザには、「アプリケーションのカスタマイズ」権限と「すべてのデータの編集」権限が
必要です。
1. Salesforce で、[設定] から [クイック検索] ボックスに「アプリケーション」と入力し、[アプリケーション] を
選択します。
2. [接続アプリケーション] 関連リストで、[新規] をクリックします。
3. [接続アプリケーション名] 項目で、「Hello World」と入力します。
4. Hello_World のデフォルトの [API 名] を受け入れます。これは、キャンバスアプリケーションの内部名で
あり、保存後に変更することはできません。
5. [取引先責任者 メール] 項目で、メールアドレスを入力します。
6. [ロゴ画像 URL] 項目で、https://localhost:8443/images/salesforce.png と入力します。これは、
Salesforceのデフォルトの「ソフトウェアなし」画像です。この画像は、インストール画面とアプリケーショ
ンの詳細画面に表示されます。
7. [アイコン URL] 項目で、https://localhost:8443/examples/hello-world/logo.png と入力しま
す。これは、Salesforce のデフォルトの「ソフトウェアなし」画像です。
これは、ユーザインターフェースでアプリケーション名の横に表示される画像です。この項目を空白のま
まにすると、デフォルトの雲の画像がアプリケーション名の横に表示されます。
8. API ([OAuth 設定の有効化]) セクションで、[OAuth 設定の有効化] 項目を選択します。
9. [コールバック URL] 項目で、https://localhost:8443/sdk/callback.html と入力します。
10. [選択した OAuth 範囲] 項目で、[基本情報へのアクセス] を選択します。
11. [キャンバスアプリケーション設定] セクションで、[Force.com キャンバス] を選択します。
12. [キャンバスアプリケーションの URL] 項目で、
https://localhost:8443/examples/hello-world/index.jsp と入力します。
13. [アクセス方法] 項目で、[署名付き要求 (POST)] を選択します。
14. [場所] 項目で、Chatter タブを選択します。
15. [保存] をクリックします。キャンバスアプリケーションを保存すると、詳細ページが表示されます。
23
クイックスタート — 詳細
キャンバスアプリケーションの作成
16. キャンバスアプリケーションの詳細ページで、[コンシューマの秘密] 項目の横にある [クリックして公開]
リンクをクリックします。アプリケーションでは、コンシューマの秘密を使用して認証が行われます。
17. コンシューマの秘密の値を選択し、Ctrl+C を押してコピーします。
18. コマンドウィンドウに移動し、Ctrl+C を押して Jetty Web サーバを停止します。メッセージに従って、「Y」
と入力します。
19. CANVAS_CONSUMER_SECRET という環境変数を作成し、コピーしたコンシューマの秘密にその値を設定し
ます。この操作を Windows で行うには、コマンドウィンドウで set
CANVAS_CONSUMER_SECRET=value_you_just_copied と入力します。
Unix/OS X を使用している場合は、コマンド export CANVAS_CONSUMER_SECRET=value_you_just_copied
で環境変数を設定します。
次のコードに示すように、「hello world」ページ
(c:\SalesforceCanvasFrameworkSDK\src\main\webapp\examples\hello-world\index.jsp) でコ
ンシューマの秘密が使用されます。
<%@ page import="canvas.SignedRequest" %>
<%@ page import="java.util.Map" %>
<%
// Pull the signed request out of the request body and verify and decode it.
Map<String, String[]> parameters = request.getParameterMap();
String[] signedRequest = parameters.get("signed_request");
if (signedRequest == null) {%>
This app must be invoked via a signed request!<%
return;
}
String yourConsumerSecret=System.getenv("CANVAS_CONSUMER_SECRET");
String signedRequestJson = SignedRequest.verifyAndDecodeAsJson(signedRequest[0],
yourConsumerSecret);
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<title>Hello World Canvas Example</title>
<link rel="stylesheet" type="text/css" href="/sdk/css/connect.css" />
<script type="text/javascript" src="/sdk/js/canvas-all.js"></script>
<!-- Third part libraries, substitute with your own -->
<script type="text/javascript" src="/scripts/json2.js"></script>
<script>
if (self === top) {
// Not in an iFrame.
alert("This canvas app must be included within an iFrame");
}
Sfdc.canvas(function() {
24
クイックスタート — 詳細
キャンバスアプリケーションにアクセスできるユーザの
設定
var sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.byId('username').innerHTML = sr.context.user.fullName;
});
</script>
</head>
<body>
<br/>
<h1>Hello <span id='username'></span></h1>
</body>
</html>
20. target\bin\webapp.bat コマンド (Windows) または sh target/bin/webapp (Unix/OS X) コマンドを実行
して、Web サーバを再起動します。
関連トピック:
クイックスタート — 詳細
ローカルでの Web アプリケーションの実行
キャンバスアプリケーションの表示場所
必要なユーザ権限
Force.com Canvas の制限
キャンバスアプリケーションにアクセスできるユーザの設定
キャンバスアプリケーションにアクセスできるユーザの設定
Salesforce でキャンバスアプリケーションを作成しました。次に、特定のユーザのアクセス権を設定しましょ
う。
1. Salesforce で、[設定] から [クイック検索] ボックスに 「接続アプリケーション」と入力し、接続アプリケー
ションの管理のオプションを選択します。
2. Hello World アプリケーションをクリックし、[編集] をクリックします。
3. [許可されているユーザ] 項目で、[管理者が承認したユーザは事前承認済み] を選択します。表示されるポッ
プアップメッセージで [OK] をクリックします。
[管理者が承認したユーザは事前承認済み] を選択したので、ユーザには、権限を付与するまでキャンバス
アプリケーションは表示されません。[すべてのユーザは自己承認可能] を選択すると、ユーザにはキャン
バスアプリケーションが表示されますが、ユーザがそのアクセスを承認または拒否する必要があります。
4. [保存] をクリックします
ここで、キャンバスアプリケーションにアクセスできるユーザを定義します。これを行うには、プロファ
イルと権限セットを使用します。この例では、プロファイルがシステム管理者であると想定しています。
5. [プロファイル] 関連リストで、[プロファイルを管理する] をクリックします。
6. [システム管理者] プロファイルを選択し、[保存] をクリックします。
25
クイックスタート — 詳細
Heroku への Web アプリケーションのリリース
7. Salesforce で、[設定] から [クイック検索] ボックスに「キャンバスアプリケーションのプレビューア」と入力
し、[キャンバスアプリケーションのプレビューア] を選択します。キャンバスアプリケーションのプレ
ビューアを使用して、キャンバスアプリケーションを公開する前にテストできます。
8. 左側の [Hello World] リンクをクリックします。
アプリケーションが表示され、Hello User.FullName というメッセージが表示されます。プレビューア
でアプリケーション名をクリックすると署名付き要求がエンドポイント
https://localhost:8443/examples/hello-world/index.jsp に送信され、このコンテキストでキャ
ンバスアプリケーションが動作します。
アクセスを設定すると、キャンバスアプリケーションのプレビューアおよび開発組織のChatterタブにキャンバ
スアプリケーションが表示されます。
関連トピック:
クイックスタート — 詳細
キャンバスアプリケーションの作成
Heroku への Web アプリケーションのリリース
Heroku への Web アプリケーションのリリース
ここまでのステップでは、「hello world」Web アプリケーションをローカルで実行し、キャンバスアプリケー
ションとして追加して、テストを実施しました。キャンバスアプリケーションがローカルで動作しているの
で、「hello world」Web アプリケーションを Heroku にリリースしてそこから実行します。これを行う手順は、次
のとおりです。
1. Heroku へのログインと Heroku Toolbelt のインストールをまだ行っていない場合は、「前提条件」に記載され
ているリンクからこれらを実行します。
2. コマンドウィンドウを開き、c:\SalesforceCanvasFrameworkSDK に移動して、コマンド git init を
入力します。これにより、ディレクトリが Git リポジトリとして再初期化されます。
3. コマンドウィンドウで、コマンド heroku create を入力します。これにより、新しい「シェル」アプリ
ケーションが Heroku に作成されます。
アプリケーションが作成されたことを示す次のような確認メッセージが表示されます。
Creating deep-samurai-7923... done, stack is cedar
http://deep-samurai-7923.herokuapp.com/ | git@heroku.com:deep-samurai-7923.git
Git remote heroku added
4. この Heroku アプリケーションの名前を変更するには、コマンドウィンドウでコマンド heroku rename
newAppName -—app oldAppName を入力します。
この例では、oldAppName は deep-samurai-7923 です。作成する newAppName は、文字で始まる必要があり、
小文字、数字、ダッシュのみを使用できます。残りの確認メッセージは次のようになります。
http://newappName.herokuapp.com/ | git@heroku.com:newappName.git
26
クイックスタート — 詳細
Heroku への Web アプリケーションのリリース
newappName は、すべての Heroku アプリケーションで一意である必要があります。この名前は、
newappName.herokuapp.com のようにアプリケーションの URL の一部になります。
5. コマンドウィンドウで、コマンド git add -A を実行します。これにより、SalesforceCanvasFrameworkSDK プ
ロジェクト全体が Git リポジトリに追加されます。Windows 環境で作業している場合、CRLF (行頭復帰/改行)
で置き換えられた LF (改行) に関するメッセージが表示されることがあります。
6. コマンドウィンドウで、コメントと共にコマンド git commit —m “MyChangeComments” を入力して、
変更をコミットします。
7. コマンドウィンドウで、コマンド git push heroku master を入力して、変更を Heroku にリリースしま
す。
このプロセスが正常に完了すると、次のような出力が表示されます。
[INFO]
[INFO]
[INFO]
[INFO]
[INFO]
[INFO]
[INFO]
------------------------------------------------BUILD SUCCESS
------------------------------------------------Total time: 13.188s
Finished at: Sat Feb 09 21:14:23 UTC 2013
Final Memory: 11M/490M
-------------------------------------------------
「権限が拒否されました」というエラーメッセージが表示された場合、必要に応じて SSH キーを設定して
Heroku に追加します。https://devcenter.heroku.com/articles/keys を参照してください。
8. コマンドウィンドウを開き、コンシューマの秘密を含む Heroku 環境変数を設定します。これを行うには、
コマンド heroku config:add CANVAS_CONSUMER_SECRET=consumer_secret_value を入力して
consumer_secret_value を、コピーした値に置き換えます。
キャンバスアプリケーションのコンシューマの秘密を取得するには、[設定] から [クイック検索] ボックス
に「アプリケーション」と入力し、[アプリケーション] を選択して Hello World アプリケーションをクリック
します。[OAuth 設定] セクションに [コンシューマの秘密] 項目が表示されます。
9. ブラウザを開いて https://newappName.herokuapp.com/examples/hello-world/index.jsp の URL
に移動し、Heroku でアプリケーションが実行されていることを確認します。
「This App must be invoked via a signed request!」というメッセージが表示されます。これは、アプリケーション
が Heroku で実行されていることを意味します。このメッセージが表示されるのは、Salesforce から署名付き
要求を受信するようにアプリケーションが設計されているためです。そのため、アプリケーションはSalesforce
キャンバス環境外では実行されません。
関連トピック:
クイックスタート — 詳細
キャンバスアプリケーションにアクセスできるユーザの設定
キャンバスアプリケーションの更新
27
クイックスタート — 詳細
キャンバスアプリケーションの更新
キャンバスアプリケーションの更新
ここでは、Heroku で実行されている「hello world」アプリケーションを実行するようにキャンバスアプリケー
ションを更新する手順を説明します。
1. Salesforce で、[設定] から [クイック検索] ボックスに「アプリケーション」と入力し、[アプリケーション] を
選択します。
2. [接続アプリケーション] 関連リストで、[Hello World] をクリックします。
3. [編集] をクリックします。
4. [ロゴ画像 URL] 項目で、https://appName.herokuapp.com/images/salesforce.png と入力します。
これは、Salesforce のデフォルトの「ソフトウェアなし」画像です。この画像は、インストール画面とアプ
リケーションの詳細画面に表示されます。appName は、作成した Heroku アプリケーションの名前です。
5. [アイコン URL] 項目で、https://appName.herokuapp.com/examples/hello-world/logo.png と入
力します。これは、Salesforce のデフォルトの「ソフトウェアなし」画像です。
これは、Chatter タブまたはキャンバスアプリケーションのプレビューアのアプリケーション名の横に表示
される画像です。この項目を空白のままにすると、デフォルトの雲の画像がアプリケーション名の横に表
示されます。appName は、作成した Heroku アプリケーションの名前です。
6. [コールバック URL] 項目で、https://appName.herokuapp.com/sdk/callback.html と入力します。
appName は、作成した Heroku アプリケーションの名前です。
7. [キャンバスアプリケーションの URL] 項目で、
https://appName.herokuapp.com/examples/hello-world/index.jsp と入力します。appName は、
作成した Heroku アプリケーションの名前です。
8. [保存] をクリックします。キャンバスアプリケーションを保存すると、詳細ページが表示されます。
9. Salesforce で、[設定] から [クイック検索] ボックスに「キャンバスアプリケーションのプレビューア」と入力
し、[キャンバスアプリケーションのプレビューア] を選択します。キャンバスアプリケーションのプレ
ビューアを使用して、再度パッケージ化する前にキャンバスアプリケーションをテストできます。
10. 左側の [Hello World] リンクをクリックします。
アプリケーションが表示されて、Hello User.FullName というメッセージが表示されます。プレビュー
アでアプリケーション名をクリックすると署名付き要求がエンドポイント
https://appName.herokuapp.com/examples/hello-world/index.jsp に送信され、このコンテキス
トでキャンバスアプリケーションが動作します。
この例では、作成したキャンバスアプリケーションと同じキャンバスアプリケーションを使用しますが、Heroku
で実行されている「hello world」Web アプリケーションを指し示すように更新します。そのため、以前に「hello
world」アプリケーションに追加したコンシューマの秘密を更新する必要はありません。
28
クイックスタート — 詳細
キャンバスアプリケーションのパッケージ化
Heroku で実行されている「hello world」アプリケーションを表示する新しいキャンバスアプリケーションを
Salesforceに作成する場合、「キャンバスアプリケーションの作成」に進み、新しいアプリケーションを作成し
てアプリケーションのコンシューマの秘密を更新し、変更を Heroku にリリースします。
関連トピック:
クイックスタート — 詳細
Heroku への Web アプリケーションのリリース
キャンバスアプリケーションのパッケージ化
キャンバスアプリケーションのパッケージ化
キャンバスアプリケーションの作成、キャンバスアプリケーションのプレビューアでのテスト、Heroku へのリ
リースが完了し、キャンバスアプリケーションをパッケージ化して配布する準備ができました。パッケージ化
は、キャンバスアプリケーションを別の組織にインストールできるようにするための最初のステップです。
パッケージ化についての詳細は、『ISVforce ガイド』 を参照してください。
1. Salesforce で、[設定] から [クイック検索] ボックスに「パッケージ」と入力し、[パッケージ] を選択して [新
規] をクリックします。
ヒント: キャンバスアプリケーションをパッケージ化して別の組織にインストールするには、名前空
間プレフィックスを作成する必要があります。名前空間プレフィックスは、Developer Edition 組織での
み定義できます。詳細は、オンラインヘルプの「名前空間プレフィックスの登録」トピックを参照し
てください。
2. [パッケージ名] 項目を「Hello World Package」に設定し、他の項目はデフォルトを使用します。
3. [管理] 項目を選択して、パッケージを組織の管理パッケージにします。
4. 管理パッケージは 1 つのみ有効であることを示すメッセージが表示されます。[OK] をクリックします。
5. [保存] をクリックします。
6. パッケージは空であるため、[追加] をクリックします。
7. [コンポーネントの種類] 項目で、[接続アプリケーション] を選択します。
8. Hello World アプリケーションの横にあるチェックボックスをオンにし、[パッケージに追加] をクリックしま
す。[パッケージの詳細] 画面が表示されます。[設定] から、[クイック検索] ボックスに「パッケージ」と入
力し、[パッケージ] を選択して新しい管理パッケージを表示します。
29
クイックスタート — 詳細
キャンバスアプリケーションパッケージのアップロード
これで、作成したパッケージをアップロードし、インストールリンクを取得する準備ができました。インス
トールリンクを使用して、キャンバスアプリケーションを別の組織にインストールします。
関連トピック:
クイックスタート — 詳細
キャンバスアプリケーションの更新
http://www.salesforce.com/us/developer/docs/packagingGuide/index_Left.htm#StartTopic=Content/packaging_about_packages.htm
キャンバスアプリケーションパッケージのアップロード
CanvasLifecycleHandler クラスの配布
キャンバスアプリケーションパッケージのアップロード
キャンバスアプリケーションのパッケージ化が完了し、パッケージをアップロードする準備ができました。こ
れにより、インストールリンクが作成されます。このインストールリンクは、キャンバスアプリケーションを
組織にインストールする必要のある任意のユーザに提供できます。
1. Salesforce で、[設定] から [クイック検索] ボックスに「パッケージ」と入力し、[パッケージ] を選択します。
2. [パッケージ] リストで、[Hello World パッケージ] リンクをクリックします。
3. [パッケージの詳細] ページで、[アップロード] をクリックして管理パッケージを公開します。
4. [バージョン名] 項目に「Winter 2014 Beta」と入力します。デフォルトのバージョン番号 (1.0) とリリース種別
([管理—ベータ]) をそのまま使用します。
5. [アップロード] をクリックします。
メモ: キャンバスアプリケーションを作成していない組織にのみ、キャンバスアプリケーションをイ
ンストールできます。
アップロードが完了したら、[バージョンの詳細] ページが表示されます。[インストール URL] 項目には、別の組
織にキャンバスアプリケーションをインストールするために使用できる URL が表示されます。また、インス
トール URL が記載された通知メールも受信します。
関連トピック:
クイックスタート — 詳細
キャンバスアプリケーションのパッケージ化
http://www.salesforce.com/us/developer/docs/packagingGuide/index_Left.htm#StartTopic=Content/packaging_distributing.htm
キャンバスアプリケーションのインストール
キャンバスアプリケーションのインストール
パッケージ化されたキャンバスアプリケーションをアップロードすると、インストールリンクが作成されま
す。このリンクを使用して、キャンバスアプリケーションを別の組織にインストールできます。ベータパッ
30
クイックスタート — 詳細
インストール済みキャンバスアプリケーションにアクセ
スできるユーザの設定
ケージは、Sandbox 組織または Developer Edition 組織にのみインストールできます。他の組織にインストールす
ると、エラーになります。
1. ブラウザを開き、ブラウザのアドレスバーにキャンバスアプリケーションのインストール URL を入力しま
す。キャンバスアプリケーションを開発中の場合は、アプリケーションをインストールする前に開発組織
から必ずログアウトしてください。
インストール URL は、
https://login.instance.salesforce.com/services/packaging/installPackage.apexp?p0=04eU0000000AWNA
のようになります。
2. メッセージが表示されたら、パッケージをインストールしている組織のログイン情報を入力します。
3. [パッケージインストールの詳細] ページが表示されます。[パッケージコンポーネント] リストに、Hello World
キャンバスアプリケーションが表示されます。[次へ] をクリックします。
4. [次へ] をクリックし、さらに [インストール] をクリックします。
パッケージのインストールが正常に完了すると、メール通知が送信されます。
関連トピック:
クイックスタート — 詳細
キャンバスアプリケーションパッケージのアップロード
サポート対象の Salesforce のエディション
インストール済みキャンバスアプリケーションにアクセスできるユーザの設定
インストール済みキャンバスアプリケーションにアクセスできる
ユーザの設定
キャンバスアプリケーションをSalesforce組織にインストールしても、ユーザアクセスを設定するまでは、誰も
アプリケーションを表示することはできません。
1. Salesforce で、[設定] から [クイック検索] ボックスに 「接続アプリケーション」と入力し、接続アプリケー
ションの管理のオプションを選択します。
2. Hello World アプリケーションをクリックし、[編集] をクリックします。
3. [許可されているユーザ] 項目で、[管理者が承認したユーザは事前承認済み] を選択します。表示されるポッ
プアップメッセージで [OK] をクリックします。
4. [保存] をクリックします。
ここで、キャンバスアプリケーションを表示できるユーザを定義します。これを行うには、プロファイル
と権限セットを使用します。この例では、「システム管理者」権限を持つユーザにアプリケーションへの
アクセスを許可します。
5. [接続アプリケーションの詳細] ページの [プロファイル] 関連リストで、[プロファイルを管理する] をクリッ
クします。
6. [システム管理者] プロファイルを選択し、[保存] をクリックします。
31
クイックスタート — 詳細
インストール済みキャンバスアプリケーションにアクセ
スできるユーザの設定
7. Chatter タブをクリックします。
8. 左側の [Hello World] リンクをクリックします。
アプリケーションが表示され、Hello User.FullName というメッセージが表示されます。
関連トピック:
クイックスタート — 詳細
キャンバスアプリケーションのインストール
32
Force.com Canvas の使用
第4章
トピック:
•
Force.com Canvas
SDK の参照
•
認証
•
キャンバスアプリ
ケーションでのコ
ンテキストの取得
•
クロスドメイン
XHR
•
キャンバスアプリ
ケーションのサイ
ズ変更
•
キャンバスアプリ
ケーションイベン
トの実装
•
Force.com Canvas SDK
Force.com Canvas は、Salesforce 内でアプリケーションを統合できるツールセットです。
このフレームワークには SDK が含まれており、これを使用してアプリケーションを
認証し、Salesforce からデータを取得できます。Force.com Canvas SDK とコード例は、
https://github.com/forcedotcom/salesforcecanvasframeworksdk の GitHub
で入手できます。
Force.com Canvas SDK にはバージョンが設定されており、各リリースの API のバージョ
ンと一致します。現在のバージョンは37.0です。所有している SDK のバージョンは、
version メソッドをコールして確認できます。この開発者ガイドの以前のバージョ
ンは、
https://developer.salesforce.com/page/Earlier_Reference_Documentation
にあります。
関連トピック:
Force.com Canvas SDK の参照
認証
キャンバスアプリ
ケーションでのス
トリーミング API の
使用
キャンバスアプリケーションでのコンテキストの取得
•
キャンバスアプリ
ケーションのデ
バッグ
キャンバスアプリケーションイベントの実装
•
キャンバスアプリ
ケーションでの
<select> タグの使用
クロスドメイン XHR
キャンバスアプリケーションのサイズ変更
33
Force.com Canvas SDK の参照
Force.com Canvas SDK
Force.com Canvas SDK の参照
Force.com Canvas SDK は GitHub から入手できます。また、キャンバスアプリケーションから参照するには次の 2
つの方法があります。
• SDK を自分の Web サーバでホストして、そこからアクセスする
• Salesforce サーバにホストされた SDK にアクセスする
SDK を自分の Web サーバでホストする場合の include ステートメントの例は次のとおりです。
<script type="text/javascript" src="/sdk/js/canvas-all.js"></script>
ホストされた SDK を参照する場合の include ステートメントの例は次のとおりです。
<script type="text/javascript"
src="https://<instance>.salesforce.com/canvas/sdk/js/37.0/canvas-all.js"></script>
Salesforce サーバにある SDK を参照する機能は、Web アプリケーションにある SDK ファイル、あるいは Visualforce
ページを含める場合に便利です。
関連トピック:
Force.com Canvas SDK
認証
認証
キャンバスアプリケーションを作成する場合は、次のいずれかの認証方法を使用できます。
• 署名付き要求 — キャンバスアプリケーションのデフォルトの認証方法。署名付き要求認証フローは、シス
テム管理者がキャンバスアプリケーションへのアクセス権をユーザに付与できるようにキャンバスアプリ
ケーションを設定しているかどうか、またはユーザが自己承認できるかどうかによって異なります。シス
テム管理者がユーザのキャンバスアプリケーションへのアクセスを許可した場合、またはユーザが承認/拒
否 OAuth フローでキャンバスアプリケーションを承認した場合、コンシューマキー、アクセストークン、
およびその他のコンテキスト情報を含む署名付き要求がキャンバスアプリケーションに提供されます。
• OAuth 2.0 — キャンバスアプリケーションでは、認証とアクセストークンの取得に OAuth 2.0 プロトコルを使
用できます。OAuth と Force.com プラットフォームについての詳細は、
https://developer.salesforce.com/page/Digging_Deeper_into_OAuth_2.0_on_Force.com を
参照してください。
関連トピック:
Force.com Canvas SDK
http://www.salesforce.com/us/developer/docs/api_rest/index_Left.htm#StartTopic=Content/intro_understanding_authentication.htm
キャンバスアプリケーションのユーザフロー — 署名付き要求
キャンバスアプリケーションのユーザフロー — OAuth
34
署名付き要求認証
Force.com Canvas SDK
署名付き要求認証
これは、キャンバスアプリケーションのデフォルトの認証方法です。署名付き要求認証フローは、キャンバス
アプリケーションの [許可されているユーザ] 項目が [管理者が承認したユーザは事前承認済み] と [すべてのユー
ザは自己承認可能] のどちらに設定されているかによって異なります。
許可されているユーザの
値
キャンバスアプリ ユーザがキャンバス
ケーションのアク アプリケーションを
セシビリティ
承認する必要がある
タイミング
POST または GET の動作
管理者が承認したユーザ システム管理者が
は事前承認済み
アプリケーション
を組織にインス
トールし、参照権
限を付与するユー
ザを設定すれば、
ユーザはすぐにア
プリケーションへ
アクセスできるよ
うになります。
ユーザによるアク
セスの承認や拒否
は必要ありませ
ん。
不要
Salesforce は、更新トークンを含む、署
名付き要求のボディに含まれるすべて
の認証情報を使用してキャンバスアプ
リケーションへの POST を実行します。
すべてのユーザは自己承 すべてのユーザが
認可能
アプリケーション
にアクセスできま
すが、ユーザはア
プリケーションへ
のアクセスを承認
または拒否するよ
うに要求されま
す。
• ユーザがアプリ
ケーションを初
めて開いたとき
ユーザが以前にアプリケーションを承
認していて、アクセスが取り消された
り期限切れになったりしていない場合、
Salesforce は署名付き要求ペイロードを
使用してキャンバスアプリケーション
への POST を実行します。
• システム管理者
によってアクセ
ストークンが取
り消された場合
• システム管理者
がトークンに時
間制限を設定し
ていてその時間
制限を超えた場
合
35
ユーザがアプリケーションを承認して
いない場合、またはアクセスが取り消
されているか期限切れになっている場
合、Salesforce はキャンバスアプリケー
ション URL への GET を実行します。キャ
ンバスアプリケーションは、コールを
受け入れて URL パラメータ
_sfdc_canvas_authvalue を検索し、
GET を処理する必要があります。このパ
ラメータ値を受け取ったキャンバスア
署名付き要求認証
Force.com Canvas SDK
許可されているユーザの
値
キャンバスアプリ ユーザがキャンバス
ケーションのアク アプリケーションを
セシビリティ
承認する必要がある
タイミング
POST または GET の動作
プリケーションは、OAuth フローの承認
または拒否を開始する必要があります。
_sfdc_canvas_authvalue =
user_approval_required
OAuth フローが開始されてユーザがアプ
リケーションを承認したら、キャンバ
スアプリケーションは true のパラメー
タを使用して repost() メソッドを
コールし、署名付き要求を取得する必
要があります。
署名付き要求情報は、クライアントの秘密を使用して検証でき、アプリケーションのカスタマイズと、Salesforce
への後続のコールを行うために使用されます。
署名付き要求は、次の要素を連結した文字列です。
• HMAC SHA–256 アルゴリズムで暗号化されたキャンバスアプリケーションのコンシューマの秘密
• ピリオド ( . )
• Base64 で JSON 符号化されたコンテキストおよび認証トークン
署名付き要求は、次のように非常に長くなります。
9Rpl6rE7R2bSNjoSfYdERk8nffmgtKQNhr5U/5eSJPI=.eyJjb250ZXh0Ijp7InVzZXIiOnsibGFuZ3V....。
署名付き要求の考慮事項
• Salesforce は、キャンバスアプリケーション URL を呼び出すときに、[許可されているユーザ] の値や、更新
トークンが返されるかどうかに応じて、HTTP POST または GET を実行します。
• 要求の検証と復号化には、サーバ側のコードが必要です。
• 署名付き要求は、アプリケーションを呼び出した後に SDK を使用してオンデマンドで要求できます。
関連トピック:
認証
署名付き要求の検証および復号化
キャンバスアプリケーションのユーザフロー — 署名付き要求
署名付き要求の要求
キャンバスアプリケーションのユーザフロー — 署名付き要求
以下は、署名付き要求認証を使用するキャンバスアプリケーションのユーザフローを図解したものです。
36
署名付き要求認証
Force.com Canvas SDK
関連トピック:
署名付き要求認証
SignedRequest
署名付き要求の検証および復号化
署名付き要求の検証および復号化
署名付き要求を使用している場合、Salesforceはユーザコンテキストと認証情報をキャンバスアプリケーション
の URL に送信します。署名付き要求を有効にするには、キャンバスアプリケーションの特定のコンシューマの
秘密を使用して、署名付き要求が署名されたことを確認する必要があります。正しいコンシューマの秘密が使
用されていた場合はそのコンテキストを信頼できますが、そうでない場合、その要求がSalesforceによって開始
されなかったと想定できます。署名付き要求を検証および復号化するには、アプリケーションで次の操作を行
う必要があります。
1. Salesforce からの最初の署名付き要求を含む POST メッセージを受信します。
37
署名付き要求認証
Force.com Canvas SDK
2. 最初の期間で、署名付き要求を分割します。この結果、コンシューマの秘密で署名されたハッシュ済み
Based64 コンテキストと、Base64 で符号化されたコンテキスト自体という 2 つの文字列が生成されます。
3. HMAC SHA-256 アルゴリズムを使用して、Base64 で符号化されたコンテキストをハッシュし、コンシューマ
の秘密を使用してそれに署名します。
4. 前のステップで作成した文字列を Base64 で符号化します。
5. Base64 で符号化された文字列と、ステップ 2 で受け取ったコンシューマの秘密で署名されたハッシュ済み
Base64 コンテキストを比較します。
2 つの値が同じである場合、署名付き要求は自分のコンシューマの秘密で署名されたものであり、信頼できる
ことがわかります。これで、符号化されたコンテキストを Base64 で復号化し、必要な値を解析できるようにな
ります。これらの値についての詳細は、「CanvasRequest」を参照してください。2 つの文字列が異なる場合、
その要求は自分のコンシューマの秘密を使用してハッシュおよび署名されていなかったことになります。この
場合、ユーザに適切なメッセージを返す必要があります。
検証および復号化用の関数
Force.com Canvas SDK (SalesforceCanvasFrameworkSDK\src\main\java\canvas\SignedRequest.java 内)
にある次のいずれかの関数をコールして、署名付き要求を検証できます。
• verifyAndDecode — Java オブジェクトとして、検証および復号化されたバージョンの署名付き要求を返
します。
• verifyAndDecodeAsJson — JSON 形式の文字列として、検証および復号化されたバージョンの署名付き要
求を返します。
次のコード例に、SDK の関数を使用して署名付き要求を検証および復号化する方法を示します。このコード
は、署名された秘密と Base64 JSON 文字列を解析するときに、署名付き要求の文字列を分割します。次に、HMAC
SHA-256 アルゴリズムを使用して署名されたキャンバスアプリケーションのコンシューマの秘密を暗号化し、
その暗号化された値と、Salesforce によって送信された、暗号化された値を比較します。
2 つの値が同じである場合、そのコンテキストは有効で、Salesforce から生成されたことがわかります。2 つの
値が異なる場合、その要求は Salesforce から行われたものではありません。
/**
*
* The utility method can be used to validate/verify the signed request.
* In this case, the signed request is verified that it's from Salesforce and that
* it has not been tampered with.
*
* This utility class has two methods. One verifies and decodes the request
* as a Java object, the other as a JSON String.
*
*/
public class SignedRequest {
public static CanvasRequest verifyAndDecode(String input, String secret)
throws SecurityException {
String[] split = getParts(input);
String encodedSig = split[0];
String encodedEnvelope = split[1];
// Deserialize the JSON body.
38
署名付き要求認証
Force.com Canvas SDK
String json_envelope = new String(new Base64(true).decode(encodedEnvelope));
ObjectMapper mapper = new ObjectMapper();
ObjectReader reader = mapper.reader(CanvasRequest.class);
CanvasRequest canvasRequest;
String algorithm;
try {
canvasRequest = reader.readValue(json_envelope);
algorithm = canvasRequest.getAlgorithm() == null ?
"HMACSHA256" : canvasRequest.getAlgorithm();
} catch (IOException e) {
throw new SecurityException(String.format("Error [%s] deserializing JSON to
Object [%s]", e.getMessage(), CanvasRequest.class.getName()), e);
}
verify(secret, algorithm, encodedEnvelope, encodedSig);
// If we got this far, then the request was not tampered with.
// Return the request as a Java object.
return canvasRequest;
}
public static String verifyAndDecodeAsJson(String input, String secret)
throws SecurityException {
String[] split = getParts(input);
String encodedSig = split[0];
String encodedEnvelope = split[1];
String json_envelope = new String(new Base64(true).decode(encodedEnvelope));
ObjectMapper mapper = new ObjectMapper();
String algorithm;
StringWriter writer;
TypeReference<HashMap<String,Object>> typeRef
= new TypeReference<HashMap<String, Object>>() { };
try {
HashMap<String,Object> o = mapper.readValue(json_envelope, typeRef);
writer = new StringWriter();
mapper.writeValue(writer, o);
algorithm = (String)o.get("algorithm");
} catch (IOException e) {
throw new SecurityException(String.format("Error [%s] deserializing
JSON to Object [%s]", e.getMessage(),
typeRef.getClass().getName()), e);
}
verify(secret, algorithm, encodedEnvelope, encodedSig);
// If we got this far, then the request was not tampered with.
// Return the request as a JSON string.
return writer.toString();
}
private static String[] getParts(String input) {
if (input == null || input.indexOf(".") <= 0) {
throw new SecurityException(String.format("Input [%s] doesn't
look like a signed request", input));
}
String[] split = input.split("[.]", 2);
return split;
}
39
署名付き要求認証
Force.com Canvas SDK
private static void verify(String secret, String algorithm,
String encodedEnvelope, String encodedSig )
throws SecurityException
{
if (secret == null || secret.trim().length() == 0) {
throw new IllegalArgumentException("secret is null, did you
set your environment variable CANVAS_CONSUMER_SECRET?");
}
SecretKey hmacKey = null;
try {
byte[] key = secret.getBytes();
hmacKey = new SecretKeySpec(key, algorithm);
Mac mac = Mac.getInstance(algorithm);
mac.init(hmacKey);
// Check to see if the body was tampered with.
byte[] digest = mac.doFinal(encodedEnvelope.getBytes());
byte[] decode_sig = new Base64(true).decode(encodedSig);
if (! Arrays.equals(digest, decode_sig)) {
String label = "Warning: Request was tampered with";
throw new SecurityException(label);
}
} catch (NoSuchAlgorithmException e) {
throw new SecurityException(String.format("Problem with algorithm [%s]
Error [%s]", algorithm, e.getMessage()), e);
} catch (InvalidKeyException e) {
throw new SecurityException(String.format("Problem with key [%s]
Error [%s]", hmacKey, e.getMessage()), e);
}
// If we got here and didn't throw a SecurityException then all is good.
}
}
verifyAndDecode 関数のコール
次のコードに、署名付き要求を取得し、verifyAndDecode 関数を使用して要求を検証および復号化する例を
示します。
// From a JSP or servlet.
<%@ page import="canvas.SignedRequest" %>
<%@ page import="java.util.Map" %>
<%
// Pull the signed request out of the request body and verify/decode it.
Map<String, String[]> parameters = request.getParameterMap();
String[] signedRequest = parameters.get("signed_request");
if (signedRequest == null) {%>
This app must be invoked via a signed request!<%
return;
}
String yourConsumerSecret=System.getenv("CANVAS_CONSUMER_SECRET");
String signedRequest = SignedRequest.verifyAndDecode(signedRequest[0],
yourConsumerSecret);
%>
...
40
署名付き要求認証
Force.com Canvas SDK
// From JavaScript, you can handle the signed request as needed.
var signedRequest = '<%=signedRequestJson%>';
verifyAndDecodeAsJson 関数のコール
次のコードに、署名付き要求を取得し、verifyAndDecodeAsJson 関数を使用して要求を検証および復号化
して、返された JSON 結果を解析する例を示します。
// From a JSP or servlet.
<%@ page import="canvas.SignedRequest" %>
<%@ page import="java.util.Map" %>
<%
// Pull the signed request out of the request body and verify/decode it.
Map<String, String[]> parameters = request.getParameterMap();
String[] signedRequest = parameters.get("signed_request");
if (signedRequest == null) {%>
This App must be invoked via a signed request!<%
return;
}
String yourConsumerSecret=System.getenv("CANVAS_CONSUMER_SECRET");
String signedRequestJson = SignedRequest.verifyAndDecodeAsJson(signedRequest[0],
yourConsumerSecret);
%>
...
// From JavaScript, you can parse with your favorite JSON library.
var signedRequest = JSON.parse('<%=signedRequestJson%>');
関連トピック:
署名付き要求認証
SignedRequest
署名付き要求の要求
認証に署名付き要求を使用するようにキャンバスアプリケーションが設定されている場合、SDK を使用して署
名付き要求をオンデマンドで要求できます。アプリケーションの読み込み時に使用された署名付き要求の再送
信、または新しい署名付き要求の送信を Salesforce に要求できます。署名付き要求の送信要求は、期限切れの
セッションを更新する場合や、アプリケーションがリダイレクトされた後に認証情報を取得する場合に役立ち
ます。
署名付き要求は、SDK の refreshSignedRequest() または repost() JavaScript メソッドを使用してオンデマ
ンドで要求できます。refreshSignedRequest() は、コールバックを介して新しい署名付き要求を返しま
す。repost() は、キャンバスアプリケーションに対する新しい POST の開始を親ウィンドウに要求し、更新
された署名付き要求を含むアプリケーションページを再読み込みします。
アプリケーションの署名付き要求を更新する必要がある場合は、常にこれらの方法を使用します。次に、署名
付き要求情報を更新する必要が生じる可能性のあるシナリオ例を示します。
• 通常、署名付き要求内の OAuth トークンは、2 時間後に有効期限が切れます。OAuth トークンの有効期限が
切れているが、追加の API 要求を実行する必要がある場合、refreshSignedRequest() をコールすること
で、ユーザの作業を中断することなく新しい OAuth トークンを取得できます。
41
署名付き要求認証
Force.com Canvas SDK
• 特に複数のシステムでシングルサインオン機能を提供する場合、キャンバスアプリケーションでリダイレ
クトを使用する必要が生じることがあります。キャンバスアプリケーションでリダイレクトを使用すると、
最初の署名付き要求情報を含む元のリクエストボディはリダイレクト URL で受信されません。新しいメソッ
ドを使用して、署名付き要求を再試行できます。
• Summer '14 以降では、キャンバスアプリケーションはユーザ承認アプリケーションになる可能性がありま
す。ユーザ承認アプリケーションがユーザによって承認されていない場合、最初の署名付き要求 POST はア
プリケーションで取得されません。代わりに、OAuth でアプリケーションを承認する必要があります。その
後、repost() をコールして署名付き要求を取得できます。
これらの方法を使用するには、認証で署名付き要求を使用するようにキャンバスアプリケーションを設定する
必要があります。また、「Force.com Canvas SDK の参照」で説明されているように JavaScript コードで
canvas-all.js を参照する必要もあります。
要求が成功したら、返された SignedRequest 情報をキャンバスアプリケーションで検証する必要があります。
Salesforceから受信する署名付き要求情報の検証についての詳細は、「署名付き要求の検証および復号化」を参
照してください。
refreshSignedRequest() を使用した署名付き要求の取得
refreshSignedRequest() を使用して、指定のコールバックを介して新しい署名付き要求を行います。この
例では、応答コードをチェックするコールバックで refreshSignedRequest() がコールされ、署名付き要
求が、コンシューマの秘密で署名されたハッシュ済み Based64 コンテキストと、Base64 で符号化されたコンテ
キスト自体に解析されます。
// Gets a signed request on demand.
Sfdc.canvas.client.refreshSignedRequest(function(data) {
if (data.status === 200) {
var signedRequest = data.payload.response;
var part = signedRequest.split('.')[1];
var obj = JSON.parse(Sfdc.canvas.decode(part));
}
}
repost() を使用した署名付き要求の取得
repost() を使用して、新しい POST をキャンバスアプリケーション URL に送信するように親ウィンドウに指示
します。POST には、アプリケーションの読み込み時に使用された署名付き要求または新しい署名付き要求が
含まれます。refreshSignedRequest() とは異なり、repost() を使用すると、キャンバスアプリケーショ
ンページが再読み込みされます。次の例では、repost() をコールして、元の署名付き要求を行います。
// Gets a signed request on demand, without refreshing the signed request.
Sfdc.canvas.client.repost();
42
OAuth 認証
Force.com Canvas SDK
次の例では、repost() をコールして、新しい署名付き要求を行います。
// Gets a signed request on demand, first by refreshing the signed request.
Sfdc.canvas.client.repost({refresh : true});
関連トピック:
署名付き要求認証
SignedRequest
署名付き要求の検証および復号化
OAuth 認証
Force.com Canvas では、OAuth 2.0 による認証をサポートしています。OAuth を使用する場合、次の 2 つのオプショ
ンがあります。
• Web サーバ OAuth 認証フロー — ユーザは、キャンバスアプリケーションを実行するときに、ユーザのデー
タにアクセスするアプリケーションを認証できます。この場合、各ユーザがキャンバスアプリケーション
で情報へアクセスできるようにする必要があります。詳細は、『Force.com REST API 開発者ガイド』「Web サー
バ OAuth 認証フローについて」を参照してください。
• ユーザエージェント OAuth 認証フロー — ユーザは、キャンバスアプリケーションを実行するときに、ブラ
ウザだけを使用してユーザのデータにアクセスするアプリケーションを認証できます。Web サーバ OAuth
認証と同様に、このオプションでは各ユーザがキャンバスアプリケーションで情報へアクセスできるよう
にする必要があります。
更新トークンが提供されないため、この認証方法は開発でのみ使用し、本番では使用しないことをお勧め
します。この種類の認証では、サーバ側のコードは不要で、開発マシンをインターネットに公開する必要
がありません。ただし、本番環境では、OAuth フローが発生するたびにユーザはアプリケーションの承認ま
たは拒否を求められるため、更新トークンがないと不便です。詳細は、『Force.com REST API 開発者ガイド』
「ユーザエージェント OAuth 認証フローについて」を参照してください。
実装する OAuth フローに関係なく、キャンバスアプリケーションは、標準ベースの OAuth フローを開始するた
めのコードを提供する必要があります。OAuth には次のような考慮事項があります。
• Salesforce は、キャンバスアプリケーション URL を呼び出すときに HTTP GET を実行します。
• ユーザエージェント OAuth では、すべての認証がブラウザで実行できます (サーバ側のコードは不要です)。
OAuth と Force.com プラットフォームについての詳細は、
https://developer.salesforce.com/page/Digging_Deeper_into_OAuth_2.0_on_Force.com を参照
してください。
OAuth 認証を使用する既存の接続アプリケーションをキャンバスアプリケーションとして公開する場合、2 つ
のオプションがあります。1 つ目は、既存のアプリケーションを編集して新バージョンを作成し、キャンバス
アプリケーション情報を追加する方法です。この場合、アプリケーションは引き続き同じクライアント ID と
コンシューマの秘密を使用できます。2 つ目のオプションは、新しいキャンバスアプリケーションを作成する
43
OAuth 認証
Force.com Canvas SDK
方法です。この場合、新しいクライアント ID とコンシューマの秘密を取得し、その情報でアプリケーション
を更新する必要があります。
関連トピック:
認証
キャンバスアプリケーションのユーザフロー — OAuth
キャンバスアプリケーションのユーザフロー — OAuth
キャンバスアプリケーションで OAuth 認証を使用している場合、キャンバスアプリケーションがユーザイン
ターフェースのどこに配置されているのかや、ユーザアクセス権がどのように設定されているかによってユー
ザエクスペリエンスが異なります。以下は、OAuth 認証を使用するキャンバスアプリケーションのユーザフロー
を図解したものです。
44
OAuth 認証
Force.com Canvas SDK
関連トピック:
OAuth 認証
OAuth フローの開始
45
OAuth 認証
Force.com Canvas SDK
OAuth フローの開始
次のコード例に、キャンバスアプリケーションで OAuth を使用して認証プロセスを開始する方法を示します。
<html>
<head>
<script type="text/javascript" src="/sdk/js/canvas-all.js"></script>
</head>
<body>
<script>
function loginHandler(e) {
var uri;
if (! Sfdc.canvas.oauth.loggedin()) {
uri = Sfdc.canvas.oauth.loginUrl();
Sfdc.canvas.oauth.login(
{uri : uri,
params: {
response_type : "token",
client_id : "3MVG9lKcPoNINVBLigmW.8dAn4L5HwY VBzxbW5FFdzvU0re2
f7o9aHJNUpY9ACdh.3SUgw5rF2nSsC9_cRqzD",
redirect_uri : encodeURIComponent(
"https://demoapp1234.herokuapp.com/sdk/callback.html")
}});
}
else {
Sfdc.canvas.oauth.logout();
login.innerHTML = "Login";
Sfdc.canvas.byId("oauth").innerHTML = "";
}
return false;
}
// Bootstrap the page once the DOM is ready.
Sfdc.canvas(function() {
// On Ready...
var login
= Sfdc.canvas.byId("login"),
loggedIn = Sfdc.canvas.oauth.loggedin(),
token = Sfdc.canvas.oauth.token()
login.innerHTML = (loggedIn) ? "Logout" : "Login";
if (loggedIn) {
// Only displaying part of the OAuth token for better formatting.
Sfdc.canvas.byId("oauth").innerHTML = Sfdc.canvas.oauth.token()
.substring(1,40) + "…";
}
login.onclick=loginHandler;
});
</script>
<h1 id="header">Force.com Canvas OAuth App</h1>
<div>
access_token = <span id="oauth"></span>
</div>
<div>
<a id="login" href="#">Login</a><br/>
46
キャンバスアプリケーションの SAML シングルサインオ
ン
Force.com Canvas SDK
</div>
</body>
</html>
関連トピック:
OAuth 認証
キャンバスアプリケーションの SAML シングルサインオン
署名付き要求と OAuth 認証のどちらを使用する場合でも、SAML ベースのシングルサインオン (SSO) を使用して
ユーザにシームレスな認証フローを提供できます。Salesforceを ID プロバイダまたはサービスプロバイダとして
活用できます。SAML SSO では、SAML を介したキャンバスアプリケーションへの自動認証、および署名付き要
求を介した Salesforce への認証をユーザに提供できます。
Security Assertion Markup Language (SAML) は、Web でユーザを認証するための XML ベースの標準です。これにより、
2 つのドメイン間で認証データをやりとりできます。この機能を使用して、ユーザによって開かれるときに標
準の SAML 認証フローを開始するキャンバスアプリケーションを作成できます。このプロセスが完了したら、
ユーザは Web アプリケーションに対して認証されます。
署名付き要求認証を使用するキャンバスアプリケーションの場合、Force.com Canvas SDK に含まれる 2 つのメソッ
ドによって、キャンバスアプリケーションで Salesforce をコールして直接新しい署名付き要求を受け取るか、
Salesforceから Web アプリケーションエンドポイントに署名付き要求を再送信できます。これによって、エンド
ツーエンドの認証フローが完了します。
refreshSignedRequest メソッド
コールバックを介して新しい署名付き要求を返します。SAML SSO プロセスの完了後、アプリケーションは
このメソッドをコールし、新しい署名付き要求を受け取ることができます。このメソッドは、よりクライ
アント側の JavaScript アプローチを使用して署名付き要求を取得する必要がある開発者向けです (Force.com
Canvas SDK がアプリケーションに署名付き要求を送信)。
repost メソッド
キャンバスアプリケーションに対する POST の開始を親ウィンドウに要求し、更新された署名付き要求を含
むアプリケーションページを再読み込みします。SAML SSO プロセスの完了後、アプリケーションでこのメ
ソッドをコールすることができ、新しい署名付き要求が POST を介してアプリケーションに送信されます。
このメソッドは、よりサーバ側のアプローチを使用して署名付き要求を取得する必要がある開発者向けで
す (Salesforce がサーバに署名付き要求を POST 送信)。
メモ: SAML の開始方法 Identity Provider Initiated は、Force.com コミュニティのキャンバスアプ
リケーションではサポートされていません。
キャンバスアプリケーションでのコンテキストの取得
署名付き要求を使用してキャンバスアプリケーションを認証すると、キャンバスアプリケーション URL への
POST の一部として CanvasRequest オブジェクト (Context オブジェクトが含まれる) を取得します。認証に OAuth を
使用する場合やコンテキスト情報を取得するためにコールする場合は、JavaScript コールを行います。
47
クロスドメイン XHR
Force.com Canvas SDK
次のコードサンプルは、JavaScript コールでコンテキストを取得する例を示しています。このコードでは、テキ
ストが「Get Context」のリンクを作成し、そのリンクから Sfdc.canvas.client.ctx 関数をコールします。
<script>
function callback(msg) {
if (msg.status !== 200) {
alert("Error: " + msg.status);
return;
}
alert("Payload: ", msg.payload);
}
var ctxlink = Sfdc.canvas.byId("ctxlink");
var client = Sfdc.canvas.oauth.client();
ctxlink.onclick=function() {
Sfdc.canvas.client.ctx(callback, client)};
}
</script>
<a id="ctxlink" href="#">Get Context</a>
関連トピック:
Force.com Canvas SDK
Context
CanvasRequest コンテキストデータの絞り込み
クロスドメイン XHR
キャンバスアプリケーションは、iFrame の Salesforce ページにロードされます。このため、キャンバスアプリ
ケーションは (それ自体のドメインでは) XHR (XML HTTP 要求) のコールを *.salesforce.com ドメインに返すことはで
きません。独自のプロキシを SDK の一部として作成およびリリースできますが、Force.com Canvas には、JavaScript
で作成されたクライアント側のプロキシが用意されています。このプロキシを使用して、クライアント側の
XHR コールを Salesforce に返すことができます。
クライアントからこのプロキシを使用して XHR 要求を作成すると、API によってその要求が外部の iFrame に転
送され、要求が自動的に送信されます。要求が完了すると、SDK はその結果を使用してクライアントのコール
バック関数をコールします。XHR コールを作成する方法の例として、次のようなものがあります。
• Chatter ユーザリストの取得
• Chatter フィードへの投稿
メモ: SDK ではクロスドメイン XHR コールがサポートされていますが、同じドメインコールの作成には使
用しないでください。
関連トピック:
Force.com Canvas SDK
48
Chatter ユーザリストの取得
Force.com Canvas SDK
Chatter ユーザリストの取得
次のコード例に、Chatter ユーザリストを返すためのコールを示します。
// Paste the signed request string into a JavaScript object for easy access.
var sr = JSON.parse('<%=signedRequestJson%>');
// Reference the Chatter user's URL from Context.Links object.
var chatterUsersUrl = sr.context.links.chatterUsersUrl;
// Make an XHR call back to salesforce through the supplied browser proxy.
Sfdc.canvas.client.ajax(chatterUsersUrl,
{client : sr.client,
success : function(data){
// Make sure the status code is OK.
if (data.status === 200) {
// Alert with how many Chatter users were returned.
alert("Got back " + data.payload.users.length +
" users"); // Returned 2 users
}
}});
関連トピック:
クロスドメイン XHR
Context
Links
Chatter フィードへの投稿
次のコード例に、コンテキストユーザの Chatter フィードに項目を投稿するためのコールを示します。
var sr = JSON.parse('<%=signedRequestJson%>');
// Reference the Chatter user's URL from Context.Links object.
var url = sr.context.links.chatterFeedsUrl+"/news/"+sr.context.user.userId+"/feed-items";
var body = {body : {messageSegments : [{type: "Text", text: "Some Chatter Post"}]}};
Sfdc.canvas.client.ajax(url,
{client : sr.client,
method: 'POST',
contentType: "application/json",
data: JSON.stringify(body),
success : function(data) {
if (201 === data.status) {
alert("Success");
}
49
キャンバスアプリケーションのサイズ変更
Force.com Canvas SDK
}
});
関連トピック:
クロスドメイン XHR
Context
Links
キャンバスアプリケーションのサイズ変更
Force.com Canvas は、キャンバスアプリケーションのサイズを変更するメソッドを提供します。これらのメソッ
ドに関するすべてのリファレンスドキュメントは、SDK およびこちらにあります。
• autogrow: キャンバス iFrame のコンテンツサイズを確認するタイマーを開始または停止し、フレームを調
節します。「自動的なキャンバスアプリケーションのサイズ変更」を参照してください。
• resize: キャンバス iFrame のサイズを変更するように親ウィンドウに通知します。「明示的なキャンバス
アプリケーションのサイズ変更」を参照してください。
• size: キャンバス iFrame の現在のサイズを返します。「キャンバスアプリケーションのサイズの取得」を参
照してください。
• subscribe: 親イベントを登録します。現在、canvas 名前空間でサポートされている親イベントは、(親の)
canvas.scroll のみです。「親イベントの登録」を参照してください。
注意: キャンバスアプリケーションでサイズ変更機能を使用するには、キャンバスアプリケーションに関
連付けられている HTML ページの一番初めに DOCTYPE 宣言を記述する必要があります。たとえば、<!DOCTYPE
html> のように記述します。
関連トピック:
Force.com Canvas SDK
自動的なキャンバスアプリケーションのサイズ変更
次のコード例に、autogrow メソッドをコールしてキャンバスアプリケーションのサイズを変更する方法を示
します。このメソッドは、コンテンツのサイズがいつ変更されるかが不明な場合に使用します。
メモ: Mozilla® Firefox® および Microsoft® Internet Explorer® では、コンテンツサイズを縮小した場合に autogrow
メソッドでフレームのサイズが変更されないことがあります。この場合は、resize メソッドを使用し
て、変更後のフレームの正確なサイズを指定できます。
// Turn on auto grow with default settings.
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.autogrow(sr.client);
});
50
明示的なキャンバスアプリケーションのサイズ変更
Force.com Canvas SDK
// Turn on auto grow with polling interval of 100ms (milliseconds).
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.autogrow(sr.client, true, 100);
});
// Turn off auto grow.
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.autogrow(sr.client, false);
});
関連トピック:
キャンバスアプリケーションのサイズ変更
明示的なキャンバスアプリケーションのサイズ変更
明示的なキャンバスアプリケーションのサイズ変更
次のコード例に、resize メソッドをコールしてキャンバスアプリケーションのサイズを変更する方法を示し
ます。高さと幅のパラメータを指定しない場合、親ウィンドウはキャンバスアプリケーションの高さをそのコ
ンテンツに基づいて判断しようと試み、その結果に応じて iFrame の幅と高さを設定します。
// Automatically determine the size.
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.resize(sr.client);
});
// Set the height and width explicitly.
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.resize(sr.client, {height : "1000px", width : "900px"});
});
// Set only the height.
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.resize(sr.client, {height : "1000px"});
});
関連トピック:
キャンバスアプリケーションのサイズ変更
自動的なキャンバスアプリケーションのサイズ変更
キャンバスアプリケーションのサイズの取得
51
キャンバスアプリケーションのサイズの取得
Force.com Canvas SDK
キャンバスアプリケーションのサイズの取得
次のコード例に、size メソッドをコールしてキャンバスアプリケーションのサイズを取得する方法を示しま
す。console.log 関数でフレームサイズが出力されるため、キャンバスアプリケーションのサイズを変更し
ながら、サイズの変化を確認できます。
// Get the canvas app sizes in the sizes object.
var sizes = Sfdc.canvas.client.size();
console.log("contentHeight; " + sizes.heights.contentHeight);
console.log("pageHeight; " + sizes.heights.pageHeight);
console.log("scrollTop; " + sizes.heights.scrollTop);
console.log("contentWidth; " + sizes.widths.contentWidth);
console.log("pageWidth; " + sizes.widths.pageWidth);
console.log("scrollLeft; " + sizes.widths.scrollLeft);
// Resize the canvas app.
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.autogrow(sr.client);
});
関連トピック:
キャンバスアプリケーションのサイズ変更
親イベントの登録
親イベントの登録
次のコード例に、subscribe メソッドをコールして、キャンバスアプリケーションが親イベントを登録でき
るようにする方法を示します。この例では、ユーザが親ウィンドウでスクロールすると起動する onscroll
イベントを処理します。
//Subscribe to the parent window onscroll event.
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
// Capture the onScrolling event of the parent window
Sfdc.canvas.client.subscribe(sr.client,
{name : 'canvas.scroll', onData : function (event) {
console.log("Parent's contentHeight; " + event.heights.contentHeight);
console.log("Parent's pageHeight; " + event.heights.pageHeight);
console.log("Parent's scrollTop; " + event.heights.scrollTop);
console.log("Parent's contentWidth; " + event.widths.contentWidth);
console.log("Parent's pageWidth; " + event.widths.pageWidth);
console.log("Parent's scrollLeft; " + event.widths.scrollLeft);
}}
52
キャンバスアプリケーションの方向の変更の処理
Force.com Canvas SDK
);
});
関連トピック:
キャンバスアプリケーションのサイズ変更
キャンバスアプリケーションの方向の変更の処理
orientation イベントでは、モバイルデバイスでキャンバスアプリケーションが表示される方向の変更を処
理できます。キャンバスアプリケーションをこのイベントに登録すると、親ウィンドウで window.orientation
イベントが実行されるたびにこのイベントも実行されます。このイベントは、次の値を含むペイロードを返し
ます。
値
説明
clientHeight
キャンバスアプリケーションを表示するデバイ
スに固有のアプリケーションの高さ (ピクセル
単位)。
clientWidth
キャンバスアプリケーションを表示するデバイ
スに固有のアプリケーションの幅 (ピクセル単
位)。
orientation
次のいずれかの値を含みます。
• 0: 横から縦に変更
• 90: 縦から横に変更
• -90: 反時計回りに縦から横に変更
次のコードの例は、orientation イベントに登録する方法を示しています。
// Capture the orientation event of the parent window.
Sfdc.canvas.client.subscribe(sr.client,
{name : 'canvas.orientation',
onData : function (event) {
console.log("Parent's orientation: " + event.orientation +
"Canvas app height: " + event.clientHeight +
"Canvas app width: " + event. clientWidth);
}} );
});
メモ: orientation イベントは、Windows Phone ではサポートされていません。
関連トピック:
キャンバスアプリケーションのサイズ変更
親イベントの登録
53
キャンバスアプリケーションイベントの実装
Force.com Canvas SDK
キャンバスアプリケーションイベントの実装
イベントは、キャンバスアプリケーション間でイベントを送受信する JavaScript ベースの方法を提供します。イ
ベントを使用すると、単一ページ上の複数のキャンバスアプリケーション間のコミュニケ ションが可能にな
ります。
1 つのシナリオとして、あるページで旅行と費用のアプリケーションと承認アプリケーションという 2 つのキャ
ンバスアプリケーションを公開するとします。費用レポートの状況が変化すると、イベントが発生してその費
用レポートのデータ (JSON 形式) を取得するようなイベントを作成できます。承認キャンバスアプリケーション
はそのイベントを登録し、イベントが発生したときにコールされる関数を指定します。状況が変化すると、承
認アプリケーションはそのイベントを受信し、指定された関数が実行されます。
Force.com Canvas は、キャンバスアプリケーションにカスタムイベントを実装するメソッドを提供します。これ
らのメソッドに関するすべてのリファレンスドキュメントは、SDK およびこちらにあります。
• publish: その他のキャンバスアプリケーションまたは Visualforce ページが登録できるカスタムイベントを
作成します。「キャンバスアプリケーションイベントの作成」を参照してください。
• subscribe: 親イベントまたはカスタムイベントを登録します。このメソッドは、複数のイベントを登録す
るために使用できます。「キャンバスアプリケーションイベントの登録」を参照してください。
• unsubscribe: 親イベントまたはカスタムイベントから登録解除します。このメソッドは、複数のイベント
から登録解除するために使用できます。「キャンバスアプリケーションイベントからの登録解除」を参照
してください。
メモ: subscribe メソッドおよび unsubscribe メソッドは、単一のストリーミング API イベントの登録
にも使用できます。
関連トピック:
Force.com Canvas SDK
キャンバスアプリケーションイベントの考慮事項
キャンバスアプリケーションでのストリーミング API の使用
キャンバスアプリケーションイベントの考慮事項
キャンバスアプリケーションイベントを実装するときの考慮事項は、次のとおりです。
• イベントに名前を付ける場合は名前空間を使用することをお勧めしますが、必須ではありません。
• イベントの名前空間は、Salesforceの組織の名前空間とは異なります。ただし、名前空間を使用する場合は、
イベントと組織の名前空間を同じにすることをお勧めします。
• 名前空間は、ピリオドを含まない文字列である必要があります。たとえば、my.name.space.statusChanged
は無効です。名前空間を含む有効なイベント名の例は mynamespace.statusChanged です。
• 次の名前は予約されており、名前空間には使用できません。
– canvas
– chatter
– force
– publisher
54
キャンバスアプリケーションイベントの作成
Force.com Canvas SDK
– salesforce
– sfdc
• イベントは、同じページのキャンバスアプリケーション間でのみ動作します。Chatter タブにあるキャンバ
スアプリケーションでは、Visualforce ページのキャンバスアプリケーションで公開されるイベントを登録で
きません。
• subscribe コールでは複数のカスタムイベントを登録できます。
• subscribe コールでは、ストリーミング API イベントを 1 つのみ登録できます。
• 同じ subscribe コールを使用してカスタムイベントとストリーミング API イベントを登録することはでき
ません。
• 1 つの配列で名前が同じ複数のイベントを定義した場合は、最後に定義されたイベントのみが有効です。次
の例では、Status が Negotiating である最後のイベントが使用されます。
Sfdc.canvas.client.subscribe(sr.client, [
{
name :"mynamespace.statusChanged",
payload : {status : 'Closed'}
},
{
name:"mynamespace.statusChanged",
payload : {status : 'Negotiating'}
]);
これは、ストリーミング API イベントにも当てはまります。
関連トピック:
キャンバスアプリケーションイベントの実装
キャンバスアプリケーションイベントの作成
次のコード例に、publish メソッドをコールしてキャンバスアプリケーションイベントを作成する方法を示
します。名前空間を使用している場合は、イベント名の先頭に名前空間を指定する必要があります。たとえ
ば、namespace.eventName を指定します。
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.publish(sr.client,
{name : "mynamespace.statusChanged", payload : {status : 'Completed'}});
});
関連トピック:
キャンバスアプリケーションイベントの実装
キャンバスアプリケーションイベントの作成
55
キャンバスアプリケーションイベントの登録
Force.com Canvas SDK
キャンバスアプリケーションイベントの登録
カスタムイベントの登録
次のコード例に、subscribe メソッドをコールして 1 つのキャンバスアプリケーションイベントを登録する
方法を示します。
// Subscribe to a custom event.
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.subscribe(sr.client,
{name : 'mynamespace.statusChanged', onData : function (event) {
console.log("Subscribed to custom event ", event);
}}
);
});
複数のカスタムイベントの登録
次のコード例に、subscribe メソッドをコールして複数のキャンバスアプリケーションイベントを登録する
方法を示します。登録するイベントは、異なる名前空間に存在していても、名前空間がなくてもかまいませ
ん。キャンバスアプリケーションにイベントを登録すると、(他のキャンバスアプリケーションにある) イベン
トと (登録するキャンバスアプリケーションにある) 関数間の関係が作成されます。
// Subscribe to multiple events.
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.subscribe(sr.client, [
{name : 'mynamespace.statusChanged', onData : handler1},
{name : 'anothernamespace.tripCancelled', onData : handler2},
]);
});
旅行と費用のキャンバスアプリケーションと承認キャンバスアプリケーションの例では、承認キャンバスアプ
リケーションに handler1 および handler2 という 2 つの関数があります。承認キャンバスアプリケーショ
ンは、旅行と費用のキャンバスアプリケーションにある mynamespace.statusChanged および
mynamespace.tripCancelled という 2 つのイベントに登録されます。承認アプリケーションで
mynamespace.statusChanged イベントを受け取ると、関数 handler1 がコールされます。承認アプリケー
ションで anothernamespace.tripCancelled イベントを受け取ると、関数 handler2 がコールされます。
関連トピック:
キャンバスアプリケーションイベントの実装
親イベントの登録
キャンバスアプリケーションイベントからの登録解除
56
キャンバスアプリケーションイベントからの登録解除
Force.com Canvas SDK
キャンバスアプリケーションイベントからの登録解除
カスタムイベントからの登録解除
次のコード例に、unsubscribe メソッドをコールして 1 つのキャンバスアプリケーションイベントから登録
解除する方法を示します。
// Unsubscribe from a custom event.
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.unsubscribe(sr.client, {name : "mynamespace.statusChanged"});
});
複数のカスタムイベントからの登録解除
次のコード例に、unsubscribe メソッドをコールして複数のキャンバスアプリケーションイベントから登録
解除する方法を示します。登録するイベントは、異なる名前空間に存在していても、名前空間がなくてもかま
いません。
// Unsubscribe from multiple events.
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.unsubscribe(sr.client, ['mynamespace.statusChanged',
"anothernamespace.tripCancelled"]);
});
関連トピック:
キャンバスアプリケーションイベントの実装
キャンバスアプリケーションイベントの登録
親イベントの登録
キャンバスアプリケーションでのストリーミング API の使用
Force.com Canvas には、キャンバスアプリケーションがストリーミング API 通知をリスンできるようにするイベ
ントとメソッドがあります。
• sfdc.streamingapi — 作成後、PushTopic によって定義されたストリーミング API チャネルに関連付る
JavaScript イベントです。「ストリーミング API イベントの使用」を参照してください。
• subscribe — 定義する sfdc.streamingapi イベントを登録します。「ストリーミング API イベントの登
録」を参照してください。
57
ストリーミング API イベントの使用
Force.com Canvas SDK
• unsubscribe — sfdc.streamingapi イベントから登録解除します。「ストリーミング API イベントから
の登録解除」を参照してください。
関連トピック:
ストリーミング API イベントの使用
ストリーミング API イベントの登録
ストリーミング API イベントからの登録解除
http://www.salesforce.com/us/developer/docs/api_streaming/index.htm
ストリーミング API イベントの使用
Force.com Canvas SDK には、sfdc.streamingapi と呼ばれるイベントが含まれています。このイベントでは、
キャンバスアプリケーションでイベントを定義し、そのイベントをストリーミング API チャネルに関連付ける
ことができます。その後、subscribe メソッドを使用してイベントを登録し、ストリーミング API通知を受信
します。
たとえば、Salesforce では、InvoiceStatement が更新され状況が [完了] に変更した場合に通知を受信するストリー
ミング API を作成できます。その後、キャンバスアプリケーションで、そのチャネルに関連付けられたイベン
トを作成し、そのイベントを登録できます。Salesforceでは、請求書明細が完了すると、有効化されたキャンバ
スアプリケーションで通知を受信し、メッセージをユーザに表示するなどの操作を実行できます。
ストリーミング API イベントを定義する場合、次のような考慮事項があります。
• イベントは、PushTopic 名を含む 1 つのパラメータを受け付けます。
• PushTopic 名の先頭に「/topic/」と指定する必要があります。
{name:"sfdc.streamingapi", params:{topic:"/topic/myPushTopicName"}}
関連トピック:
キャンバスアプリケーションでのストリーミング API の使用
ストリーミング API イベントの登録
ストリーミング API イベントの登録
次のコード例に、subscribe メソッドをコールして、キャンバスアプリケーションでストリーミング APIイベ
ントを登録できるようにする方法を示します。イベントを登録するには、キャンバスアプリケーションイベン
トの登録に使用する標準の sfdc.canvas.client.subscribe メソッドをコールします。subscribe メソッ
ドをコールする場合、クライアントおよびストリーミング API イベントを渡す必要があります。ストリーミン
グ API 通知を受信できるのは、開いており、イベントを登録したキャンバスアプリケーションのみです。
この例の onComplete メソッドは、コードでイベントが正常に登録された後で実行する関数を指定します。
onData メソッドは、イベントでストリーミング API 通知を受信したときに実行する関数を指定します。
//
//
//
//
Subscribe to Streaming API events.
The PushTopic to subscribe to must be passed in.
The 'onComplete' method may be defined,
and will fire when the subscription is complete.
58
ストリーミング API イベントからの登録解除
Force.com Canvas SDK
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
var handler1 = function(){ console.log("onData done");},
handler2 = function(){ console.log("onComplete done");};
Sfdc.canvas.client.subscribe(sr.client,
{name : 'sfdc.streamingapi', params:{topic:"/topic/InvoiceStatements"}},
onData : handler1, onComplete : handler2}
);
});
subscribe メソッドをコールすると、REST コールが行われ、ストリーミング API への接続に必要な OAuth 範囲
がキャンバスアプリケーションに設定されていることが確認されます。このため、キャンバスアプリケーショ
ンでストリーミング API イベントを登録するたびに、1 つの API コールが使用され、組織の API 要求数の制限に
カウントされます。ストリーミング API に接続するには、キャンバスアプリケーションに最低でも「データへ
のアクセスと管理 (API)」OAuth 範囲が必要です。
subscribe メソッドへのコールが成功した場合、ペイロード {success:true,handle:handle} で
onComplete メソッドがコールされます。handle は、登録先のストリーミング API チャネルの名前が含まれ
る配列で、subscriptionId は一意の ID が含まれる整数です。たとえば、["/topics/InvoiceStatements",
subscriptionId] です。subscribe メソッドへのコールが失敗した場合、ペイロード
{success:false,errorMessage:msg} で onComplete メソッドがコールされます。msg は、エラーの原因
が含まれる文字列です。
ストリーミング API 通知を受け取るには、PushTopic によって定義されたチャネルを作成する必要があります。
詳細は、『Streaming API 開発者ガイド』の「ステップ 2: PushTopic を作成する」を参照してください。
関連トピック:
ストリーミング API イベントの使用
ストリーミング API イベントからの登録解除
ストリーミング API イベントからの登録解除
次のコード例に、unsubscribe メソッドをコールして、キャンバスアプリケーションがストリーミング API
イベントから登録解除できるようにする方法を示します。
//Unsubscribe from Streaming API events.
//The PushTopic to unsubscribe from must be passed in.
Sfdc.canvas(function() {
sr = JSON.parse('<%=signedRequestJson%>');
Sfdc.canvas.client.unsubscribe(sr.client, {name : 'sfdc.streamingapi',
params:{topic:"/topic/InvoiceStatements"}});
});
関連トピック:
ストリーミング API イベントの使用
ストリーミング API イベントの登録
59
キャンバスアプリケーションのデバッグ
Force.com Canvas SDK
キャンバスアプリケーションのデバッグ
Chrome、Firefox、または Safari を使用して、次の手順に従います。
Force.com Canvas SDK を使用しているとき、デバッグモードを有効にしてトラブルシューティングを容易にする
ことができます。
1. ブラウザでキャンバスアプリケーションを開いたまま、コンソールを開きます。
2. Sfdc.canvas.console.enable();と入力し、Enter キーを押します。
3. ブラウザを更新します。
この画面のデータを使用してキャンバス関連の問題をデバッグできます。
キャンバスアプリケーションでの <select> タグの使用
キャンバス Web アプリケーションで HTML <select> タグを使用していて、キャンバスアプリケーションを
Salesforce1 で使用できるようにする場合、一部のデバイスで予測できない動作になる可能性があります。
<select> の代わりに、jQuery または CSS を使用することを検討してください。
60
第5章
トピック:
キャンバスアプリケーションと Visualforce ペー
ジ
標準のキャンバスアプリケーション以外に、Force.com Canvas を使用して Visualforce
ページにキャンバスアプリケーションを公開することもできます。つまり、Visualforce
ページを表示できる場所であればどこでも、キャンバスアプリケーションを表示で
きます。
•
Visualforce ページの
コード例
•
Visualforce の考慮事
項
開発者は Visualforce ページを使用して次のことを実行できます。
•
apex:canvasApp コ
ンポーネント
• 取引先の [新規] ボタンや取引先責任者の [保存] ボタンなど、標準ボタンを上書き
する
•
Visualforce ページと
キャンバスアプリ
ケーション間での
イベントの使用
• [取引先] タブホームページなどのタブ概要ページを上書きする
• カスタムタブを定義する
• 詳細ページレイアウトにコンポーネントを埋め込む
• ダッシュボードコンポーネントまたはカスタムヘルプページを作成する
• Salesforce コンソールのサイドバー (カスタムコンソールコンポーネント) をカスタ
マイズ、拡張、統合する
Visualforce ページにキャンバスアプリケーションをホストするには、
<apex:canvasApp> コンポーネントを使用します。
メモ: Force.com Canvas フレームワークには、Visualforce ページを使用せずに、キャ
ンバスアプリケーションが含まれる iframe のナビゲーションの制限を回避する
ために使用できるメソッドが含まれます。これらのメソッドには、Salesforce1で
のキャンバスアプリケーションへの移動またはキャンバスアプリケーションか
らの移動を制御する合理化された代替手段が用意されています。詳細は、「キャ
ンバスアプリケーションで使用する Salesforce1 の navigation メソッド」 (ページ
89)を参照してください。
関連トピック:
Visualforce ページのコード例
Visualforce の考慮事項
apex:canvasApp コンポーネント
61
キャンバスアプリケーションと Visualforce ページ
Visualforce ページのコード例
Visualforce ページのコード例
Visualforceページにキャンバスアプリケーションを表示する方法は多数あります。次の例は、applicationName、
developerName、および namespacePrefix を使用して、キャンバスアプリケーションを参照するさまざま
な方法を示しています。
オブジェクト詳細ページ
次のコードスニペットに、[取引先] ページにキャンバスアプリケーションを表示する方法の例を示します。こ
のコードでは、キャンバスアプリケーションのサイズが 400x750 ピクセル (高さ x 幅) に指定されます。この例
では、applicationName と namespacePrefix を使用してキャンバスアプリケーションを指定しています。
<apex:page standardController="Account">
<apex:canvasApp applicationName="Test Inline Visualforce"
namespacePrefix="testorg"
height="400px" width="750px"/>
</apex:page>
標準ページ
次のコードスニペットに、[Visualforce] ページにキャンバスアプリケーションを表示する方法の例を示します。
このコードでは、キャンバスアプリケーションのサイズが 1,000x800 ピクセル (高さ x 幅) に指定されます。さら
に、このコードは 3 つのカスタムパラメータをキャンバスアプリケーションに渡します。この例では、
developerName と namespacePrefix を使用してキャンバスアプリケーションを指定しています。
<apex:page>
<apex:canvasApp developerName="Test_Standard_Visualforce"
namespacePrefix="testorg" height="1000px" width="800px"
parameters="{p1:'value1',p2:'value2',p3:'value3'}"/>
</apex:page>
境界線およびスクロール機能のある標準ページ
次のコードスニペットに、[Visualforce] ページにいくつかの追加 UI 拡張機能でキャンバスアプリケーションを表
示する方法を示します。このコードでは、キャンバスアプリケーションのサイズが 100x500 ピクセル (高さ x 幅)
に指定されます。また、このコードによって、キャンバスアプリケーションの周りに 2 ピクセルの境界が必要
であり、スクロール機能が有効である必要があることが指定されます。この例では、applicationName のみ
を使用するキャンバスアプリケーションを指定しています (これは、キャンバスアプリケーションが作成され
た組織で、その組織に namespacePrefix がない場合にのみ有効です)。
<apex:page>
<apex:canvasApp applicationName="Test Scrolling Visualforce"
height="100px" width="500px"
border="2" scrolling="yes"/>
62
キャンバスアプリケーションと Visualforce ページ
Visualforce の考慮事項
</apex:page>
関連トピック:
キャンバスアプリケーションと Visualforce ページ
Visualforce の考慮事項
http://www.salesforce.com/us/developer/docs/pages/index_Left.htm#StartTopic=Content/pages_compref_canvasApp.htm
apex:canvasApp コンポーネント
Visualforce の考慮事項
<apex:canvasApp> コンポーネントを使用するときの考慮事項は、次のとおりです。
• <apex:canvasApp> コンポーネントは、Force.com Canvas が有効になっている組織で、バージョン 27.0 以降
の Visualforce ページでのみ使用できます。
• オブジェクトの詳細レイアウトにキャンバスアプリケーションを含める場合、ページレイアウトと
<apex:canvasApp> コンポーネントにキャンバスアプリケーションの高さを指定する必要があります。
• 場所 — キャンバスアプリケーションが Visualforce ページにある場合、Environment.displayLocation 項
目には Visualforce という値が含まれます。
関連トピック:
キャンバスアプリケーションと Visualforce ページ
apex:canvasApp コンポーネント
apex:canvasApp コンポーネント
このコンポーネントを使用して、Visualforce ページにキャンバスアプリケーションを表示します。次の表に、
コンポーネントの属性を示します。
引用符やアポストロフィーなどの英数字以外の文字が含まれるパラメータは、JavaScript で安全に使用できるオ
ブジェクトとして渡します。これを行うには、ApexJSONGeneratorクラスのメソッドを使用するApexクラスを記
述し、JSON 文字列を作成します。parameters 値から Apex クラスをコールします。
<apex:page controller="JSONGeneratorSample">
<apex:canvasApp developerName="mycanvas" parameters="{!generateJSON}" />
</apex:page>
また、JSENCODE 関数を使用して文字列をエスケープすることもできます。
<apex:page standardController="Account">
<apex:canvasApp developerName="mycanvas" parameters="{!JSENCODE(Account.Description)}"
/>
</apex:page>
63
キャンバスアプリケーションと Visualforce ページ
apex:canvasApp コンポーネント
属性
型
説明
applicationName
String
キャンバスアプリケーションの名前。
applicationName または developerName のいずれ
かが必要です。
border
String
キャンバスアプリケーションの境界線の幅 (ピクセル単
位)。指定されていない場合、デフォルトの 0 ピクセル
に設定されます。
canvasId
String
キャンバスアプリケーションウィンドウの一意の ID。
この属性を使用して、イベントをキャンバスアプリケー
ションの対象にします。
containerId
String
キャンバスアプリケーションのレンダリングに使用さ
れる HTML 要素の ID。指定されていない場合、デフォル
トの null に設定されます。この属性によって指定され
るコンテナは、<apex:canvasApp> コンポーネントの
後には表示されません。次のコード例に、<div> コン
テナと containerId 属性の有効な使用法を示します。
<apex:page>
<div id="container1"></div>
<apex:canvasApp applicationName="myApp"
containerId="container1"/>
</apex:page>
<apex:page>
<div id="container1">
<apex:canvasApp
applicationName="myApp"
containerId="container1"/>
</div>
</apex:page>
次のコード例に、<div> コンテナと containerId 属
性の無効な使用法を示します。
<apex:page>
<apex:canvasApp applicationName="myApp"
containerId="container1"/>
<div id="container1">
</div>
</apex:page>
developerName
String
キャンバスアプリケーションの内部名。 接続アプリ
ケーションを作成してキャンバスアプリケーションを
公開するときは、[API 名] 項目にこの値を指定しま
す。developerName または applicationName のい
ずれかが必要です。
64
キャンバスアプリケーションと Visualforce ページ
apex:canvasApp コンポーネント
属性
型
説明
entityFields
String
オブジェクトに配置されたVisualforceページにコンポー
ネントが表示されるときに、署名付き要求 Record オブ
ジェクトで返される項目を指定します。この属性が指
定されていないか空白の場合、ID 項目のみが返されま
す。有効な属性値は次のとおりです。
• 項目名のカンマ区切りのリスト。たとえば、[取引
先 電話] 項目と [Fax] 項目を返すには、
entityFields="Phone,Fax" という属性を指定し
ます。
• アスタリスク「*」。関連付けられたオブジェクト
のすべての項目を返します。
height
String
キャンバスアプリケーションウィンドウの高さ (ピクセ
ル単位)。指定されていない場合、デフォルトの 900 ピ
クセルに設定されます。
id
String
ページの他のコンポーネントが <apex:canvasApp>
コンポーネントを参照できるようにする一意の識別子。
namespacePrefix
String
キャンバスアプリケーションが作成された Developer
Edition 組織の名前空間の値。名前空間を設定できるの
は Developer Edition 組織のみであるため、キャンバスア
プリケーションが別の種別の組織で作成された場合、
これは省略可能です。指定されていない場合、デフォ
ルトの null に設定されます。
onCanvasAppError
String
キャンバスアプリケーションがレンダリングできない
ときにコールされる JavaScript 関数の名前。
onCanvasAppLoad
String
キャンバスアプリケーションがロードした後にコール
される JavaScript 関数の名前。
parameters
String
キャンバスアプリケーションに渡されるパラメータの
オブジェクト表現。JSON 形式または JavaScript オブジェ
クトリテラルとして指定します。JavaScript オブジェク
トリテラルのパラメータの例:
{param1:'value1',param2:'value2'}。指定され
ていない場合、デフォルトの null に設定されます。
rendered
Boolean
コンポーネントをページに表示するかどうかを指定す
る。指定されていない場合、デフォルトの true に設定
されます。
65
キャンバスアプリケーションと Visualforce ページ
レコードオブジェクトで返される項目
属性
型
説明
scrolling
String
キャンバスアプリケーションのウィンドウでスクロー
ルバーが使用されるかどうかを指定します。有効な値
は、次のとおりです。
• auto
• いいえ
• はい
指定されていない場合、デフォルトの no に設定され
ます。この属性に無効な値が含まれていると、ブラウ
ザエラーを回避するために no と同様に扱われます。
width
String
キャンバスアプリケーションウィンドウの幅 (ピクセル
単位)。指定されていない場合、デフォルトの 800 ピク
セルに設定されます。
関連トピック:
キャンバスアプリケーションと Visualforce ページ
http://www.salesforce.com/us/developer/docs/pages/index_Left.htm#StartTopic=Content/pages_compref_canvasApp.htm
Visualforce ページのコード例
レコードオブジェクトで返される項目
レコードオブジェクトで返される項目
<apex:canvasApp> コンポーネントを使用してキャンバスアプリケーションを表示した Visualforce ページが、
オブジェクトに関連付けられている場合 (たとえば、ページレイアウトへ配置されているなど)、関連するオブ
ジェクトから返される項目を指定できます。そのためには、entityFields 属性を使用します。この属性は、
次のいずれかの方法で使用できます。
特定のオブジェクト項目を返す
レコードオブジェクトで特定のオブジェクト項目を返すには、entityFields 属性に項目名のカンマ区切り
リストを設定します。リスト内に無効な項目名があると、その項目名は無視され、レコードオブジェクトで有
効な項目が返されます。
<apex:canvasApp applicationName="MyApp" entityFields="Phone,Fax,BillingCity"
containerId="canvasAppDiv"/>
上記のコードにより、次のようなレコードオブジェクトが返されます。
"record":{
"attributes":{
"type":"Account",
"url":"/services/data/v37.0/sobjects/Account/001xx000003DGWiAAO"
},
66
キャンバスアプリケーションと Visualforce ページ
レコードオブジェクトで返される項目
"Id":"001xx000003DGWiAAO",
"Phone":"(555) 555-5555",
"Fax":"(555) 555-5555",
"BillingCity":"Seattle"
}
すべてのオブジェクト項目を返す
レコードオブジェクトですべてのオブジェクト項目を返すには、entityFields 属性にワイルドカード「*」
を設定します。
<apex:canvasApp applicationName="MyApp" entityFields="*" containerId="canvasAppDiv"/>
上記のコードにより、次のようなレコードオブジェクトが返されます。
"record":{
"attributes":{
"type":"Account",
"url":"/services/data/v37.0/sobjects/Account/001xx000003DGWiAAO"
},
"Id":"001xx000003DGWiAAO",
"IsDeleted":false,
"MasterRecordId":null,
"Name":"Edge Communications",
"Type":"Customer - Channel",
"ParentId":null,
"BillingStreet":"123 Main Street",
"BillingCity":"Seattle",
"BillingState":"WA",
"BillingPostalCode":"98121",
"BillingCountry":"USA",
...
}
ID 項目を返す
<apex:canvasApp> コンポーネントに entityFields 属性がない場合、または属性が空白の場合、レコード
オブジェクトでは ID 項目のみが返されます。
<apex:canvasApp applicationName="MyApp" containerId="canvasAppDiv"/>
上記のコードにより、次のようなレコードオブジェクトが返されます。
"record":{
"attributes":{
"type":"Account",
"url":"/services/data/v37.0/sobjects/Account/001xx000003DGWiAAO"
},
67
キャンバスアプリケーションと Visualforce ページ
Visualforce ページとキャンバスアプリケーション間での
イベントの使用
"Id":"001xx000003DGWiAAO"
}
関連トピック:
apex:canvasApp コンポーネント
Record
キャンバスアプリケーションの動作の制御
Visualforce ページとキャンバスアプリケーション間でのイベント
の使用
Force.com Canvas には、キャンバスアプリケーションと親 Visualforce ページ間でイベントの公開と登録に使用可
能なメソッドが用意されています。このプロセスには、Visualforceページからのイベントの公開、Visualforceペー
ジでのイベントのリスン、Visualforce ページからのイベントの登録解除、キャンバスアプリケーションを含む
Visualforceページのサイズ変更が含まれます。キャンバスアプリケーションをサイズ変更するこのプロセスは、
「キャンバスアプリケーションのサイズ変更」に記載されている、キャンバスアプリケーション自体をサイズ
変更するプロセスとは異なります。これらのメソッドに関するすべてのリファレンスドキュメントは、SDK お
よびこちらにあります。
• publish — Visualforce ページでキャンバスアプリケーションの登録先イベントを公開します。「Visualforce
ページからのキャンバスイベントの公開」を参照してください。
• resize — Visualforce ページで、キャンバスアプリケーションの iFrame のサイズ変更に使用されます。
「Visualforce ページでのキャンバスアプリケーションのサイズ変更」を参照してください。
• subscribe — Visualforce ページで、キャンバスアプリケーションが公開するイベントへの登録に使用され
ます。「イベントの登録」を参照してください。
• unsubscribe — Visualforce ページで、キャンバスアプリケーションが公開する親イベントからの登録解除
に使用されます。「Visualforce ページでのイベントからの登録解除」を参照してください。
これらのメソッドを使用するVisualforceページには、Controller.jsオブジェクトが必要です。Visualforceページのス
クリプトは、次のようになります。
<script
type="text/javascript"src="https://yourDomain.my.salesforce.com/canvas/sdk/js/30.0/controller.js">
メモ: Force.com のメソッドを使用すると、Visualforce を使用せずにキャンバスアプリケーションと Salesforce1
アプリケーションの間のナビゲーションを円滑に統合できます。このメソッドは、Force.com Canvas フレー
ムワーク内の JavaScript ライブラリにあるイベントです。いずれかの navigation メソッドをキャンバスコー
ドからコールすると、Salesforce1 にイベントが送信されます。Salesforce1 は、このペイロードを読み取って
68
キャンバスアプリケーションと Visualforce ページ
Visualforce ページからのキャンバスイベントの公開
指定の移行先にユーザを移動します。詳細は、「キャンバスアプリケーションで使用する Salesforce1 の
navigation メソッド」 (ページ 89)を参照してください。
関連トピック:
Visualforce ページからのキャンバスイベントの公開
Visualforce ページでのキャンバスアプリケーションのサイズ変更
イベントの登録
Visualforce ページでのイベントからの登録解除
apex:canvasApp コンポーネント
Visualforce ページからのキャンバスイベントの公開
次のコード例に、publish メソッドをコールして、Visualforceページから myevent イベントを公開する方法を
示します。このイベントを登録しているキャンバスアプリケーションでイベントを受信します。
// Target all canvas apps.
Sfdc.canvas.controller.publish({name : 'mynamespace.myevent',
payload : {}});
次のコード例に、publish メソッドをコールして、Visualforceページから指定されたキャンバスアプリケーショ
ンにイベントを公開する方法を示します。
イベントが特定のキャンバスアプリケーションに公開されると、Visualforceページの他のキャンバスアプリケー
ションでそのイベントを登録していても、指定されたキャンバスアプリケーションでのみそのイベントを受信
します。次のコード例では、Visualforceページにキャンバスアプリケーション app1、app2、および app3 があり、
そのすべてが myevent を登録している場合、app1 でのみイベントを受信します。
// Target a specific canvas app
// where "app1" is the canvasId specified in the canvas component.
// For example: <apex:canvasApp canvasId="app1">
Sfdc.canvas.controller.publish({name : 'mynamespace.myevent',
payload : {},
target : {canvas : 'app1'}});
target パラメータでは、target : [{canvas : 'app1'}, {canvas: 'app2'}] のようにキャンバスア
プリケーションの配列を渡して複数のキャンバスアプリケーションを指定できます。
関連トピック:
Visualforce ページとキャンバスアプリケーション間でのイベントの使用
Visualforce ページでのキャンバスアプリケーションのサイズ変更
イベントの登録
Visualforce ページでのイベントからの登録解除
apex:canvasApp コンポーネント
69
キャンバスアプリケーションと Visualforce ページ
Visualforce ページでのキャンバスアプリケーションのサ
イズ変更
Visualforce ページでのキャンバスアプリケーションのサイズ変更
次のコード例に、resize メソッドをコールして、Visualforceページ内で特定のキャンバスアプリケーションの
高さと幅を明示的に設定する方法を示します。
// Set the height and width explicitly and target a canvas app
// Where 'mycanvas0' is the canvasId on the canvas component
// <apex:canvasApp canvasId="mycanvas0"/>
var target = {canvas : "mycanvas0"};
Sfdc.canvas.controller.resize( {height : "1000px", width : "900px"}, target);
次のコード例に、resize メソッドをコールして、Visualforceページ内ですべてのキャンバスアプリケーション
の高さを設定する方法を示します。
//Set only the height on all canvas apps
Sfdc.canvas.controller.resize( {height : "1000px"});
関連トピック:
Visualforce ページとキャンバスアプリケーション間でのイベントの使用
Visualforce ページからのキャンバスイベントの公開
イベントの登録
Visualforce ページでのイベントからの登録解除
イベントの登録
次のコード例に、Visualforceページ内で subscribe メソッドをコールして、キャンバスアプリケーションから
公開された指定のイベントを登録する方法を示します。
// Subscribe to a single event.
Sfdc.canvas.controller.subscribe({name : 'mynamespace.myevent0',
onData : function (e) {}});
// Subscribe to multiple events in a single call.
Sfdc.canvas.controller.subscribe([
{name : 'mynamespace.myevent1', onData : function(e) {}},
{name : 'mynamespace.myevent2', onData : function(e) {}}
]);
関連トピック:
Visualforce ページとキャンバスアプリケーション間でのイベントの使用
Visualforce ページからのキャンバスイベントの公開
Visualforce ページでのキャンバスアプリケーションのサイズ変更
Visualforce ページでのイベントからの登録解除
キャンバスアプリケーションイベントの実装
70
キャンバスアプリケーションと Visualforce ページ
Visualforce ページでのイベントからの登録解除
Visualforce ページでのイベントからの登録解除
次のコード例に、Visualforce ページ内で unsubscribe メソッドをコールして、2 つのイベントから登録解除す
る方法を示します。
Sfdc.canvas.controller.unsubscribe(['mynamespace.myevent2', 'mynamespace.myevent2']);
関連トピック:
Visualforce ページとキャンバスアプリケーション間でのイベントの使用
Visualforce ページからのキャンバスイベントの公開
Visualforce ページでのキャンバスアプリケーションのサイズ変更
イベントの登録
71
第6章
トピック:
•
ページレイアウト
でのキャンバスア
プリケーションの
表示場所
•
ページレイアウト
へのキャンバスア
プリケーションの
追加
ページレイアウトまたはモバイルカードのキャ
ンバスアプリケーション
キャンバスアプリケーションは、任意の標準オブジェクトまたはカスタムオブジェ
クトのページレイアウトに追加できます。ページレイアウトの編集時にパレットに
[キャンバスアプリケーション] カテゴリを表示させるには、Salesforceアプリケーショ
ンでキャンバスアプリケーションを作成するときにキャンバスアプリケーションの
場所を [レイアウト] と [モバイルカード] に設定する必要があります。
関連トピック:
ページレイアウトへのキャンバスアプリケーションの追加
ページレイアウトでのキャンバスアプリケーションの表示場所
72
ページレイアウトまたはモバイルカードのキャンバスア
プリケーション
ページレイアウトでのキャンバスアプリケーションの表
示場所
ページレイアウトでのキャンバスアプリケーションの表示場所
キャンバスアプリケーションをページレイアウトのどこに配置したかに応じて、キャンバスアプリケーション
は Salesforce フルサイトまたは Salesforce1 に表示されます。
次の表は、キャンバスアプリケーションをページレイアウトに追加したときに表示される場所を示します。
キャンバスアプリケー
Salesforce フルサイ Salesforce1 にキャン キャンバスアプリケーションが表示さ
ションをページレイアウ トにキャンバスア バスアプリケーショ れる Salesforce1 の場所
トの次の場所に追加した プリケーションが ンが表示されるか
場合
表示されるか
任意のセクション ([モバ
イルカード] セクション以
外)
はい
はい
レコード詳細ページ
[モバイルカード] セクショ
ン
いいえ
はい
モバイルカード
関連トピック:
ページレイアウトまたはモバイルカードのキャンバスアプリケーション
ページレイアウトへのキャンバスアプリケーションの追加
ページレイアウトへのキャンバスアプリケーションの追加
次の手順に従って、取引先のページレイアウトにキャンバスアプリケーションを追加します。
1. 「アプリケーションの作成」の手順に従って、Heroku クイックスタートを使用してキャンバスアプリケー
ションを作成します。
2. Salesforce アプリケーションで、[設定] から [クイック検索] ボックスに「アプリケーション」と入力し、[ア
プリケーション] を選択します。
3. [接続アプリケーション] 関連リストで、作成したアプリケーションの横にある [編集] をクリックします。
4. [キャンバスアプリケーション設定] セクションの [場所] 項目で、[レイアウト] と [モバイルカード] を選択
します。
5. [保存] をクリックします。
6. 取引先のオブジェクトの管理設定から、[ページレイアウト] に移動します。
7. [取引先レイアウト] の横にある [編集] リンクをクリックします。
73
ページレイアウトまたはモバイルカードのキャンバスア
プリケーション
ページレイアウトへのキャンバスアプリケーションの追
加
キャンバスアプリケーションの場所を [レイアウト] と [モバイルカード] に設定したため、パレットに [キャ
ンバスアプリケーション] カテゴリが表示されます。
8. ページレイアウトで表示する場所にキャンバスアプリケーション要素をドラッグし、[保存] をクリックし
ます。
• [モバイルカード] セクション以外のセクションにキャンバスアプリケーションを追加した場合、キャン
バスアプリケーションは Salesforce フルサイトのページレイアウトまたは Salesforce1 のレコード詳細ペー
ジに表示されます。
• [モバイルカード] セクションにキャンバスアプリケーションを追加した場合、キャンバスアプリケー
ションは Salesforce1 のモバイルカードにのみ表示されます。
9. 変更内容を確認するには、[取引先] タブをクリックしてから取引先をクリックします。キャンパスアプリ
ケーションがページレイアウトで追加した場所に表示されます。
ページレイアウトでレンチアイコン
を変更できます。
をクリックして、キャンバスアプリケーションのその他のプロパティ
• 幅 (ピクセル単位または %) — キャンバスアプリケーションの幅 (デフォルトは 100%)。キャンバスアプリ
ケーションの幅の変更は、Salesforce フルサイトと Salesforce1 アプリケーションの両方に表示されます。ただ
し、Salesforce1 のキャンバスアプリケーションは 1 列のレイアウトで表示されるため、幅を 100% のままにし
ておくことをお勧めします。
• 高さ (ピクセル単位) — キャンバスアプリケーションの高さ (デフォルトは 200 ピクセル)。この項目の変更
は、Salesforce フルサイトと Salesforce1 の両方に表示されるキャンバスアプリケーションのユーザに表示され
ます。
• スクロールバーを表示 — キャンバスアプリケーションの iFrame にスクロールバーを表示するかどうか。こ
の項目の変更は、Salesforce フルサイトに表示されるキャンバスアプリケーションでは表示されますが、
Salesforce1 に表示されるキャンバスアプリケーションでは表示されません。
• ラベルを表示 — ページレイアウトセクションの表示ラベルを表示するかどうか。この項目の変更は、Salesforce
フルサイトと Salesforce1 の両方に表示されるキャンバスアプリケーションのユーザに表示されます。
関連トピック:
ページレイアウトまたはモバイルカードのキャンバスアプリケーション
ページレイアウトでのキャンバスアプリケーションの表示場所
Salesforce ヘルプ: オブジェクト管理設定の検索
74
第7章
トピック:
•
キャンバスアプリ
ケーションの場所
の設定とアクショ
ンの作成
•
アクションの手動
作成
•
Force.com Canvas
SDK のパブリッ
シャーイベント
•
パブリッシャーの
コンテキストに関
する考慮事項
•
パブリッシャーの
キャンバスアプリ
ケーションアクセ
スに関する考慮事
項
パブリッシャーのキャンバスアプリケーション
Force.com Canvas では、キャンバスアプリケーションをクイックアクションとして公
開できます。パブリッシャーでは、ユーザは組織で特によく使用するアクションに
アクセスできます。パブリッシャーを拡張してキャンバスアプリケーションを追加
し、ユーザがキャンバスアプリケーションのよく使用するカスタムアクションを利
用できるようにします。これらのアクションは、フィードと統合でき、実行された
アクションに固有のフィード投稿を作成できます。
開発者はパブリッシャーのキャンバスアプリケーションを使用して次のことを実行
できます。
• Web アプリケーションからコンテンツを Chatter パブリッシャーに追加する。
• キャンバスアプリケーションを公開するカスタムアクションを作成する。
• キャンバスアプリケーションをパブリッシャーライフサイクルに直接統合する。
キャンバスアプリケーションから Chatter フィードに投稿し、[共有] ボタン機能を
使用してメッセージの投稿先を指定できます。
たとえば、ユーザが作業した時間を記録するために使用するキャンバスアプリケー
ションがあるとします。クイックアクションを作成して、ユーザがそのキャンバス
アプリケーションをパブリッシャーで開き、パブリッシャー内から直接すべての勤
務時間記録をすばやく送信できるようにすることが可能です。
ユーザは引き続き標準の方法でキャンバスアプリケーションのフル機能にアクセス
できますが、パブリッシャーのキャンバスアプリケーションではアプリケーション
の特によく使用する機能にすばやくアクセスできます。ユーザはクイックアクショ
ンを選択して、Chatter フィード項目を作成できます。フィード項目はテキスト投稿
やリンク投稿、またはキャンバス投稿にすることもできます。
関連トピック:
キャンバスアプリケーションの場所の設定とアクションの作成
Chatter フィードのキャンバスアプリケーション
75
パブリッシャーのキャンバスアプリケーション
キャンバスアプリケーションの場所の設定とアクション
の作成
キャンバスアプリケーションの場所の設定とアクションの作成
キャンバスアプリケーションをパブリッシャーまたはアクションバーに追加するには、キャンバスアプリケー
ションの作成時に場所を設定し、アクションを作成する必要があります。
1. Salesforce で、[設定] から [クイック検索] ボックスに「アプリケーション」と入力し、[アプリケーション] を
選択します。
2. [接続アプリケーション] 関連リストで、[新規]をクリックします。キャンバスアプリケーションの基本項目
を入力します。「キャンバスアプリケーションの作成」を参照してください。
3. [キャンバスアプリケーション設定] で [Force.com Canvas] を選択し、[場所] 項目で [パブリッシャー] を選択
します。Salesforce フルサイトのパブリッシャーと Salesforce1 のアクションバーの両方にキャンバスアプリ
ケーションを表示するには、この場所を選択する必要があります。
4. [アクションの自動作成] 項目を選択します。これにより、キャンバスアプリケーションのクイックアクショ
ンが作成されます。
5. 「今何をしていますか?」というテキストが表示されるパブリッシャーヘッダーを非表示にするには、[パ
ブリッシャーヘッダーを非表示] を選択します。これにより、Salesforce フルサイトと Salesforce1 の両方でヘッ
ダーが非表示になります。
6. Salesforce フルサイトと Salesforce1 の両方で、ユーザにパブリッシャーの [共有] ボタンを非表示にするには、
[[パブリッシャー共有] ボタンを非表示] を選択します。このチェックボックスは、[パブリッシャーヘッ
ダーを非表示] が選択されている場合にのみ有効になります。
キャンバスアプリケーションをアクションとして表示するには、アクションをグローバルパブリッシャーレイ
アウトに追加する必要があります。Salesforce ヘルプの「グローバルパブリッシャーレイアウトのカスタマイ
ズ」を参照してください。
関連トピック:
キャンバスアプリケーションの表示場所
アクションの手動作成
パブリッシャーのキャンバスアプリケーション
アクションの手動作成
キャンバスアプリケーションの作成時に [アクションの自動作成] 項目を選択しなかった場合は、アクション
を手動で作成する必要があります。
1. [設定] から、[クイック検索] ボックスに「アクション」と入力し、[グローバルアクション] を選択します。
2. [新規アクション]をクリックします。
3. [アクション種別] 項目で、[カスタムキャンバス] を選択します。
4. [キャンバスアプリケーション] 項目で、アクションとして表示するキャンバスアプリケーションを選択し
ます。
この項目には、パブリッシャーの場所があるキャンバスアプリケーションのみが表示されます。
76
パブリッシャーのキャンバスアプリケーション
Force.com Canvas SDK のパブリッシャーイベント
5. [高さ] 項目に、キャンバスアプリケーションの高さ (ピクセル単位) を入力します。
これは、パブリッシャーにキャンバスアプリケーションを表示するときの初期の高さになります。Force.com
Canvas SDK の resize() メソッドを使用すると、高さを最大 500 ピクセルまで変更できます。
6. [表示ラベル] 項目に値を入力します。
この値は、ユーザインターフェースでクイックアクションのタイトルとして表示されます。
7. [名前] 項目に、空白を含まない一意の値を入力します。
8. 必要に応じて、[アイコン] 項目で [変更アイコン] をクリックしてアイコンをアップロードできます。ここ
で変更する前に、アイコンを静的リソースとしてアップロードする必要があります。
9. [保存] をクリックします
キャンバスアプリケーションをクイックアクションとして表示するには、アクションをグローバルレイアウト
に追加する必要があります。Salesforce ヘルプの「グローバルパブリッシャーレイアウトのカスタマイズ」を参
照してください。
関連トピック:
キャンバスアプリケーションの場所の設定とアクションの作成
パブリッシャーのコンテキストに関する考慮事項
Force.com Canvas SDK のパブリッシャーイベント
パブリッシャーでキャンバスアプリケーションを公開する場合、適切に定義されたイベントを使用して、キャ
ンバスアプリケーションとパブリッシャー間のコミュニケーションを可能にすることができます。
キャンバスアプリケーションでこれらのイベントを登録および公開して、パブリッシャーフレームワークとさ
らに密接に統合することができます。たとえば、Chatterフィード項目を投稿するために、標準のChatter [共有]
ボタンを有効化することができます。また、ユーザがパブリッシャーの [今何をしていますか?] 項目に入力す
る投稿テキストにアクセスし、それをアプリケーションのコンテンツに結合することもできます。
項目
説明
publisher.clearPanelState
キャンバスアプリケーションが無効化されるか非表示になっ
たときに、パブリッシャーによって起動されます。これは、
ユーザがパブリッシャーで異なるアプリケーションを選択す
るか、[共有] ボタンがクリックされたときに発生します。
Visualforce ページも、このイベントをリスンできます。
publisher.failure
無効なデータが送信されるなど、エラー条件が発生したとき
に、パブリッシャーによって起動されます。次に例を示しま
す。
• フィードのテキストが長すぎる
• フィードに公開しようとしているキャンバスアプリケー
ションが存在しない
• キャンバスアプリケーション URL が無効
77
パブリッシャーのキャンバスアプリケーション
項目
Force.com Canvas SDK のパブリッシャーイベント
説明
キャンバスアプリケーションは、このイベントをリスンして、
エラーが発生し投稿が作成されなかったことをユーザに通知
する必要があります。
publisher.getPayload
[共有] ボタンがクリックされたときに、パブリッシャーによっ
て起動されます。ペイロードには、[今何をしていますか?] 項
目に入力されたテキストや、フィード項目を共有するユーザ
などの情報が含まれます。
publisher.setupPanel
Chatter フィードページの初期読み込み時に、パブリッシャー
によって起動されます。
publisher.setPayload
パブリッシャーに送信中のコンテンツをフィード項目で共有
する必要があることをパブリッシャーに示すために、キャン
バスアプリケーションによって起動されます。このイベント
は publisher.getPayload に応答するものであり、作成し
ようとしているフィード項目に関する情報が含まれます。次
の 3 つのフィード項目種別を作成できます。
• TextPost
• LinkPost
• CanvasPost
publisher.setValidForSubmit
キャンバスアプリケーションでペイロードを送信する準備が
整ったことをパブリッシャーに示すために、キャンバスアプ
リケーションによって起動されます。このイベントが起動す
ると、[共有] ボタンが有効になります。
次のコードスニペットは、[共有] ボタンを有効にします。
$$.client.publish(sr.client,
{name : 'publisher.setValidForSubmit',
payload : true});
publisher.showPanel
ユーザがパブリッシャーでキャンバスアプリケーションを選
択すると、パブリッシャーによって起動されます。このイベ
ントは、キャンバスアプリケーションが表示されていること
を示します。Visualforce ページも、このイベントをリスンでき
ます。
publisher.success
[共有] ボタンがクリックされ、データが正常に送信されると、
パブリッシャーによって起動されます。
パブリッシャーイベントの順序
キャンバスアプリケーションから見たパブリッシャーイベントの順序は、次のとおりです。
78
パブリッシャーのキャンバスアプリケーション
パブリッシャーのコンテキストに関する考慮事項
1. キャンバスアプリケーションが publisher.setupPanel をリスンします。
2. キャンバスアプリケーションが publisher.showPanel をリスンします。
3. ユーザが、ボタンのクリックやテキストの入力といったキャンバスアプリケーションの操作を行います。
キャンバスアプリケーションは、必要な検証を行ってから、publisher.setValidForSubmit を起動し
ます。その結果、パブリッシャーで [共有] ボタンが有効になります。
4. キャンバスアプリケーションが publisher.getPayload をリスンします。
5. キャンバスアプリケーションは publisher.setPayload を起動します。
6. キャンバスアプリケーションが publisher.success をリスンします。
7. キャンバスアプリケーションが publisher.failure をリスンします。
8. キャンバスアプリケーションが publisher.clearPanelState をリスンします。
関連トピック:
アクションの手動作成
パブリッシャーのコンテキストに関する考慮事項
パブリッシャーのコンテキストに関する考慮事項
パブリッシャー内でキャンバスアプリケーションを表示する場合、署名付き要求または getContext() コー
ルから受け取るコンテキスト情報にはパブリッシャー固有の情報が含まれます。
• 場所 — キャンバスアプリケーションがパブリッシャーにある場合、Environment.displayLocation 項
目には Publisher という値が含まれます。
• サイズ — Environment.Dimensions オブジェクトには、キャンバスアプリケーションのサイズに関する
情報が含まれます。
– キャンバスアプリケーションの高さは、作成したクイックアクションで指定する高さになります。
– キャンバスアプリケーションの作成時に [アクションの自動作成] を選択すると、キャンバスアプリケー
ションの高さはデフォルトの 200 ピクセルに設定されます。
– キャンバスアプリケーションの幅は、デフォルトの 521 ピクセル (パブリッシャー内のキャンバスアプリ
ケーションの幅の最大値と同じ) に設定されます。
– パブリッシャー内のキャンバスアプリケーションの高さの最大値は 500 ピクセルになります。
– パブリッシャー内のキャンバスアプリケーションの幅の最大値は 521 ピクセルになります。
– 次のコードスニペットは、パブリッシャー内のキャンバスアプリケーションのデフォルトサイズの値を
示します。
"dimensions":
{
"width": "521px",
"height": "200px",
"maxHeight": "500px",
"maxWidth": "521px"
}
79
パブリッシャーのキャンバスアプリケーション
パブリッシャーのキャンバスアプリケーションアクセス
に関する考慮事項
– パブリッシャーの幅は 521 ピクセルに固定されます。たとえば、キャンバスアプリケーションを 400 ピ
クセルにサイズ変更しても、パブリッシャーの幅は 521 ピクセルのままになります。
– Force.com Canvas SDK で resize() メソッドを使用すると、キャンバスアプリケーションの値を maxHeight
および maxWidth まで変更できます。
関連トピック:
アクションの手動作成
Environment
Dimensions
キャンバスアプリケーションのサイズ変更
パブリッシャーのキャンバスアプリケーションアクセスに関する考慮事項
Chatter フィードのキャンバスアプリケーション
パブリッシャーのキャンバスアプリケーションアクセスに関する
考慮事項
パブリッシャーに表示されるキャンバスアプリケーションを変更するときの考慮事項は、次のとおりです。
• 関連するクイックアクションがキャンバスアプリケーションに存在する場合は、キャンバスアプリケーショ
ンまたはパブリッシャーの場所を削除できません。まず、クイックアクションを削除する必要があります。
• プロファイルまたは権限セットを使用してユーザがキャンバスアプリケーションにアクセスできない場合
にパブリッシャーでアプリケーションを選択すると、エラーが表示されます。
• ユーザの権限がないアクションをキャンバスアプリケーションで実行しようとすると、そのアクションが
失敗し、キャンバスアプリケーションはエラーを受信します。たとえば、アプリケーションで Merchandise
レコードを作成しようとしたが、ユーザに Merchandise に対する作成権限がない場合、アプリケーションは
エラーを受信します。その後、キャンバスアプリケーションはエラーをユーザに伝えます。
80
第8章
トピック:
•
•
Chatter フィードの
コンテキストに関
する考慮事項
Chatter フィードの
キャンバスアプリ
ケーションアクセ
スに関する考慮事
項
Chatter フィードのキャンバスアプリケーション
Force.com Canvas では、キャンバスアプリケーションをフィード項目として公開でき
ます。フィードは、ユーザに Salesforce 内で何が行われているかについての情報と、
ユーザがフォローしているレコードとグループに関する情報を提供します。
開発者はフィード内のキャンバスアプリケーションを使用して次のことを実行でき
ます。
• パブリッシャー内のキャンバスアプリケーションから、または Chatter API を使用
して Chatter フィードに投稿する。
• Chatter フィード項目内にキャンバスアプリケーションを表示する。
キャンバスアプリケーションの Chatter フィード項目を作成すると、その中にサムネ
イル画像、リンクタイトル、および説明が含まれます。ユーザがリンクまたは説明
をクリックすると、キャンバスアプリケーションがフィード内で開きます。ユーザ
がリンクを再度クリックすると、コンテンツが折りたたまれ、ユーザはシームレス
にフィードを使用できます。
たとえば、ユーザが作業した時間を記録できるキャンバスアプリケーションがある
とします。キャンバスアプリケーションを表示するフィード項目をプログラムで作
成して、ユーザに現在記録されている時間数を表示することができます。
さらに、フィード項目に現在のユーザに応じたアクションを表示することができま
す。そのキャンバスアプリケーションで、フィード項目をユーザのマネージャに投
稿し、マネージャは記録された時間数を承認または却下できます。コンテンツはキャ
ンバスアプリケーションから提供されるため、開発者がその動作を完全に制御でき
ます。
関連トピック:
パブリッシャーのコンテキストに関する考慮事項
パブリッシャーのキャンバスアプリケーション
Chatter フィードのコンテキストに関する考慮事項
81
Chatter フィードのキャンバスアプリケーション
Chatter フィードのコンテキストに関する考慮事項
Chatter フィードのコンテキストに関する考慮事項
フィード項目内のキャンバスアプリケーションを表示する場合、署名付き要求または getContext() コール
から受け取るコンテキスト情報にはフィード固有の情報が含まれます。
• 場所 — キャンバスアプリケーションがフィードにある場合、Environment.displayLocation 項目には
ChatterFeed という値が含まれます。
• パラメータ — キャンバスアプリケーションを含むフィード項目を作成する場合、JSON 文字列をパラメータ
値として指定できます。キャンバスアプリケーションでコンテキストを受け取る場合、フィード項目内の
パラメータは Environment.Parameters オブジェクトに含まれます。
• サイズ — Environment.Dimensions オブジェクトには、キャンバスアプリケーションのサイズに関する
情報が含まれます。
– キャンバスアプリケーションの高さは、デフォルトの 100 ピクセルに設定されます。
– キャンバスアプリケーションの幅は、デフォルトの 420 ピクセル (フィード内のキャンバスアプリケー
ションの幅の最大値と同じ) に設定されます。
– フィード内のキャンバスアプリケーションの高さの最大値は 400 ピクセルになります。
– フィード内のキャンバスアプリケーションの幅の最大値は 420 ピクセルになります。
– 次のコードスニペットは、フィード内のキャンバスアプリケーションのデフォルトサイズの値を示しま
す。
"dimensions":
{
"width": "420px",
"height": "100px",
"maxHeight": "400px",
"maxWidth": "420px"
}
– フィードの幅は 420 ピクセルに固定されます。たとえば、キャンバスアプリケーションを 200 ピクセル
にサイズ変更しても、フィードの幅は 420 ピクセルのままになります。
– Force.com Canvas SDK で resize() メソッドを使用すると、キャンバスアプリケーションの値を maxHeight
および maxWidth まで変更できます。
関連トピック:
Chatter フィードのキャンバスアプリケーション
Environment
Dimensions
キャンバスアプリケーションのサイズ変更
Chatter フィードのキャンバスアプリケーションアクセスに関する考慮事項
82
Chatter フィードのキャンバスアプリケーション
Chatter フィードのキャンバスアプリケーションアクセ
スに関する考慮事項
Chatter フィードのキャンバスアプリケーションアクセスに関す
る考慮事項
フィードに表示されるキャンバスアプリケーションを変更するときの考慮事項は、次のとおりです。
• フィード項目に含まれるキャンバスアプリケーションを削除した場合、フィード項目はそのまま残ります。
ユーザがそれらのフィード項目のいずれかにアクセスすると、キャンバスアプリケーションが存在しない
というエラーが表示されます。
• フィード項目に含まれるキャンバスアプリケーションへのユーザアクセス権を削除した場合、フィード項
目はそのまま残ります。ユーザがそれらのフィード項目のいずれかにアクセスすると、キャンバスアプリ
ケーションへのアクセス権がないというエラーが表示されます。
• パブリッシャーアクションまたはChatter APIのいずれかを使用してキャンバスアプリケーションのフィード
項目を作成する場合、キャンバスアプリケーションが存在し、そのアプリケーションへの権限がユーザに
あるかどうかが Salesforce で確認されます。
– キャンバスアプリケーションが存在しない場合は、フィード項目を作成できずエラーが返されます。
– キャンバスアプリケーションが存在する場合は、フィード項目を作成するユーザにキャンバスアプリ
ケーションへのアクセス権がなくても、フィード項目は作成されます。ただし、ユーザはフィード項目
を表示できずエラーが返されます。
• ユーザの権限がないアクションをキャンバスアプリケーションで実行しようとすると、そのアクションが
失敗し、キャンバスアプリケーションはエラーを受信します。たとえば、アプリケーションで Merchandise
レコードを作成しようとしたが、ユーザに Merchandise に対する作成権限がない場合、アプリケーションは
エラーを受信します。その後、キャンバスアプリケーションはエラーをユーザに伝えます。
関連トピック:
Chatter フィードのコンテキストに関する考慮事項
CanvasRequest
83
第9章
トピック:
•
キャンバスアプリ
ケーションの場所
の設定とナビゲー
ションメニューへ
の追加
•
Salesforce1 のコンテ
キストに関する考
慮事項
•
Salesforce1 のアクセ
スに関する考慮事
項
•
Salesforce1 カスタム
アイコン
•
キャンバスアプリ
ケーションで使用
する Salesforce1 の
navigation メソッド
Salesforce1 アプリケーションのキャンバス
Force.com Canvas を使用すると、キャンバスアプリケーションを Salesforce1 で公開でき
ます。Salesforce1 アプリケーションは外出中に使用できる Salesforce です。このエン
タープライズクラスのモバイルアプリケーションでは、オフィスで表示するのと同
じ情報にリアルタイムでアクセスできますが、情報は整理されて表示されるため、
外出中でも業務を完了できます。Salesforce フルサイトと同様に、Force.com Canvas ア
プリケーションを含め、ユーザはパブリッシャーや Chatter フィード項目にアクセス
できます。
開発者はSalesforce1でキャンバスアプリケーションを使用して、次の操作を行うこと
ができます。
• Salesforce1 アクションとしてキャンバスアプリケーションを公開する。キャンバ
スアプリケーションがアイコンで表示されます。デフォルトのパズルアイコンを
使用することも、関連アクションのカスタムアイコンをアップロードすることも
できます。
• Salesforce1 内のキャンバスアプリケーションから、または Chatter API を使用して
フィードに投稿する。
• Salesforce1内からフィード項目内にキャンバスアプリケーションを表示する。キャ
ンバスアプリケーションがアイコンで表示されます。デフォルトのパズルアイコ
ンを使用しても、フィード項目内でサムネール URL を指定してカスタムアイコン
を表示することもできます。
• Salesforce1 のナビゲーションメニューにキャンバスアプリケーションをオプショ
ンとして追加する。キャンバスアプリケーションがアイコンで表示されます。デ
フォルトのパズルアイコンを使用することも、キャンバスアプリケーションの接
続アプリケーション設定でカスタムアイコン URL を指定することもできます。
メモ: キャンバスアプリケーションは、Android モバイルデバイスの Salesforce1
ナビゲーションメニューには表示されません。キャンバスアプリケーショ
ンを Android のナビゲーションメニューに表示するには、Salesforce1 モバイル
ブラウザアプリケーションにログインします。
たとえば、モバイルデバイスで注文を処理するために倉庫の従業員が使用するキャ
ンバスアプリケーションがあるとします。デバイスのアイコンからアプリケーショ
ンにアクセスするアクションを作成して、顧客の注文リストを従業員が読み込める
ようにすることができます。注文が処理されると、アプリケーションによりSalesforce
で注文状況が設定され、関連する顧客の取引先にフィード項目が投稿されます。
84
Salesforce1 アプリケーションのキャンバス
ユーザは、デスクトップマシンの Salesforce 内からキャンバスアプリケーションに引
き続きアクセスできます。Salesforce1で提供されるモバイルデバイス用の追加機能に
よって、既存の機能が影響を受けたり制限されたりすることはありません。
関連トピック:
パブリッシャーのキャンバスアプリケーション
Chatter フィードのキャンバスアプリケーション
Salesforce1 のアクセスに関する考慮事項
Salesforce1 のコンテキストに関する考慮事項
Salesforce1 カスタムアイコン
85
Salesforce1 アプリケーションのキャンバス
キャンバスアプリケーションの場所の設定とナビゲー
ションメニューへの追加
キャンバスアプリケーションの場所の設定とナビゲーションメ
ニューへの追加
キャンバスアプリケーションを追加して Salesforce1 ナビゲーションメニューに表示するには、場所を設定して
モバイルナビゲーションに追加する必要があります。
1. Salesforce で、[設定] から [クイック検索] ボックスに「アプリケーション」と入力し、[アプリケーション] を
選択します。
2. [接続アプリケーション] 関連リストで、ナビゲーションペインで使用できるようにするアプリケーション
をクリックして [編集] をクリックします。
3. [キャンバスアプリケーション設定] セクションの [場所] 項目で、[モバイルナビゲーション] を選択しま
す。
4. [保存] をクリックします
5. キャンバスアプリケーションをナビゲーションメニューに表示するには、モバイルナビゲーションに追加
する必要があります。[設定] から、[クイック検索] ボックスに「ナビゲーション」と入力し、[Salesforce1ナ
ビゲーション] を選択します。
6. 使用可能なメニュー項目から、アプリケーションを選択して [追加] をクリックします。
7. [保存] をクリックします。
Salesforce1 のコンテキストに関する考慮事項
Salesforce1 内でキャンバスアプリケーションを表示するときの考慮事項は、次のとおりです。
フィードまたはパブリッシャー内でキャンバスアプリケーションを表示する場合、(署名付き要求または
getContext コールから) 受け取るキャンバスコンテキストにはSalesforce1パブリッシャー固有の情報が含まれ
ます。
• 環境セクションの displayLocation 値から、フィードまたはパブリッシャーのどちらを使用しているか
を確認できます。パブリッシャーの場合は displayLocation が [パブリッシャー] に設定されます。フィー
ドの場合は displayLocation が ChatterFeed に設定されます。
• キャンバスフィード項目の作成時に、JSON 文字列をパラメータ値として指定できます。コンテキストの送
信時に、フィード項目にあるパラメータ項目の値が、コンテキストの環境セクションのパラメータで送信
されます。
• 他のキャンバスアプリケーションの場合と同様に、コンテキストにはアプリケーションのサイズに関する
情報が含まれます。Salesforceはモバイル用に設計されているため、モバイル用に提供されるサイズは Salesforce
フルサイト用に提供されるサイズとは異なります。
• 1 本指によるタッチスクロール操作を作成するには、次の操作を実行します。
– 最も外側の div 要素に次のプロパティが含まれていることを確認します。
• min-height: 250px;
• overflow: scroll;
• width: 100%;
86
Salesforce1 アプリケーションのキャンバス
Salesforce1 のアクセスに関する考慮事項
• -webkit-overflow-scrolling: touch;
• -webkit-transform: translated(0%,0px,0px);
– height 属性を、署名付き要求で配信される clientHeight 値に設定します。次に例を示します。
// Where sr is a parsed signed request object.
var h = parseInt(sr.context.environment.dimensions.clientHeight, 10);
Sfdc.canvas.byId('divElementId').style.height = h;
– 特に横モードの電話では clientHeight 値が非常に小さくなることがあるため、コンテンツを表示で
きない可能性があります。必要な高さ (ピクセル単位) に設定した min-height を使用して、最適なユー
ザ操作性を確保してください。
– Salesforce1 ナビゲーションメニューのデフォルトのパズルアイコンのサイズは 60 x 60 ピクセルです。
関連トピック:
Salesforce1 アプリケーションのキャンバス
Salesforce1 のアクセスに関する考慮事項
キャンバスアプリケーションのサイズ変更
Salesforce1 カスタムアイコン
Salesforce1 のアクセスに関する考慮事項
Salesforce1 に表示されるキャンバスアプリケーションを変更するときの考慮事項は、次のとおりです。
Salesforce1のレイアウトは、使い慣れているSalesforceフルサイトのレイアウトとは必然的に異なります。Salesforce1
で使用するキャンバスアプリケーションの作成時には、次の点に注意してください。
• キャンバスアプリケーションは Salesforce 内でサードパーティアプリケーションを表示するよう設計されて
いるため、デバイスからキャンバスアプリケーション URL にアクセスできる必要があります。ファイア
ウォールの内側からしかアプリケーションにアクセスできない場合は、モバイルデバイスもファイアウォー
ルの内側に存在する必要があります。ユーザがキャンバス URL にアクセスできないと、エラー (おそらく
404 または 500 エラー) が表示されます。
• Salesforce1のアクションとしてキャンバスアプリケーションにアクセスする場合、「今何をしていますか?」
ヘッダーをキャンバスアプリケーションで使用すると、ヘッダーがページ上部で固定され、キャンバスア
プリケーションのスクロール領域はヘッダーテキストボックスの下に配置されます。
• フィードでは、キャンバスアプリケーションのリンクと説明が、Salesforce フルサイトより少ない文字数で
表示されることがあります。
• 使用するデバイスによっては、デバイスを回転したときにフィード画面が変化することがあります。キャ
ンバスアプリケーションで回転をサポートする必要があります (可能な場合)。方向イベントを使用して、
デバイスの方向の変更を処理します。
• Salesforce1 と Salesforce フルサイトでは、使用される高さが異なります。パブリッシャーでアクションを正し
く表示するには、署名付き要求で Dimensions オブジェクトを使用します。
• アクションメニューでは、アクションの長い表示ラベルが切り捨てられることがあります。
87
Salesforce1 アプリケーションのキャンバス
Salesforce1 カスタムアイコン
• フィードレイアウトは、Salesforce フルサイトのものとは異なります。フィードでアプリケーションが開く
のではなく、画面全体にキャンバスアプリケーションを表示するページが開きます。Salesforce1 に戻るに
は、 をタップします。
• Salesforce1 でアクションバーまたはフィードを表示すると、キャンバスアプリケーションのデフォルトの
Force.com Canvas パズルアイコンが表示されます。指定した画像を使用して、このデフォルトのアクション
アイコンを上書きできます。
• キャンバスアプリケーションがSalesforce1ナビゲーションメニューにオプションとして表示される場合は、
デフォルトの Force.com Canvas パズルアイコンが使用されます。キャンバスアプリケーションの接続アプリ
ケーション設定でアイコンをカスタマイズできます。
• ユーザがオフラインで Salesforce1 にアクセスしている場合、キャンバスアプリケーションは使用できませ
ん。
関連トピック:
Salesforce1 アプリケーションのキャンバス
Salesforce1 のコンテキストに関する考慮事項
Salesforce1 カスタムアイコン
Dimensions
キャンバスアプリケーションの方向の変更の処理
Salesforce1 カスタムアイコン
カスタムアイコンは、Salesforce1 のアプリケーションを区別するのに役立ちます。アプリケーションのアイコ
ンをカスタマイズしない場合、デフォルトのパズルピースアイコンを取得します。
Salesforce1ナビゲーションメニューで使用されるアイコンをカスタマイズできます。キャンバスアプリケーショ
ンの接続アプリケーション設定の [基本情報] セクションにある [アイコン URL] のエントリでこのアイコンを設
定します。[設定] から、[クイック検索] ボックスに「アプリケーション」と入力し、[アプリケーション] を選
択して接続アプリケーションの [編集] をクリックします。アイコン URL は、アイコン画像ファイルを指し示す
セキュアな HTTPS URL を使用する必要があります。画像ファイルは、GIF、JPG、または PNG ファイル形式である
必要があります。Salesforce1ナビゲーションメニューでは、アイコンは 60×60 ピクセル以下のサイズにする必要
があります。
Salesforce1ナビゲーションメニューで使用されるカスタムアイコンは、Chatter タブおよびキャンバスアプリケー
ションのプレビューアでも使用されます。キャンバスアプリケーションがナビゲーションメニューに表示され
る場合、Chatter タブおよびキャンバスアプリケーションのプレビューアでのアイコンのサイズを、Salesforce で
自動的に小さく変更するように、60 × 60 ピクセルサイズのアイコンを使用することをお勧めします。
キャンバスアプリケーションの Salesforce1 アクションバーおよびアクションメニューで使用されるアイコンを
カスタマイズすることもできます。アクションバーでは、接続アプリケーションに関連付けられたカスタムア
イコンではなく、キャンバスアプリケーションにアクセスするアクションのカスタムアイコンセットを使用し
ます。アクションアイコンを設定するには、カスタムアイコンの静的リソースファイルをアップロードして、
この静的リソースをグローバルアクションのアイコンとして使用します。静的リソースアイコンファイルは、
サイズが 120 ピクセル (高さ) × 120 ピクセル (幅) の PNG 形式である必要があります。カスタムアクションアイコ
88
Salesforce1 アプリケーションのキャンバス
キャンバスアプリケーションで使用する Salesforce1 の
navigation メソッド
ンのガイドラインについての詳細は、『Salesforce1 アプリケーション開発者ガイド』の「カスタムアイコンのガ
イドラインとベストプラクティス」を参照してください。
関連トピック:
Salesforce1 アプリケーションのキャンバス
Salesforce1 のコンテキストに関する考慮事項
キャンバスアプリケーションで使用する Salesforce1 の navigation
メソッド
Force.com Canvas フレームワークには、Visualforce を使用せずに、キャンバスアプリケーションと Salesforce1 間の
ナビゲーションを円滑に統合するために使用できるメソッドが含まれます。
以前は、キャンバスアプリケーションが含まれる iframe のナビゲーションの制限を回避するには、Visualforce
ページを使用するしかありませんでした。これらの Force.com Canvas のメソッドには、Salesforce1 でのキャンバ
スアプリケーションへの移動またはキャンバスアプリケーションからの移動を制御するシンプルな代替手段が
用意されています。
たとえば、キャンバスアプリケーションのコードで Salesforce1 の「レコード作成」ロジックをコールして、[ア
カウントを作成]ボタンが存在するページに移動できます。このボタンをクリックすると、Salesforce1の navigation
メソッドがトリガされて、キャンバスアプリケーションの外部にあるレコード作成ページに移動します。
Force.com Canvas フレームワーク内のこれらのメソッドは、JavaScript ライブラリにあるイベントです。いずれか
の navigation メソッドをキャンバスコードからコールすると、Salesforce1 にイベントが送信されます。Salesforce1
は、このペイロードを読み取って指定の移行先にユーザを移動します。
キャンバスアプリケーションからメソッドをコールするのは、Visualforce ページから関数をコールするのとは
若干異なります。これは、メソッドが Force.com Canvas のクロスドメイン API を介して Salesforce コンテナにプロ
キシされるからです。
名前とペイロードを使用して、navigation メソッドをイベント変数として参照します。次に例を示します。
var event = {name:"s1.createRecord", payload: {entityName: "Account", recordTypeId:
"00h300000001234"}};
次の表に、Salesforce1 の navigation メソッドの名前、ペイロード、目的を示します。
関数
説明
back([refresh])
sforce.one 履歴に保存されている、以前の状態に移動します。ブラウザ
の [戻る] ボタンをクリックするのと同じです。
refresh は省略可能です。デフォルトでは、ページは更新されません。
可能な場合は true を渡してページを更新します。
89
Salesforce1 アプリケーションのキャンバス
関数
キャンバスアプリケーションで使用する Salesforce1 の
navigation メソッド
説明
navigateToSObject(recordId recordId で指定した sObject レコードに移動します。このレコードの「ホー
[, view])
ム」には複数のビューがあり、このビューは Salesforce1 内で、ユーザがス
ワイプして移動するスライドとして表示されます。
view は省略可能であり、デフォルトは detail です。view には最初に
表示する、レコードのホーム内のスライドを指定します。使用できる値は
次のとおりです。
• detail: レコード詳細スライド
• chatter: Chatter スライド
• related: 関連スライドのビュー
navigateToURL(url[,
isredirect])
指定した URL に移動します。
相対 URL と絶対 URL がサポートされています。相対 URL は one.app ドメイン
に対して相対的で、ナビゲーション履歴を保持します。外部 URL、つまり、
Salesforce1 アプリケーションの外部の URL は別のブラウザウィンドウで開き
ます。
アプリケーション内のさまざまな画面に移動するには相対 URL を使用しま
す。ユーザに別のサイトまたはアプリケーションへのアクセスを許可する
には外部 URL を使用します。ユーザは移動先のサイトまたはアプリケー
ションで、元のアプリケーションに保持する必要のないアクションを実行
できます。ユーザが元のアプリケーションに戻るには、別のアプリケー
ションを終了したときに、外部 URL によって開かれた別のウィンドウを閉
じる必要があります。この新しいウィンドウは、元のアプリケーションと
は別の履歴を持ち、ウィンドウを閉じるとこの履歴は破棄されます。つま
り、ユーザは [戻る] ボタンをクリックして元のアプリケーションに戻るこ
とはできません。ユーザは新しいウィンドウを閉じる必要があります。
外部アプリケーションを起動し、ユーザが適切な操作を行えるようにする
ため、mailto:、tel:、geo: などの URL スキームがサポートされていま
す。ただし、サポートはモバイルプラットフォームとデバイスによって異
なります。mailto: と tel: は信頼できますが、他の URL については、使
用が想定されるさまざまなデバイスでテストすることをお勧めします。
メモ: navigateToURL では、標準の URL スキームのみがサポートさ
れます。カスタムスキームにアクセスするには、代わりに
window.location を使用します。
isredirect は省略可能であり、デフォルトは false です。ナビゲーショ
ン履歴の現在の URL を新しい URL に置き換えるようにするには、true に
設定します。
navigateToFeed(subjectId, subjectId で絞り込んだ、指定した type のフィードに移動します。一
type)
部のフィード type では、subjectId は必須ですが無視されます。これ
90
Salesforce1 アプリケーションのキャンバス
関数
キャンバスアプリケーションで使用する Salesforce1 の
navigation メソッド
説明
らのフィード type では、現在のユーザの ID を subjectId として渡しま
す。
type はフィードの種別です。使用できる値は次のとおりです。
• BOOKMARKS: コンテキストユーザがブックマークとして保存したすべて
のフィード項目が含まれます。現在のユーザの ID を subjectId とし
て渡します。
• COMPANY: 種別が TrackedChange のフィード項目を除くすべてのフィー
ド項目が含まれます。ユーザがフィード項目を表示するには、親への
共有アクセス権が必要です。現在のユーザの ID を subjectId として
渡します。
• FILES: コンテキストユーザがフォローしている人またはグループによっ
て投稿されたファイルを含むすべてのフィード項目が含まれます。現
在のユーザの ID を subjectId として渡します。
• GROUPS: コンテキストユーザが所有するか、メンバーであるすべての
グループのすべてのフィード項目が含まれます。現在のユーザの ID を
subjectId として渡します。
• NEWS: コンテキストユーザがフォローする人、ユーザがメンバーとなっ
ているグループ、およびユーザがフォローしているファイルとレコー
ドのすべての更新が含まれます。また、親がコンテキストユーザであ
るレコード、およびコンテキストユーザをメンションするかコンテキ
ストユーザがメンバーとなっているグループをメンションするすべて
のフィード項目とコメントのすべての更新も含まれます。現在のユー
ザの ID を subjectId として渡します。
• PEOPLE: コンテキストユーザがフォローしているすべての人によって
投稿されたすべてのフィード項目が含まれます。現在のユーザの ID を
subjectId として渡します。
• RECORD: 親が指定されたレコードであるすべてのフィード項目が含ま
れます。レコードは、グループ、ユーザ、オブジェクト、ファイル、
その他の標準またはカスタムオブジェクトの場合があります。レコー
ドがグループの場合、フィードにはそのグループにメンションしてい
るフィード項目も含まれます。レコードがユーザの場合、フィードに
はそのユーザに対するフィード項目のみが含まれます。別のユーザの
レコードフィードは取得できません。レコードの ID を subjectId と
して渡します。
• TO: コンテキストユーザのメンションを含むすべてのフィード項目、コ
ンテキストユーザがコメントしたフィード項目、コンテキストユーザ
が作成し、コメントされたフィード項目が含まれます。現在のユーザ
の ID を subjectId として渡します。
• TOPICS: 指定したトピックを含むすべてのフィード項目が含まれます。
トピックの ID を subjectId として渡します。この値は、Salesforce1 モ
91
Salesforce1 アプリケーションのキャンバス
関数
キャンバスアプリケーションで使用する Salesforce1 の
navigation メソッド
説明
バイルブラウザアプリケーションでのみサポートされます。トピック
は、Salesforce1 ダウンロード可能アプリケーションでは使用できませ
ん。
navigateToFeedItemDetail( 特定のフィード項目 feedItemId と関連付けられたコメントに移動しま
feedItemId)
す。
navigateToRelatedList(
relatedListId,
parentRecordId)
parentRecordId の関連リストに移動します。たとえば、Warehouse オブ
ジェクトの関連リストを表示する場合、parentRecordId は
Warehouse__c.Id です。
relatedListId は、表示する関連リストの API 名または ID です。
navigateToList(listViewId listViewId (表示されるリストビューの ID) で指定されたリストビューに
, listViewName, scope)
移動します。
listViewName にリストビューのタイトルを設定します。リストビューに
保存されている実際の名前と一致する必要はありません。保存されている
名前を使用するには、listViewName を null に設定します。
scope に、ビュー内の sObject の名前 (「Account」や「MyObject__c」など)
を設定します。
createRecord(entityName[, 指定した entityName (「Account」や「MyObject__c」など) の新しいレコー
recordTypeId])
ドを作成するページを開きます。
recordTypeId は省略可能ですが、使用する場合は、作成されるオブジェ
クトのレコードタイプを指定します。
editRecord(recordId)
recordId で指定したレコードを編集するページを開きます。
Visualforce で使用する navigation メソッドについての詳細は、『Salesforce1 開発者ガイド』を参照してください。
関連トピック:
Visualforce の考慮事項
92
第 10 章
トピック:
•
CanvasLifecycleHandler
の作成
•
CanvasLifecycleHandler
とアプリケーショ
ンの関連付け
•
CanvasRequest コン
テキストデータの
絞り込み
•
キャンバスアプリ
ケーションの動作
の制御
•
ユーザエラーメッ
セージの表示
•
CanvasLifecycleHandler
実装のテスト
•
CanvasLifecycleHandler
クラスの配布
アプリケーションライフサイクルのカスタマイ
ズ
カスタム Apex クラスを提供することで、キャンバスアプリケーションに送信される
コンテキスト情報を制御し、アプリケーションが表示されるときのカスタム動作を
追加できます。
Salesforce では Canvas 名前空間にいくつかの Apex インターフェースとクラスが用意さ
れているため、キャンバスアプリケーションのライフサイクルで追加制御を行うこ
とができます。Canvas 名前空間と CanvasLifecycleHandler インターフェースを使用して、
次のことを実行できます。
• アプリケーションに送信される CanvasRequest コンテキストデータのセクションを
制御する。たとえば、Salesforce で CanvasRequest データの Organization 情報が送信さ
れないようにすることができます。コンテキストデータのセクションを除外する
ことで、要求で送信されるデータ量が削減され、アプリケーションの組織データ
を処理する必要がなくなるため、パフォーマンスが向上します。
• アプリケーションが表示されるときにアプリケーションのコンテキストデータを
取得し、データに応じてアプリケーションの動作を変更する。アプリケーション
のバージョンを取得し、バージョンに応じてアプリケーションの実行方法を変更
できます。
• アプリケーションが表示されるときにRecordデータで返されるキャンバスアプリ
ケーション URL、カスタムパラメータ、またはオブジェクト項目のリストなど、
一部のコンテキストデータを変更する。
• 問題が発生した場合にSalesforce UI でユーザに適切な形式のエラーメッセージを表
示する。
Salesforce は Canvas 名前空間で Test クラスも提供します。このクラスは、テストコン
テキストデータを作成し、アプリケーションを実行せずにライフサイクルハンドラ
の動作を検証するために使用できます。
Apex Canvas 名前空間のリファレンスドキュメントは、『Force.com Apex コード開発者ガ
イド』を参照してください。
93
アプリケーションライフサイクルのカスタマイズ
CanvasLifecycleHandler の作成
CanvasLifecycleHandler の作成
Salesforce で使用できる Canvas.CanvasLifecycleHandler Apex インターフェースを実装して、アプリケーションライフ
サイクルを制御できます。
Apex Canvas.CanvasLifecycleHandler インターフェースには、アプリケーションライフサイクルの動作をカスタマイ
ズするためのメソッドおよびコールバックがあります。Salesforceは、実行時に実装を使用するため、カスタム
コードを実行できます。Canvas.CanvasLifecycleHandler インターフェースの実装を作成する手順は、次のとおりで
す。
1. [設定] から、[クイック検索] ボックスに「Apex クラス」と入力し、[Apex クラス] を選択します。
2. [新規] をクリックして Apex クラスを作成します。
3. Canvas.CanvasLifecycleHandler インターフェースを実装するApexクラスを作成します。excludeContextTypes()
および onRender() メソッドを実装する必要があります。次に、テンプレートの例を示します。
public class MyCanvasLifecycleHandler
implements Canvas.CanvasLifecycleHandler {
public Set<Canvas.ContextTypeEnum> excludeContextTypes(){
Set<Canvas.ContextTypeEnum> excluded = new Set<Canvas.ContextTypeEnum>();
// Code goes here to add items to excluded list
// that should be excluded from Context data
return excluded;
}
public void onRender(Canvas.RenderContext renderContext) {
// Code goes here to customize behavior when the app is rendered
}
}
4. コードの追加が完了したら、Apex クラスを保存します。
5. 必要に応じて、Canvas.Test クラスを使用して実装をテストします。
6. アプリケーションで使用する実装を Salesforce に通知するために、Apex クラスをアプリケーションに関連付
けます。
関連トピック:
CanvasLifecycleHandler 実装のテスト
CanvasLifecycleHandler とアプリケーションの関連付け
CanvasLifecycleHandler とアプリケーションの関連付け
CanvasLifecycleHandler の Apex 実装クラスを作成したら、クラス名をキャンバスアプリケーション設定に追加して
キャンバスアプリケーションに関連付ける必要があります。
94
アプリケーションライフサイクルのカスタマイズ
CanvasRequest コンテキストデータの絞り込み
Canvas.CanvasLifecycleHandler 実装をキャンバスアプリケーションに関連付ける手順は、次のとおりです。
1. [設定] から、[クイック検索] ボックスに「アプリケーション」と入力し、[アプリケーション]を選択します。
2. [接続アプリケーション] で、変更する必要のあるキャンバスアプリケーションを選択し、[編集]をクリック
します。
3. [キャンバスアプリケーション設定] の [接続アプリケーションの編集] ページで、作成した Apex
CanvasLifecycleHandler クラス名を [ライフサイクルクラス] 項目に追加します。
CanvasRequest コンテキストデータの絞り込み
キャンバスアプリケーションに送信される CanvasRequest コンテキストデータを部分的に除外するには、
Canvas.CanvasLifecycleHandler.excludeContextTypes() の実装を指定する必要があります。
Salesforce は、excludeContextTypes() の実装をコールして、アプリケーションに送信されるコンテキスト
情報を判別します。実装は、除外するコンテキストデータのセットを返すか、すべてのコンテキストデータを
受信する必要がある場合は null (または空のセット) を返します。このセットは Canvas.ContextTypeEnum Apex enum
型の値で構成されます。
この enum 値は次のように使用されます。
• ORGANIZATION: キャンバスアプリケーションが実行されている組織に関するコンテキスト情報を除外します。
• RECORD_DETAIL: キャンバスアプリケーションが表示されるオブジェクトレコードに関するコンテキスト情報
を除外します。
• USER: 現在のユーザに関するコンテキスト情報を除外します。
次の例では、excludeContextTypes() 実装で組織およびユーザコンテキストデータを除外します。
public Set<Canvas.ContextTypeEnum> excludeContextTypes(){
Set<Canvas.ContextTypeEnum> excluded = new Set<Canvas.ContextTypeEnum>();
// Exclude the Organization and User context data
excluded.add(Canvas.ContextTypeEnum.ORGANIZATION);
excluded.add(Canvas.ContextTypeEnum.USER);
return excluded;
}
キャンバスアプリケーションが CanvasRequest コンテキストデータを受信するとき、JSON データに「organization」
および「user」セクションは含まれません。
Apex Canvas.ContextTypeEnum の詳細は、『Force.com Apex コード開発者ガイド』を参照してください。
キャンバスアプリケーションの動作の制御
署名付き要求のデフォルトの動作を変更するには、Canvas.CanvasLifecycleHandler.onRender() を実
装する Apex クラスを指定し、このクラスをキャンバスアプリケーションに関連付ける必要があります。
onRender() 実装では、カスタムコードを使用してアプリケーションの動作を制御できます。
Salesforce は、アプリケーションが表示される直前に onRender() の実装をコールします。現在のコンテキス
ト情報は、Canvas.RenderContext パラメータでこのメソッドに渡されます。
95
アプリケーションライフサイクルのカスタマイズ
キャンバスアプリケーションの動作の制御
onRender() 実装では、次のコンテキスト情報を取得できます。
• アプリケーションコンテキストデータ (キャンバスアプリケーション名、URL、バージョン、名前空間など)。
• 環境コンテキストデータ (表示場所、下位の表示場所、オブジェクト項目名、カスタムパラメータ)。
次のコンテキスト情報を設定できます。
• キャンバスアプリケーション URL のアプリケーションドメイン以降の部分。
• キャンバスアプリケーションがオブジェクトページに表示される場合にSalesforceがRecordコンテキストデー
タを返すオブジェクト項目のリスト。<apex:canvasApp> コンポーネントを使用してキャンバスアプリ
ケーションが Visualforce ページに表示され、その Visualforce ページがオブジェクトに関連付けられている場
合などにキャンバスアプリケーションがオブジェクトページに表示されます。
• キャンバスアプリケーションに渡されるカスタムパラメータ。
Canvas.CanvasRenderException を発生させることで、Salesforce のユーザに対してエラーメッセージを表示すること
もできます。
次の処理を行う onRender() 実装の例を以下に示します。
• アプリケーションのバージョン情報をチェックし、サポートされていないバージョンの場合は
CanvasRenderException を発生させます。
• 「/alternatePath」を元の URL のドメイン部分に追加して、現在のキャンバスアプリケーション URL を上書き
します。
• キャンバスアプリケーションが取引先ページに表示されることを予測して、Name、BillingAddress、および
YearStarted を含めるようにオブジェクト項目のリストを設定します。
• 新しい「newCustomParam」パラメータを追加して、カスタムパラメータのセットを上書きします。現在の
パラメータのセットは、最初にローカルで取得されてキャッシュされます。setParametersAsJSON() を
コールするときに現在のカスタムパラメータのセットが失われないように、新しいパラメータがキャッシュ
リストに追加されます。
public void onRender(Canvas.RenderContext renderContext) {
// Get the Application and Environment context from the RenderContext
Canvas.ApplicationContext app = renderContext.getApplicationContext();
Canvas.EnvironmentContext env = renderContext.getEnvironmentContext();
// Check the application version
Double currentVersion = Double.valueOf(app.getVersion());
if (currentVersion <= 5){
// Versions lower than 5 are no longer supported in this example
throw new Canvas.CanvasRenderException('Error: Versions earlier than 5 are no
longer supported.');
}
// Override app URL, replacing portion after domain with '/alternatePath'
app.setCanvasUrlPath('/alternatePath');
// Add Name, BillingAddress and YearStarted to fields
// (assumes we'll run from a component on the Account detail page)
Set<String> fields = new Set<String>{'Name','BillingAddress','YearStarted'};
env.addEntityFields(fields);
96
アプリケーションライフサイクルのカスタマイズ
ユーザエラーメッセージの表示
// Add a new custom param to the set of custom params
// First, get the current custom params
Map<String, Object> previousParams =
(Map<String, Object>) JSON.deserializeUntyped(env.getParametersAsJSON());
// Add a 'newCustomParam' to our Map
previousParams.put('newCustomParam','newValue');
// Now, replace the parameters
env.setParametersAsJSON(JSON.serialize(previousParams));
}
ユーザエラーメッセージの表示
Canvas.CanvasRenderException を使用してユーザにエラーメッセージを表示できます。
onRender() 実装から CanvasRenderException を発生させた場合、Salesforce UI にその例外のエラーメッセージが
ユーザに表示されます。この例外は、onRender() メソッド内でのみ管理されます。
CanvasRenderException は、すべての標準Apex例外クラスメソッドおよびコンストラクタをサポートしています。
Apex 例外についての詳細は、『Force.com Apex コード開発者ガイド』の「Exception クラスおよび組み込み例外」
を参照してください。
次の例では、onRender() 実装で Canvas.CanvasRenderException を発生させます。Salesforce はこの例外を使用し、
ユーザエラーメッセージとして「Error: Could not set URL (エラー: URL を設定できません)」と表示します。
public void onRender(Canvas.RenderContext renderContext) {
// Code omitted that determines if the error condition occured
...
throw new Canvas.CanvasRenderException('Error: Could not set URL.');
}
キャンバスアプリケーションが Salesforce Chatter タブから実行されている場合、次のような類似のエラーメッ
セージが表示されます。
CanvasLifecycleHandler 実装のテスト
Canvas.Test クラスを使用して、キャンバスアプリケーションを実行せずに
Canvas.CanvasLifecycleHandler.onRender() 実装をテストできます。
97
アプリケーションライフサイクルのカスタマイズ
CanvasLifecycleHandler 実装のテスト
Canvas.Test を使用して、疑似アプリケーションおよび環境コンテキストデータで Canvas.RenderContext を作成しま
す。疑似 RenderContext および CanvasLifecycleHandler 実装を使用して Canvas.Test.testCanvasLifecycle()
をコールし、CanvasLifecycleHandler が正しく呼び出されることを確認します。
Canvas.Test.mockRenderContext() を使用して疑似 RenderContext を作成します。初期の疑似アプリケー
ションおよび環境コンテキストデータを指定するか、Canvas.Test でデフォルトの疑似データのセットを使用す
ることができます。初期の疑似アプリケーションおよび環境コンテキストデータは 2 つのキー - 値ペアの対応
付けで指定します。定義済みの Canvas.Test キー名定数をキーとして使用します。次の例では、アプリケーショ
ンコンテキストデータのアプリケーション名と、環境コンテキストデータのサブロケーションを設定します。
Map<String,String> appValues = new Map<String,String>();
appValues.put(Canvas.Test.KEY_NAME,'AppName');
Map<String,String> envValues = new Map<String,String>();
envValues.put(Canvas.Test.KEY_SUB_LOCATION,'mobileDevice');
Canvas.Test で提供されるコンテキストキーの完全なリストは、『Force.com Apex コード開発者ガイド』の「テス
ト定数」を参照してください。
疑似 RenderContext ができたら、RenderContext と CanvasLifecycleHandler を使用して
Canvas.Test.testCanvasLifecycleHandler() をコールできます。このコールは、ハンドラの onRender()
メソッドを呼び出し、疑似 RenderContext をコンテキストデータとして渡します。
次の例では、テストクラスで Canvas.Test を使用しています。テストクラスには 3 つのメソッドがあります。
• testDefaultMockValues() は、デフォルトの Canvas.Test 疑似コンテキストデータを使用して
MyCanvasLifecycleHandler を呼び出します。
• testOverriddenAppValues() は、カスタム疑似 RenderContext と疑似アプリケーション URL およびバー
ジョンアプリケーションコンテキストデータを使用して MyCanvasLifecycleHandler を呼び出します。
• testOverriddenEnvironmentValues() は、カスタム疑似 RenderContext と疑似表示場所、場所 URL、およ
びカスタムパラメータ環境コンテキストデータを使用して MyCanvasLifecycleHandler を呼び出します。カスタ
ムパラメータは、疑似 RenderContext が作成された後、Canvas.EnvironmentContext インターフェースを使用して
設定されます。
-@isTest
global class MyCanvasLifecycleHandlerTest {
static testMethod void testDefaultMockValues(){
// Test handler using the default mock RenderContext Canvas.Test creates
MyCanvasLifecycleHandler handler = new MyCanvasLifecycleHandler();
Canvas.Test.testCanvasLifecycle(handler,null);
}
static testMethod void testOverriddenAppValues(){
// Test handler with some mock application context values
Map<String,String> appValues = new Map<String,String>();
appValues.put(Canvas.Test.KEY_CANVAS_URL,'https://myserver.com:6000/myAppPath');
appValues.put(Canvas.Test.KEY_VERSION,'3.0');
Canvas.RenderContext mock = Canvas.Test.mockRenderContext(appValues,null);
MyCanvasLifecycleHandler handler = new MyCanvasLifecycleHandler();
Canvas.Test.testCanvasLifecycle(handler,mock);
}
98
アプリケーションライフサイクルのカスタマイズ
CanvasLifecycleHandler クラスの配布
static testMethod void testOverriddenEnvironmentValues(){
// Test handler with some mock environment context values
Map<String,String> envValues = new Map<String,String>();
envValues.put(Canvas.Test.KEY_DISPLAY_LOCATION,'Chatter');
envValues.put(Canvas.Test.KEY_LOCATION_URL,
'https://myinstance.salesforce.com/_ui/core/chatter/ui/ChatterPage');
MyCanvasLifecycleHandler handler = new MyCanvasLifecycleHandler();
Canvas.RenderContext mock = Canvas.Test.mockRenderContext(null,envValues);
// Directly update the mock RenderContext and set the custom parameters
mock.getEnvironmentContext().setParametersAsJSON(
'{\"one\":1,\"two\":2,\"bool\":true,\"stringVal\":\"some string\"}');
Canvas.Test.testCanvasLifecycle(handler,mock);
}
}
CanvasLifecycleHandler クラスの配布
キャンバスアプリケーションをパッケージ化して配布する場合、パッケージに必ず CanvasLifecycleHandler クラス
を含めてください。
キャンバスアプリケーションパッケージに CanvasLifecycleHandler 実装を含めるには、次の手順を実行します。
1. Salesforce で、[設定] から [クイック検索] ボックスに「パッケージ」と入力し、[パッケージ] を選択します。
2. キャンバスアプリケーションのパッケージを選択し、パッケージ名をクリックしてパッケージの詳細ペー
ジに移動します。
3. [コンポーネント] の下にあるパッケージの詳細ページで、[追加] をクリックします。
4. [パッケージに追加] ページの [コンポーネントの種類] 項目で [Apex クラス] を選択します。使用可能な Apex
クラスのリストが表示されます。
5. CanvasLifecycleHandler 実装の Apex クラスの横にあるチェックボックスをオンにし、[パッケージに追加] をク
リックします。
99
リファレンス
第 11 章
オブジェクト
Force.com Canvas には、キャンバスアプリケーションと Salesforce 間のコミュニケーションを可能にするオブジェ
クトを含む SDK が備えられています。
関連トピック:
CanvasRequest
SignedRequest
CanvasRequest
キャンバスアプリケーションで署名付き要求を認証に使用すると、Salesforce から最初の POST メッセージに
CanvasRequest オブジェクトが返されます。このオブジェクトには、要求に関連付けられた項目と、Context およ
びClientオブジェクトが含まれます。CanvasRequestオブジェクトは JSON 形式で返され、次の項目が含まれます。
項目
説明
algorithm
要求の署名に使用されるアルゴリズム。
issuedAt
oauthToken が発行されたときのタイムスタンプ。
userId
コンテキストユーザの ID。
次のコードスニペットに、CanvasRequest オブジェクトの例を示します。
{
"context":
{
"application":
{
"applicationId":"06Px000000003ed",
"authType":"SIGNED_REQUEST",
"canvasUrl":"http://instance.salesforce.com:8080
/canvas_app_path/canvas_app.jsp",
"developerName":"my_java_app",
"isInstalledPersonalApp": false,
"name":"My Java App",
"namespace":"org_namespace",
"options":[],
"referenceId":"09HD00000000AUM",
"samlInitiationMethod":"None",
100
オブジェクト
CanvasRequest
"version":"1.0.0"
},
"user":
{
"accessibilityModeEnabled":false,
"currencyISOCode":"USD",
"email":"admin@6457617734813492.com",
"firstName":"Sean",
"fullName":"Sean Forbes",
"isDefaultNetwork":false,
"language":"en_US",
"lastName":"Forbes",
"locale":"en_US",
"networkId":"0DBxx000000001r",
"profileId":"00ex0000000jzpt",
"profilePhotoUrl":"/profilephoto/005/F",
"profileThumbnailUrl":"/profilephoto/005/T",
"roleId":null,
"siteUrl":"https://mydomain.force.com/",
"siteUrlPrefix":"/mycommunity",
"timeZone":"America/Los_Angeles",
"userId":"005x0000001SyyEAAS",
"userName":"admin@6457617734813492.com",
"userType":"STANDARD"
},
"environment":
{
"parameters":
{
"complex":
{
"key1":"value1",
"key2":"value2"
},
"integer":10,
"simple":"This is a simple string.",
"boolean":true
},
"dimensions":
{
"clientHeight":"50px",
"clientWidth":"70px",
"height":"900px",
"width":"800px",
"maxHeight":"2000px",
"maxWidth":"1000px"
},
"record":
{
"attributes":
{
"type":"Account",
"url":"/services/data/v37.0/sobjects/Account/001xx000003DGWiAAO"
101
オブジェクト
CanvasRequest
},
"Id":"001xx000003DGWiAAO",
"Phone":"(555) 555-5555",
"Fax":"(555) 555-5555",
"BillingCity":"Seattle"
},
"displayLocation":"Chatter",
"locationUrl":"http://www.salesforce.com/some/path/index.html",
"subLocation":null,
"uiTheme":"Theme3",
"version":
{
"api":"37.0",
"season":"SUMMER"
},
},
"organization":
{
"currencyIsoCode":"USD",
"multicurrencyEnabled":true,
"name":"Edge Communications",
"namespacePrefix":"org_namespace",
"organizationId":"00Dx00000001hxyEAA"
},
"links":
{
"chatterFeedItemsUrl":"/services/data/v37.0/chatter/feed-items",
"chatterFeedsUrl":"/services/data/v37.0/chatter/feeds",
"chatterGroupsUrl":"/services/data/v37.0/chatter/groups",
"chatterUsersUrl":"/services/data/v37.0/chatter/users",
"enterpriseUrl":"/services/Soap/c/37.0/00Dx00000001hxy",
"loginUrl":"http://login.salesforce.com",
"metadataUrl":"/services/Soap/m/37.0/00Dx00000001hxy",
"partnerUrl":"/services/Soap/u/37.0/00Dx00000001hxy",
"queryUrl":"/services/data/v37.0/query/",
"recentItemsUrl":"/services/data/v37.0/recent/",
"restUrl":"/services/data/v37.0/",
"searchUrl":"/services/data/v37.0/search/",
"sobjectUrl":"/services/data/v37.0/sobjects/",
"userUrl":"/005x0000001SyyEAAS"
}
},
"client":
{
"instanceId":"06Px000000002JZ",
"instanceUrl":"http://instance.salesforce.com:8080",
"oauthToken":"00Dx0000X00Or4J!ARQAQJ34YL8gKowP65p8FDHkvk.Uq5...",
"refreshToken":"00DD0000000K1NM!ARAAQGJVGOyMjh1jjqvShRpLuAq0...",
"targetOrigin":"http://instance.salesforce.com:8080"
},
"algorithm":"HMACSHA256",
"userId":"005x0000001SyyEAAS",
102
オブジェクト
Client
"issuedAt":null
}
関連トピック:
オブジェクト
Client
Context
Client
Clientオブジェクトは、CanvasRequestオブジェクトの署名付き要求から返される JSON 形式のオブジェクトです。
クライアントアプリケーションに関するコンテキスト情報が含まれます。
項目
説明
instanceId
Visualforce ページで公開されるキャンバスアプリケーションの
ID。キャンバスアプリケーションのインスタンス管理用に内
部的に使用されます。
instanceUrl
Salesforce インスタンスの URL。たとえば、
http://instance.salesforce.com に保存されます。Links
オブジェクトから返される URL の先頭を指定するために使用
されます。
oauthToken
コール元に返される OAuth アクセストークン。
refreshToken
クライアントがセッションの認証に使用するトークン。この
値は、キャンバスアプリケーションで、選択した OAuth 範囲
のいずれかで [ユーザに代わっていつでも要求を実行 ]
(refresh_token、offline_access) が設定されている場合にのみ返さ
れます。それ以外の場合、null が返されます。
targetOrigin
キャンバスアプリケーションの URL。ページとキャンバスア
プリケーションを含む iFrame との間のクロスドメイン通信用
に内部的に使用されます。
次のコードスニペットに、Client オブジェクトの例を示します。
"client":
{
"instanceId":"06Px000000002JZ",
"instanceUrl":"http://instance.salesforce.com:8080",
"oauthToken":"00Dx0000X00Or4J!ARQAQJ34YLUq54RMTrQbxVoWUgorjFi3...",
"refreshToken":"00DD0000000K1NM!ARAAQGJVGOyMjh1jjqvShRpLuAq0ke...",
103
オブジェクト
Context
"targetOrigin":"http://instance.salesforce.com:8080"
}
関連トピック:
CanvasRequest
Context
キャンバスアプリケーションを Salesforce で接続アプリケーションとして追加すると、Context オブジェクトを
使用して現在の環境に関する情報を取得できます。Contextオブジェクトには、アプリケーションが誰によって
どのように使用されるかを示す情報が含まれます。この情報を使用して、後続のコールで情報を取得しアプリ
ケーションコードを作成できるため、Salesforceユーザインターフェースと完全に統合されているように見えま
す。このオブジェクトは JSON 形式で返され、次のオブジェクトが含まれます。
• Application — バージョン、アクセス方法、URL などのキャンバスアプリケーションに関する情報。
• Environment — 場所、UI テーマなどの環境に関する情報。
• Links — メタデータ URL、ユーザ URL、Chatter グループ URL などのリンク。これらのリンクを使用して、アプ
リケーションから Salesforce へのコールを行うことができます。
• Organization — 名前、ID、通貨コードなどの組織に関する情報。
• User — ロケール、名前、ユーザ ID、メールなどの現在ログインしているユーザに関する情報。
次のコードに、Context オブジェクトの例を示します。Context オブジェクトは、署名付き要求を使用して認証
した場合にCanvasRequestオブジェクトに返されます。また、このオブジェクトを取得するために明示的なコー
ルを行うこともできます。
"context":{
"application":
{
"applicationId":"06Px000000003ed",
"authType":"SIGNED_REQUEST",
"canvasUrl":"http://instance.salesforce.com:8080
/canvas_app_path/canvas_app.jsp",
"developerName":"my_java_app",
"isInstalledPersonalApp": false,
"name":"My Java App",
"namespace":"org_namespace",
"options":[],
"referenceId":"09HD00000000AUM",
"samlInitiationMethod": "None",
"version":"1.0.0"
},
"user":
{
"accessibilityModeEnabled":false,
"currencyISOCode":"USD",
"email":"admin@6457617734813492.com",
"firstName":"Sean",
"fullName":"Sean Forbes",
"isDefaultNetwork":false,
104
オブジェクト
Context
"language":"en_US",
"lastName":"Forbes",
"locale":"en_US",
"networkId":"0DBxx000000001r",
"profileId":"00ex0000000jzpt",
"profilePhotoUrl":"/profilephoto/005/F",
"profileThumbnailUrl":"/profilephoto/005/T",
"roleId":null,
"siteUrl":"https://mydomain.force.com/",
"siteUrlPrefix":"/mycommunity",
"timeZone":"America/Los_Angeles",
"userId":"005x0000001SyyEAAS",
"userName":"admin@6457617734813492.com",
"userType":"STANDARD"
},
"environment":
{
"parameters":{},
"dimensions":
{
"clientHeight": "50px",
"clientWidth": "70px",
"height":"900px",
"width":"800px",
"maxHeight":"2000px",
"maxWidth":"1000px"
},
"record":
{
"attributes":
{
"type":"Account",
"url":"/services/data/v37.0/sobjects/Account/001xx000003DGWiAAO"
},
"Id":"001xx000003DGWiAAO",
"Phone":"(555) 555-5555",
"Fax":"(555) 555-5555",
"BillingCity":"Seattle"
},
"displayLocation":"Chatter",
"locationUrl":"http://instance.salesforce.com:8080/canvas_app_path",
"subLocation":null,
"uiTheme":"Theme3",
"version":
{
"api":"37.0",
"season":"SUMMER"
}
},
"organization":
{
"currencyIsoCode":"USD",
"multicurrencyEnabled":true,
105
オブジェクト
Context
"name":"Edge Communications",
"namespacePrefix":"org_namespace",
"organizationId":"00Dx00000001hxyEAA"
},
"links":
{
"chatterFeedItemsUrl":"/services/data/v37.0/chatter/feed-items",
"chatterFeedsUrl":"/services/data/v37.0/chatter/feeds",
"chatterGroupsUrl":"/services/data/v37.0/chatter/groups",
"chatterUsersUrl":"/services/data/v37.0/chatter/users",
"enterpriseUrl":"/services/Soap/c/37.0/00Dx00000001hxy",
"loginUrl":"http://login.salesforce.com",
"metadataUrl":"/services/Soap/m/37.0/00Dx00000001hxy",
"partnerUrl":"/services/Soap/u/37.0/00Dx00000001hxy",
"queryUrl":"/services/data/v37.0/query/",
"restUrl":"/services/data/v37.0/",
"recentItemsUrl":"/services/data/v37.0/recent/",
"searchUrl":"/services/data/v37.0/search/",
"sobjectUrl":"/services/data/v37.0/sobjects/",
"userUrl":"/005x0000001SyyEAAS"
}
}
コンテキストデータの不要な部分を除外するようにSalesforceに要求できます。除外するデータの量を制御する
には、独自の Canvas.CanvasLifecycleHandler を Apex で実装し、excludeContextTypes() の実装に除外するコン
テキストセクションのリストを指定します。
関連トピック:
Client
キャンバスアプリケーションでのコンテキストの取得
CanvasRequest コンテキストデータの絞り込み
Application
Application オブジェクトは、Context オブジェクトの署名付き要求から返される JSON 形式のオブジェクトです。
Application オブジェクトには特定のキャンバスアプリケーションの情報が含まれます。この情報は、[設定] か
ら [クイック検索] ボックスに「接続アプリケーション」と入力し、[接続アプリケーション] を選択して、アプ
リケーションを Salesforce の接続アプリケーションとして追加した後に取得されます。
項目
説明
applicationId
キャンバスアプリケーションの ID。
authType
キャンバスアプリケーションのアクセスメソッド。接続アプリケーションを作成
してキャンバスアプリケーションを公開するときは、この値を指定します。
canvasUrl
たとえば、
http://instance.salesforce.com:8080/canvas_app_path/canvas_app.jsp
などの、キャンバスアプリケーションの URL です。
106
オブジェクト
Context
項目
説明
developerName
キャンバスアプリケーションの内部名。接続アプリケーションを作成してキャン
バスアプリケーションを公開するときは、[API 名] 項目にこの値を指定します。
name
キャンバスアプリケーションの名前。
namespace
キャンバスアプリケーションと関連付けられた Salesforce 名前空間プレフィック
ス。
options
次の値の 1 つ、2 つ、または 3 つが含まれる配列。
• HideHeader — 「今何をしていますか?」というテキストが表示されるパブ
リッシャーヘッダーを非表示にします。この値は、キャンバスアプリケーショ
ンがパブリッシャーに表示されている場合にのみ使用されます。
• HideShare — パブリッシャーの [共有] ボタンを非表示にします。この値は、
キャンバスアプリケーションがパブリッシャーに表示されている場合にのみ
使用されます。
• PersonalEnabled — キャンバスアプリケーションをキャンバス個人用アプ
リケーションとしてユーザがインストールできるようにします。
referenceId
キャンバスアプリケーション定義の一意の ID。内部的に使用されます。
version
キャンバスアプリケーションのバージョン。組織のキャンバスアプリケーション
を更新および再公開すると、この値が変化します。
次のコードスニペットに、Application オブジェクトの例を示します。
"application":
{
"applicationId":"06Px000000003ed",
"authType":"SIGNED_REQUEST",
"canvasUrl":"http://instance.salesforce.com:8080/canvas_app_path/canvas_app.jsp",
"developerName":"my_java_app",
"isInstalledPersonalApp": false,
"name":"My Java App",
"namespace":"org_namespace",
"options":["HideShare", "HideHeader"],
"referenceId":"09HD00000000AUM",
"samlInitiationMethod":"None",
"version":"1.0.0"
}
関連トピック:
Context
107
オブジェクト
Context
Environment
Environmentオブジェクトは、キャンバスアプリケーション環境に関するコンテキスト情報を含む、JSON 形式の
オブジェクトです。このオブジェクトには、Dimensions オブジェクト、Record オブジェクト、Version オブジェ
クト、および Parameters オブジェクトのパラメータ (存在する場合) が含まれます。
項目
説明
displayLocation
現在キャンバスアプリケーションをコールしているアプリケー
ションの場所。有効な値は、次のとおりです。
• Chatter — キャンバスアプリケーションが Chatter タブから
コールされました。
• ChatterFeed — キャンバスアプリケーションが Chatter キャン
バスフィード項目からコールされました。
• MobileNav — キャンバスアプリケーションが Salesforce1 のナ
ビゲーションメニューからコールされました。
• OpenCTI — キャンバスアプリケーションが Open CTI コンポー
ネントからコールされました。
• PageLayout — キャンバスアプリケーションがページレイア
ウト内の要素からコールされました。displayLocation が
PageLayout の場合、subLocation のいずれかの値が返される可
能性があります。
• Publisher — キャンバスアプリケーションがキャンバスカス
タムクイックアクションからコールされました。
• ServiceDesk — キャンバスアプリケーションが Salesforce コン
ソールコンポーネントからコールされました。
• Visualforce — キャンバスアプリケーションが Visualforce ペー
ジからコールされました。
• None — キャンバスアプリケーションがキャンバスアプリ
ケーションのプレビューアからコールされました。
locationUrl
ユーザがキャンバスアプリケーションにアクセスするSalesforce
のページの URL。たとえば、Chatterタブのリンクをクリックし
てユーザがキャンバスアプリケーションにアクセスする場合、
この項目には Chatter タブの URL が含まれます。
subLocation
キャンバスアプリケーションがモバイルデバイスに読み込ま
れるときにそのキャンバスアプリケーションのコール元とな
る、アプリケーション内のサブロケーション。subLocation は
displayLocation に関連しています。displayLocation が PageLayout の
場合のこの項目の有効な値は、次のとおりです。
• S1MobileCardFullview — キャンバスアプリケーションがモバ
イルカードからコールされました。
108
オブジェクト
項目
Context
説明
• S1MobileCardPreview — キャンバスアプリケーションがモバ
イルカードプレビューからコールされました。アプリケー
ションを開くには、プレビューをクリックする必要があり
ます。
• S1RecordHomePreview — キャンバスアプリケーションがレ
コード詳細ページプレビューからコールされました。 ア
プリケーションを開くには、プレビューをクリックする必
要があります。
• S1RecordHomeFullview — キャンバスアプリケーションがペー
ジレイアウトからコールされました。
uiTheme
コンテキスト組織のデフォルトのテーマ。
次のコードスニペットに、Environment オブジェクトの例を示します。
"environment":
{
"parameters":{},
"dimensions":
{
"clientHeight": "50px",
"clientWidth": "70px",
"height":"900px",
"width":"800px",
"maxHeight":"2000px",
"maxWidth":"1000px"
},
"record": {
"attributes": {
"type": "Account",
"url": "/services/data/v37.0/sobjects/Account/001xx000003DGWiAAO"
},
"Id": "001xx000003DGWiAAO",
"Phone": "(555) 555-5555",
"Fax": "(555) 555-5555",
"BillingCity": "Seattle"
},
"displayLocation":"PageLayout",
"locationUrl":"http://www.salesforce.com/some/path/index.html",
"subLocation":"S1MobileCardFullview",
"uiTheme":"Theme3",
"version":
{
"api":"37.0",
"season":"SUMMER"
109
オブジェクト
Context
}
}
関連トピック:
Context
Dimensions
Record
Parameters
Version
Dimensions
Dimensions オブジェクトは、キャンバスアプリケーションが表示される iFrame のサイズに関するコンテキスト
情報を含む、JSON 形式のオブジェクトです。
項目
説明
clientHeight
clientHeight の値は、SignedRequest 内のキャンバスアプリ
ケーションに送信され、最も外側の div 要素の高さを設定す
るために使用できます。この項目は、モバイルデバイスから
アクセスするアプリケーションの高さを設定するのに便利で
す。この項目は、
sr.context.environment.dimensions.clientHeight と
して参照できます。sr は、解析された署名付き要求の JavaScript
オブジェクトです。
clientWidth
clientWidth の値は、SignedRequest 内のキャンバスアプリ
ケーションに送信され、最も外側の div 要素の幅を設定する
ために使用できます。この項目は、モバイルデバイスからア
クセスするアプリケーションの幅を設定するのに便利です。
この項目は、
sr.context.environment.dimensions.clientWidth と
して参照できます。sr は、解析された署名付き要求の JavaScript
オブジェクトです。
height
iFrame の高さ (ピクセル単位)。
width
iFrame の幅 (ピクセル単位)。
maxHeight
iFrame の高さの最大値 (ピクセル単位)。デフォルト値は 2,000
です。「infinite」(無限) も有効な値です。
maxWidth
iFrame の幅の最大値 (ピクセル単位)。デフォルト値は 1,000 で
す。「infinite」(無限) も有効な値です。
110
オブジェクト
Context
次のコードスニペットに、Dimensions オブジェクトの例を示します。
"dimensions":
{
"clientHeight": "50px",
"clientWidth": "70px",
"height": "900px",
"width": "800px",
"maxHeight": "2000px",
"maxWidth": "1000px"
},
関連トピック:
Environment
ユーザインターフェースの考慮事項
Record
Recordオブジェクトは、キャンバスアプリケーションが表示されるオブジェクトに関する情報を含む、JSON 形
式のオブジェクトです。Account などの標準オブジェクトの場合、または Warehouse__c などのカスタムオ
ブジェクトの場合があります。オブジェクトページまたはオブジェクトに関連付けられたパブリッシャーや
フィードにキャンバスアプリケーションが表示されない場合は、Record オブジェクトが空になっています。
このオブジェクトには、Attributes オブジェクトが含まれます。
項目
説明
Id
関連オブジェクトの ID。たとえば、[取引先] ページにキャン
バスアプリケーションが表示される場合、この項目に
AccountId が含まれています。
キャンバスアプリケーションが <apex:canvasApp> コンポーネントを使用して Visualforce ページに表示され、
その Visualforce ページがオブジェクトに関連付けられている場合 (たとえば、ページレイアウトへ配置されてい
るなど)、コンポーネントの entityFields 属性を使用して関連するオブジェクトから特定の項目またはすべ
ての項目を返すことができます。
次のコードスニペット例は、[取引先] ページに表示されたキャンバスアプリケーションから返される Record オ
ブジェクトを示します。この例では、entityFields 属性で Phone、Fax、および BillingCity 項目が指定されてい
ます。
"record":{
"attributes":{
"type":"Account",
"url":"/services/data/v37.0/sobjects/Account/001xx000003DGWiAAO"
},
"Id":"001xx000003DGWiAAO",
"Phone":"(555) 555-5555",
"Fax":"(555) 555-5555",
111
オブジェクト
Context
"BillingCity":"Seattle"
}
関連トピック:
Environment
属性
Record オブジェクトの例
レコードオブジェクトで返される項目
属性
Attributesオブジェクトは、キャンバスアプリケーションが表示されるオブジェクトに関する情報を含む、JSON
形式のオブジェクトです。
項目
説明
type
キャンバスアプリケーションが関連付けられているオブジェ
クト。この値は、Account などの標準オブジェクトの場合
と、Warehouse__c などのカスタムオブジェクトの場合があ
ります。
キャンバスアプリケーションがパブリッシャーに表示される
場合、種別は関連付けられたオブジェクトの名前です。たと
えば、CollaborationGroup または Account です。キャン
バスアプリケーションがユーザフィードまたはオブジェクト
に関連付けられたフィードに表示される場合、種別は
FeedItem です。
url
関連付けられたオブジェクトの URL。URL の形式は、指定され
たレコードの REST API リソースと同じです。
次のコードスニペットに、Attributes オブジェクトの例を示します。
"record":{
"attributes":{
"type":"Account",
"url":"/services/data/v37.0/sobjects/Account/001xx000003DGWiAAO"
},
"Id":"001xx000003DGWiAAO"
}
関連トピック:
Record
112
オブジェクト
Context
Record オブジェクトの例
次のコード例では、キャンバスアプリケーションがパブリッシャーまたはフィードのどちらに表示されるかに
応じて異なる情報を Record オブジェクトに含める方法を示します。
パブリッシャーのキャンバスアプリケーション
キャンバスアプリケーションがパブリッシャーに表示される場合、Record オブジェクトには、パブリッシャー
がユーザレコード、グループレコード、オブジェクトレコードのどれに表示されるかに応じて異なる情報が含
まれます。
ユーザレコード
Record オブジェクト Id は User.Id で、Type は User です。
"record":{
"attributes":{
"type":"User",
"url":"/services/data/v37.0/sobjects/User/001xx000003DGWiABC"
},
"Id":"001xx000003DGWiABC"
}
グループレコード
Record オブジェクト Id は CollaborationGroup.Id で、Type は CollaborationGroup です。
"record":{
"attributes":{
"type":"CollaborationGroup",
"url":"/services/data/v37.0/sobjects/CollaborationGroup/001xx000003DGWiXYZ"
},
"Id":"001xx000003DGWiXYZ"
}
オブジェクトレコード
Record オブジェクト Id はオブジェクト Id で、Type はオブジェクト名 (Account など) です。
"record":{
"attributes":{
"type":"Account",
"url":"/services/data/v37.0/sobjects/Account/001xx000003DGWiAAO"
},
"Id":"001xx000003DGWiAAO"
}
フィードのキャンバスアプリケーション
キャンバスアプリケーションがフィードに表示される場合、ユーザレコード、グループレコード、オブジェク
トレコードのどのフィードでも、Record オブジェクトには常にフィード項目情報が含まれます。
Record オブジェクト Id は FeedItem.Id で、Type は FeedItem です。
"reoord":{
"attributes":{
"type":"FeedItem",
113
オブジェクト
Context
"url":"/services/data/v37.0/sobjects/FeedItem/001xx000003DGWiAAO"
},
"Id":"001xx000003DGWiAAO"
}
Parameters
Parametersオブジェクトは、開発者が指定したコンテキスト情報を含む JSON 形式のオブジェクトです。Parameters
オブジェクトは Visualforce ページで、apex:canvasApp コンポーネントの parameters タグを使用するか、ま
たは Chatter キャンバスフィード項目で、フィード項目を作成するときに parameters 変数を使用して指定さ
れます。
次のコードスニペットに、Parameters オブジェクトの例を示します。
"parameters":
{
"inventoryStatus":"Picked",
"stockPrice":"12.99",
"count":2,
"address":{"street":"1 Market", "city":"San Francisco", "state":"CA"}
}
関連トピック:
Environment
apex:canvasApp コンポーネント
Version
Versionオブジェクトは、JSON 形式のオブジェクトで、サーバで実行されているSalesforceのバージョンに関する
コンテキスト情報が含まれています。
項目
説明
api
サーバの API バージョン。
season
サーバで実行されているリリースの季節。
次のコードスニペットに、Version オブジェクトの例を示します。
"version":
{
"api": "37.0",
"season": "WINTER"
}
関連トピック:
Environment
114
オブジェクト
Context
Links
Links オブジェクトは、キャンバスアプリケーションの統合に役立つ URL を含む、JSON 形式のオブジェクトで
す。たとえば、Enterprise WSDL を使用して Salesforce へのコールを行うには、enterpriseUrl を使用します。
メモ: 次の一覧のリンクは、最も使用頻度の高いリンクです。これらは、キャンバスアプリケーションの
REST エンドポイントを作成する時に役立ちます。リンクの完全なリストと関連する機能については、
『Force.com REST API 開発者ガイド』および『Chatter REST API 開発者ガイド』を参照してください。
項目
説明
chatterFeedItemsUrl
コンテキスト組織の Chatter フィード項目を返すための URL。
このリンクは、API バージョン 31.0 以前の機能のみを指し示す
ため、API バージョン 37.0 より前に作成されたインテグレー
ションでは引き続き機能します。
chatterFeedsUrl
コンテキスト組織の Chatter フィードを返すための URL。この
リンクは、API バージョン 31.0 以前の機能のみを指し示すた
め、API バージョン 37.0 より前に作成されたインテグレーショ
ンでは引き続き機能します。
chatterGroupsUrl
コンテキスト組織の Chatter グループを返すための URL。
chatterUsersUrl
コンテキスト組織の Chatter ユーザを返すための URL。
enterpriseUrl
Enterprise WSDL を使用して Salesforce に API コールバックするた
めの URL。
loginUrl
コンテキストユーザがログインしているインスタンスのログ
インサーバの URL。内部的に使用されます。
metadataUrl
メタデータ API へのコールを行うための URL。
partnerUrl
パートナー WSDL を使用して Salesforce に API コールバックする
ための URL。
queryUrl
SOQL クエリを発行するための URL。
recentItemsUrl
最近使ったデータにアクセスするための URL。
restUrl
REST API リソースのリストを返すための URL。
searchUrl
SOSL 検索を発行するための URL。
sobjectUrl
Salesforce オブジェクトからメタデータまたはデータを取得す
るための URL。
userUrl
コンテキストユーザの URL。
115
オブジェクト
Context
次のコードスニペットに、Links オブジェクトの例を示します。
"links":
{
"chatterFeedItemsUrl":"/services/data/v31.0/chatter/feed-items",
"chatterFeedsUrl":"/services/data/v31.0/chatter/feeds",
"chatterGroupsUrl":"/services/data/v37.0/chatter/groups",
"chatterUsersUrl":"/services/data/v37.0/chatter/users",
"enterpriseUrl":"/services/Soap/c/37.0/00Dx00000001hxy",
"loginUrl":"http://login.salesforce.com",
"metadataUrl":"/services/Soap/m/37.0/00Dx00000001hxy",
"partnerUrl":"/services/Soap/u/37.0/00Dx00000001hxy",
"queryUrl":"/services/data/v37.0/query/",
"recentItemsUrl":"/services/data/v37.0/recent/",
"restUrl":"/services/data/v37.0/",
"searchUrl":"/services/data/v37.0/search/",
"sobjectUrl":"/services/data/v37.0/sobjects/",
"userUrl":"/005x0000001SyyEAAS"
}
使用可能なリンクと OAuth 範囲
キャンバスアプリケーションで使用できるリンクは、接続アプリケーションの作成時に選択された OAuth 範囲
によって異なります。
範囲
説明
基本情報へのアクセス
• userUrl
• loginUrl
データへのアクセスと管理
• enterpriseUrl
• metadataUrl
• partnerUrl
• queryUrl
• recentItemsUrl
• restUrl
• searchUrl
• sobjectUrl
Chatter データへのアクセスと管理
• chatterFeedItemsUrl
• chatterFeedsUrl
• chatterGroupsUrl
• chatterUsersUrl
116
オブジェクト
Context
範囲
説明
フルアクセス
すべてのリンク
関連トピック:
Context
Organization
Organizationオブジェクトは、キャンバスアプリケーションが実行されている組織に関するコンテキスト情報を
含む、JSON 形式のオブジェクトです。
項目
説明
currencyIsoCode
コンテキスト組織でマルチ通貨が有効になっている場合は、
コンテキストユーザの通貨が返されます。設定されていない
場合は、デフォルトのマスタ通貨が返されます。コンテキス
ト組織でマルチ通貨が無効になっている場合は、マスタ通貨
のロケールの通貨が返されます。
multicurrencyEnabled
コンテキスト組織でマルチ通貨を使用するか (true)、否か
(false) を示します。
namespacePrefix
キャンバスアプリケーションと関連付けられた Salesforce 名前
空間プレフィックス。
name
コンテキスト組織の名前。
organizationId
コンテキスト組織の ID。
次のコードスニペットに、Organization オブジェクトの例を示します。
"organization":
{
"currencyIsoCode":"USD",
"multicurrencyEnabled":true,
"name":"Edge Communications",
"namespacePrefix":"org_namespace",
"organizationId":"00Dx00000001hxyEAA"
}
関連トピック:
Context
117
オブジェクト
Context
User
User オブジェクトは、現在のユーザに関するコンテキスト情報を含む JSON 形式のオブジェクトです。この情
報は、キャンバスアプリケーション内で使用できます (ユーザ名を表示する場合など)。また、後続コールを
行って追加情報を取得するために使用することもできます (現在のユーザのロール情報を取得する場合など)。
項目
説明
accessibilityModeEnabled
コンテキストユーザについて、視覚障害者のためのユーザイ
ンターフェースの変更が可能かどうかを示します (可能な場合
は true、不可能な場合は false)。
currencyISOCode
マルチ通貨組織のコンテキストユーザのデフォルト通貨コー
ドまたは単一通貨の組織の組織の通貨コードを返します。
email
コンテキストユーザのメールアドレス。
firstName
コンテキストユーザの名前 (ファーストネーム)。
fullName
コンテキストユーザの氏名。形式は、Firstname Lastname です。
isDefaultNetwork
コンテキストユーザについて、そのユーザがコミュニティに
存在するか (true)、否か (false) を示します。
language
コンテキストユーザの言語。文字列の長さは、2 - 5 文字です。
最初の 2 文字は常に、「fr」や 「en」などの ISO 言語コードで
す。値がさらに国別に評価される場合、文字列はアンダース
コア (_) に続き、「US」や「UK」などの ISO 国コードが続きま
す。たとえば、アメリカを示す文字列は「en_US」、カナダの
フランス語圏を示す文字列は「fr_CA」です。
lastName
コンテキストユーザの姓。
locale
コンテキストユーザのロケール。
networkId
コンテキストユーザが現在ログインしているコミュニティの
ID。
profileId
現在コンテキストユーザに割り当てられているロールに関連
付けられたプロファイルの ID。
profilePhotoUrl
Chatter が有効化されている場合のコンテキストユーザのプロ
ファイル写真の URL。写真がアップロードされるたびに URL が
更新され、最新の写真が反映されます。新しい写真がアップ
ロードされた場合、古い写真で返されていた URL では写真が
返されることが保証されません。この項目を使用して最新の
写真の URL を必ずクエリしてください。
profileThumbnailUrl
Chatter が有効化されている場合の、コンテキストユーザのプ
ロファイル写真のサムネイルの URL。写真がアップロードさ
れるたびに URL が更新され、最新の写真が反映されます。新
118
オブジェクト
項目
Context
説明
しい写真がアップロードされた場合、古い写真で返されてい
た URL では写真が返されることが保証されません。この項目
を使用して最新の写真の URL を必ずクエリしてください。
roleId
コンテキストユーザの現在割り当てられているロールの ID。
siteUrl
コンテキストユーザが現在ログインしているコミュニティの
URL。
siteUrlPrefix
コンテキストユーザが現在ログインしているコミュニティの
URL プレフィックス。
timeZone
コンテキストユーザのタイムゾーン。
userId
コンテキストユーザの ID。
userName
コンテキストユーザのログイン名。
userType
コンテキストユーザに関連付けられたプロファイルのユーザ
ライセンスの種別。
次のコードスニペットに、User オブジェクトの例を示します。
"user":
{
"accessibilityModeEnabled":false,
"currencyISOCode":"USD",
"email":"admin@6457617734813492.com",
"firstName":"Sean",
"fullName":"Sean Forbes",
"isDefaultNetwork":false,
"language":"en_US",
"lastName":"Forbes",
"locale":"en_US",
"networkId":"0DBxx000000001r",
"profileId":"00ex0000000jzpt",
"profilePhotoUrl":"/profilephoto/005/F",
"profileThumbnailUrl":"/profilephoto/005/T",
"roleId":null,
"siteUrl":"https://mydomain.force.com/",
"siteUrlPrefix":"/mycommunity",
"timeZone":"America/Los_Angeles",
"userId":"005x0000001SyyEAAS",
"userName":"admin@6457617734813492.com",
"userType":"STANDARD"
}
関連トピック:
Context
119
オブジェクト
Controller
Controller
Visualforce ページにキャンバスアプリケーションが含まれている場合は、Controller オブジェクトでメソッドを使
用して、キャンバスアプリケーションが登録するイベントを公開できます。このクラスには次のメソッドが含
まれます。
メソッド
署名
説明
publish
publish(String name, Object
payload [, String[] target])
キャンバスアプリケーションの登録先
となるイベントの公開に使用します。
target パラメータは省略可能です。1
つのキャンバスアプリケーション名、
またはキャンバスアプリケーション名
の配列を含めることができます。
resize
resize(String height, String
width, String target)
Visualforce ページで、キャンバスアプリ
ケーションの iFrame のサイズ変更に使
用します。
subscribe
subscribe(Subscriber event)
Visualforce ページで、キャンバスアプリ
ケーションが公開するイベントへの登
録に使用します。
unsubscribe
unsubscribe(Unsubscriber event) Visualforce ページで、キャンバスアプリ
ケーションが公開する親イベントから
の登録解除に使用します。
関連トピック:
Visualforce ページとキャンバスアプリケーション間でのイベントの使用
SignedRequest
SignedRequest
Force.com Canvas には、署名付き要求で使用できるメソッドを備えた SignedRequest オブジェクトがあります。
メソッド
署名
説明
verifyAndDecode
public static CanvasRequest
verifyAndDecode(String input,
String secret) throws
SecurityException
署名付き要求を検証して復号化する場
合に使用します。CanvasRequest Java オブ
ジェクトを返します。
120
オブジェクト
SignedRequest
メソッド
署名
説明
verifyAndDecodeAsJson
public static String
verifyAndDecodeAsJson(String
input, String secret) throws
SecurityException
署名付き要求を検証して復号化する場
合に使用します。JSON 文字列の
CanvasRequest データを返します。
関連トピック:
CanvasRequest
署名付き要求の検証および復号化
署名付き要求の要求
121
第 12 章
Force.com Canvas の制限
Force.com Canvas はマルチテナント環境で実行されるため、共有リソースが確実に保護されるように制限が課せ
られます。
説明
制限
Chatterタブに表示できるユーザあたりのキャンバスア 50
プリケーション数。最初の 50 個のキャンバスアプリ
ケーションのみが表示されます (アルファベット順)。
ユーザあたりの、1 日 (24 時間) あたりの Force.com Canvas 5,000
コール数
これには、コンテキストを取得するための SDK コール
と、署名付き要求コールが含まれます。SignedRequest
メソッドをコールすると、実際には、そのメソッド用
のコールと内部ロギング用のコールという 2 つのコー
ルが行われます。
ユーザあたりの、1 日あたりの Heroku クイックスター 100
トコール
Heroku アカウントには、実行できるコール数に独自の
制限があります。
関連トピック:
Force.com Canvas の概要
クイックスタート
クイックスタート — 詳細
122

普段着の住宅にお客様をお迎えして。

Canvas って何？ 次のステップは？ 他に何を知るべきですか？ サポート

パンフレットPDF

キッズデジタル音楽制作プロジェクト『おとラボ』 かえるのうたをかえる

キッズデジタル音楽制作プロジェクト『おとラボ』 第二回 「かえるのうたを

こちら - 日本ポラデジタル

Copyright© CANVAS. All Rights Reserved.