Suche senden
Hochladen
Force.com canvas入門ガイド
•
12 gefällt mir
•
11,666 views
Kazuki Nakajima
Folgen
Melden
Teilen
Melden
Teilen
1 von 25
Jetzt herunterladen
Downloaden Sie, um offline zu lesen
Empfohlen
Force.com Canvas アプリケーション
Force.com Canvas アプリケーション
Salesforce Developers Japan
大量データを扱う際のクイックTips インデックス&スキニーテーブル編-
大量データを扱う際のクイックTips インデックス&スキニーテーブル編-
Salesforce Developers Japan
Einstein Next Best Action を試してみよう
Einstein Next Best Action を試してみよう
Salesforce Developers Japan
Visualforceを使ってみよう
Visualforceを使ってみよう
Salesforce Developers Japan
Einstein Analyticsでのデータ取り込みと加工
Einstein Analyticsでのデータ取り込みと加工
Salesforce Developers Japan
[DO02] Jenkins PipelineとBlue Oceanによる、フルスクラッチからの継続的デリバリ
[DO02] Jenkins PipelineとBlue Oceanによる、フルスクラッチからの継続的デリバリ
de:code 2017
モダンなイベント駆動型システム連携を学ぼう〜Platform Events 入門
モダンなイベント駆動型システム連携を学ぼう〜Platform Events 入門
Salesforce Developers Japan
Salesforce Integration Patterns
Salesforce Integration Patterns
usolutions
Empfohlen
Force.com Canvas アプリケーション
Force.com Canvas アプリケーション
Salesforce Developers Japan
大量データを扱う際のクイックTips インデックス&スキニーテーブル編-
大量データを扱う際のクイックTips インデックス&スキニーテーブル編-
Salesforce Developers Japan
Einstein Next Best Action を試してみよう
Einstein Next Best Action を試してみよう
Salesforce Developers Japan
Visualforceを使ってみよう
Visualforceを使ってみよう
Salesforce Developers Japan
Einstein Analyticsでのデータ取り込みと加工
Einstein Analyticsでのデータ取り込みと加工
Salesforce Developers Japan
[DO02] Jenkins PipelineとBlue Oceanによる、フルスクラッチからの継続的デリバリ
[DO02] Jenkins PipelineとBlue Oceanによる、フルスクラッチからの継続的デリバリ
de:code 2017
モダンなイベント駆動型システム連携を学ぼう〜Platform Events 入門
モダンなイベント駆動型システム連携を学ぼう〜Platform Events 入門
Salesforce Developers Japan
Salesforce Integration Patterns
Salesforce Integration Patterns
usolutions
【AWS初心者向けWebinar】AWSのプロビジョニングからデプロイまで
【AWS初心者向けWebinar】AWSのプロビジョニングからデプロイまで
Amazon Web Services Japan
Salesforceのサイトゲストユーザについて
Salesforceのサイトゲストユーザについて
Taiki Yoshikawa
20230424_TDXGG寄稿記事:同期/非同期アーキテクチャの比較
20230424_TDXGG寄稿記事:同期/非同期アーキテクチャの比較
Takashi Hatamoto
SalesforceにおけるCDC(変更データキャプチャ)の実装・活用法について
SalesforceにおけるCDC(変更データキャプチャ)の実装・活用法について
Takashi Hatamoto
Lightning アプリケーション開発 - Visualforce ページの移行
Lightning アプリケーション開発 - Visualforce ページの移行
Salesforce Developers Japan
Docker 간단 개념 / Docker 를 이용한 MSA 기반의 Spring Boot 프로젝트 - DSmentoring 정다운
Docker 간단 개념 / Docker 를 이용한 MSA 기반의 Spring Boot 프로젝트 - DSmentoring 정다운
다운 정
Salesforceでの大規模データの取り扱い
Salesforceでの大規模データの取り扱い
Salesforce Developers Japan
認定 Integration Architecture デザイナー試験を復習してみた
認定 Integration Architecture デザイナー試験を復習してみた
Takahito Miyamoto
Salesforceの開発についてちょっと詳しくなる
Salesforceの開発についてちょっと詳しくなる
Junko Nakayama
Integration using Salesforce Canvas
Integration using Salesforce Canvas
Dhanik Sahni
Salesforce integration architecture 20200529
Salesforce integration architecture 20200529
Hiroki Iida
Lightning web components - Episode 1 - An Introduction
Lightning web components - Episode 1 - An Introduction
Salesforce Developers
Salesforce point of License 20200819
Salesforce point of License 20200819
Hiroki Iida
Spring fest2020 spring-security
Spring fest2020 spring-security
土岐 孝平
超初心者向けForce.com入門
超初心者向けForce.com入門
Salesforce Developers Japan
Einstein Analyticsによるユースケース別機能、実現例のご紹介(前編)〜Winter’18 新機能紹介を交えて
Einstein Analyticsによるユースケース別機能、実現例のご紹介(前編)〜Winter’18 新機能紹介を交えて
Salesforce Developers Japan
Power app custom api v0.1.21.1221
Power app custom api v0.1.21.1221
Ayumu Inaba
Amazon EKS上の開発体験を最大化するプレビュー環境の作り方
Amazon EKS上の開発体験を最大化するプレビュー環境の作り方
理弘 山崎
IaC事始め Infrastructure as Code やってみる?
IaC事始め Infrastructure as Code やってみる?
大使 梶原
本当にできるの?ミッションクリティカルシステムのクラウド移行ダイジェスト (Oracle Cloudウェビナーシリーズ: 2021年7月7日)
本当にできるの?ミッションクリティカルシステムのクラウド移行ダイジェスト (Oracle Cloudウェビナーシリーズ: 2021年7月7日)
オラクルエンジニア通信
Tech talk salesforce mobile sdk
Tech talk salesforce mobile sdk
Kazuki Nakajima
勉強会force#3 iOSアプリ開発
勉強会force#3 iOSアプリ開発
Kazuki Nakajima
Weitere ähnliche Inhalte
Was ist angesagt?
【AWS初心者向けWebinar】AWSのプロビジョニングからデプロイまで
【AWS初心者向けWebinar】AWSのプロビジョニングからデプロイまで
Amazon Web Services Japan
Salesforceのサイトゲストユーザについて
Salesforceのサイトゲストユーザについて
Taiki Yoshikawa
20230424_TDXGG寄稿記事:同期/非同期アーキテクチャの比較
20230424_TDXGG寄稿記事:同期/非同期アーキテクチャの比較
Takashi Hatamoto
SalesforceにおけるCDC(変更データキャプチャ)の実装・活用法について
SalesforceにおけるCDC(変更データキャプチャ)の実装・活用法について
Takashi Hatamoto
Lightning アプリケーション開発 - Visualforce ページの移行
Lightning アプリケーション開発 - Visualforce ページの移行
Salesforce Developers Japan
Docker 간단 개념 / Docker 를 이용한 MSA 기반의 Spring Boot 프로젝트 - DSmentoring 정다운
Docker 간단 개념 / Docker 를 이용한 MSA 기반의 Spring Boot 프로젝트 - DSmentoring 정다운
다운 정
Salesforceでの大規模データの取り扱い
Salesforceでの大規模データの取り扱い
Salesforce Developers Japan
認定 Integration Architecture デザイナー試験を復習してみた
認定 Integration Architecture デザイナー試験を復習してみた
Takahito Miyamoto
Salesforceの開発についてちょっと詳しくなる
Salesforceの開発についてちょっと詳しくなる
Junko Nakayama
Integration using Salesforce Canvas
Integration using Salesforce Canvas
Dhanik Sahni
Salesforce integration architecture 20200529
Salesforce integration architecture 20200529
Hiroki Iida
Lightning web components - Episode 1 - An Introduction
Lightning web components - Episode 1 - An Introduction
Salesforce Developers
Salesforce point of License 20200819
Salesforce point of License 20200819
Hiroki Iida
Spring fest2020 spring-security
Spring fest2020 spring-security
土岐 孝平
超初心者向けForce.com入門
超初心者向けForce.com入門
Salesforce Developers Japan
Einstein Analyticsによるユースケース別機能、実現例のご紹介(前編)〜Winter’18 新機能紹介を交えて
Einstein Analyticsによるユースケース別機能、実現例のご紹介(前編)〜Winter’18 新機能紹介を交えて
Salesforce Developers Japan
Power app custom api v0.1.21.1221
Power app custom api v0.1.21.1221
Ayumu Inaba
Amazon EKS上の開発体験を最大化するプレビュー環境の作り方
Amazon EKS上の開発体験を最大化するプレビュー環境の作り方
理弘 山崎
IaC事始め Infrastructure as Code やってみる?
IaC事始め Infrastructure as Code やってみる?
大使 梶原
本当にできるの?ミッションクリティカルシステムのクラウド移行ダイジェスト (Oracle Cloudウェビナーシリーズ: 2021年7月7日)
本当にできるの?ミッションクリティカルシステムのクラウド移行ダイジェスト (Oracle Cloudウェビナーシリーズ: 2021年7月7日)
オラクルエンジニア通信
Was ist angesagt?
(20)
【AWS初心者向けWebinar】AWSのプロビジョニングからデプロイまで
【AWS初心者向けWebinar】AWSのプロビジョニングからデプロイまで
Salesforceのサイトゲストユーザについて
Salesforceのサイトゲストユーザについて
20230424_TDXGG寄稿記事:同期/非同期アーキテクチャの比較
20230424_TDXGG寄稿記事:同期/非同期アーキテクチャの比較
SalesforceにおけるCDC(変更データキャプチャ)の実装・活用法について
SalesforceにおけるCDC(変更データキャプチャ)の実装・活用法について
Lightning アプリケーション開発 - Visualforce ページの移行
Lightning アプリケーション開発 - Visualforce ページの移行
Docker 간단 개념 / Docker 를 이용한 MSA 기반의 Spring Boot 프로젝트 - DSmentoring 정다운
Docker 간단 개념 / Docker 를 이용한 MSA 기반의 Spring Boot 프로젝트 - DSmentoring 정다운
Salesforceでの大規模データの取り扱い
Salesforceでの大規模データの取り扱い
認定 Integration Architecture デザイナー試験を復習してみた
認定 Integration Architecture デザイナー試験を復習してみた
Salesforceの開発についてちょっと詳しくなる
Salesforceの開発についてちょっと詳しくなる
Integration using Salesforce Canvas
Integration using Salesforce Canvas
Salesforce integration architecture 20200529
Salesforce integration architecture 20200529
Lightning web components - Episode 1 - An Introduction
Lightning web components - Episode 1 - An Introduction
Salesforce point of License 20200819
Salesforce point of License 20200819
Spring fest2020 spring-security
Spring fest2020 spring-security
超初心者向けForce.com入門
超初心者向けForce.com入門
Einstein Analyticsによるユースケース別機能、実現例のご紹介(前編)〜Winter’18 新機能紹介を交えて
Einstein Analyticsによるユースケース別機能、実現例のご紹介(前編)〜Winter’18 新機能紹介を交えて
Power app custom api v0.1.21.1221
Power app custom api v0.1.21.1221
Amazon EKS上の開発体験を最大化するプレビュー環境の作り方
Amazon EKS上の開発体験を最大化するプレビュー環境の作り方
IaC事始め Infrastructure as Code やってみる?
IaC事始め Infrastructure as Code やってみる?
本当にできるの?ミッションクリティカルシステムのクラウド移行ダイジェスト (Oracle Cloudウェビナーシリーズ: 2021年7月7日)
本当にできるの?ミッションクリティカルシステムのクラウド移行ダイジェスト (Oracle Cloudウェビナーシリーズ: 2021年7月7日)
Ähnlich wie Force.com canvas入門ガイド
Tech talk salesforce mobile sdk
Tech talk salesforce mobile sdk
Kazuki Nakajima
勉強会force#3 iOSアプリ開発
勉強会force#3 iOSアプリ開発
Kazuki Nakajima
進化する Web ~ Progressive Web Apps の実装と応用 ~
進化する Web ~ Progressive Web Apps の実装と応用 ~
Microsoft Azure Japan
iOS の動画アプリ開発に Xamarin を使ってみた @JXUG #2 East
iOS の動画アプリ開発に Xamarin を使ってみた @JXUG #2 East
irgaly
Windows Phone で Active Directory 認証 2011.12.1版
Windows Phone で Active Directory 認証 2011.12.1版
junichi anno
ソーシャルアプリ勉強会(第一回資料)配布用
ソーシャルアプリ勉強会(第一回資料)配布用
Yatabe Terumasa
ちゃんと理解するForce.com canvas
ちゃんと理解するForce.com canvas
Hiroshi Nakamura
202204 AWS Black Belt Online Seminar Amazon Connect を活用したオンコール対応の実現
202204 AWS Black Belt Online Seminar Amazon Connect を活用したオンコール対応の実現
Amazon Web Services Japan
Microsoft Azure Mobile Serviceによるアプリ構築
Microsoft Azure Mobile Serviceによるアプリ構築
Nobuaki Aoki
Step by stepで学ぶTerraformによる監視付きAWS構築
Step by stepで学ぶTerraformによる監視付きAWS構築
Yo Takezawa
継続的8章
継続的8章
shinjiyoshida
ADFS クレームルール言語 Deep Dive
ADFS クレームルール言語 Deep Dive
Suguru Kunii
Amazon QuickSight の組み込み方法をちょっぴりDD
Amazon QuickSight の組み込み方法をちょっぴりDD
Amazon Web Services Japan
名古屋Ruby会議01 A3.製造業向け3Dデータ変換ソリューションにおけるRuby活用事例
名古屋Ruby会議01 A3.製造業向け3Dデータ変換ソリューションにおけるRuby活用事例
Shigeru UCHIYAMA
[CTO Night & Day 2019] AWS Amplify で Web/Mobile 爆速スケーラブル Serverless 開発 #ctonight
[CTO Night & Day 2019] AWS Amplify で Web/Mobile 爆速スケーラブル Serverless 開発 #ctonight
Amazon Web Services Japan
[SC05] 株式会社アシックス様における Azure AD 導入プロジェクトの実際
[SC05] 株式会社アシックス様における Azure AD 導入プロジェクトの実際
de:code 2017
Sf素人が2週間でアプリケーションビルダーに挑戦してみた
Sf素人が2週間でアプリケーションビルダーに挑戦してみた
政雄 金森
Isomorphic web development with scala and scala.js
Isomorphic web development with scala and scala.js
TanUkkii
iOS WebView App
iOS WebView App
hagino 3000
WordPress widget api
WordPress widget api
Takami Kazuya
Ähnlich wie Force.com canvas入門ガイド
(20)
Tech talk salesforce mobile sdk
Tech talk salesforce mobile sdk
勉強会force#3 iOSアプリ開発
勉強会force#3 iOSアプリ開発
進化する Web ~ Progressive Web Apps の実装と応用 ~
進化する Web ~ Progressive Web Apps の実装と応用 ~
iOS の動画アプリ開発に Xamarin を使ってみた @JXUG #2 East
iOS の動画アプリ開発に Xamarin を使ってみた @JXUG #2 East
Windows Phone で Active Directory 認証 2011.12.1版
Windows Phone で Active Directory 認証 2011.12.1版
ソーシャルアプリ勉強会(第一回資料)配布用
ソーシャルアプリ勉強会(第一回資料)配布用
ちゃんと理解するForce.com canvas
ちゃんと理解するForce.com canvas
202204 AWS Black Belt Online Seminar Amazon Connect を活用したオンコール対応の実現
202204 AWS Black Belt Online Seminar Amazon Connect を活用したオンコール対応の実現
Microsoft Azure Mobile Serviceによるアプリ構築
Microsoft Azure Mobile Serviceによるアプリ構築
Step by stepで学ぶTerraformによる監視付きAWS構築
Step by stepで学ぶTerraformによる監視付きAWS構築
継続的8章
継続的8章
ADFS クレームルール言語 Deep Dive
ADFS クレームルール言語 Deep Dive
Amazon QuickSight の組み込み方法をちょっぴりDD
Amazon QuickSight の組み込み方法をちょっぴりDD
名古屋Ruby会議01 A3.製造業向け3Dデータ変換ソリューションにおけるRuby活用事例
名古屋Ruby会議01 A3.製造業向け3Dデータ変換ソリューションにおけるRuby活用事例
[CTO Night & Day 2019] AWS Amplify で Web/Mobile 爆速スケーラブル Serverless 開発 #ctonight
[CTO Night & Day 2019] AWS Amplify で Web/Mobile 爆速スケーラブル Serverless 開発 #ctonight
[SC05] 株式会社アシックス様における Azure AD 導入プロジェクトの実際
[SC05] 株式会社アシックス様における Azure AD 導入プロジェクトの実際
Sf素人が2週間でアプリケーションビルダーに挑戦してみた
Sf素人が2週間でアプリケーションビルダーに挑戦してみた
Isomorphic web development with scala and scala.js
Isomorphic web development with scala and scala.js
iOS WebView App
iOS WebView App
WordPress widget api
WordPress widget api
Mehr von Kazuki Nakajima
ビーコンBotによるニュータイプな受付
ビーコンBotによるニュータイプな受付
Kazuki Nakajima
Apexで作成したrest apiをしっかり保護する方法
Apexで作成したrest apiをしっかり保護する方法
Kazuki Nakajima
Waterfall cafeで働くBot
Waterfall cafeで働くBot
Kazuki Nakajima
AIが入った栄養士Botのアーキテクチャー
AIが入った栄養士Botのアーキテクチャー
Kazuki Nakajima
AIを組み込んだ近未来のアプリケーションで感じる新しいサービスの新しい開発手法
AIを組み込んだ近未来のアプリケーションで感じる新しいサービスの新しい開発手法
Kazuki Nakajima
畑と会話するニュータイプなIo tアプリで加熱中の技術トレンドを鷲掴みにする45分
畑と会話するニュータイプなIo tアプリで加熱中の技術トレンドを鷲掴みにする45分
Kazuki Nakajima
無償のAPEXワークスペース取得方法
無償のAPEXワークスペース取得方法
Kazuki Nakajima
Oracle Cloudのjava実行環境
Oracle Cloudのjava実行環境
Kazuki Nakajima
実はDatabase cloudだけで実現できる巷で噂の機械学習とは?
実はDatabase cloudだけで実現できる巷で噂の機械学習とは?
Kazuki Nakajima
海外で人気沸騰中のIo tデバイスとdatabase cloudで構成するシンプルなiot構成を学ぶ
海外で人気沸騰中のIo tデバイスとdatabase cloudで構成するシンプルなiot構成を学ぶ
Kazuki Nakajima
鳥肌必至のニューラルネットワークによる近未来の画像認識技術を体験し、IoTの知られざるパワーを知る
鳥肌必至のニューラルネットワークによる近未来の画像認識技術を体験し、IoTの知られざるパワーを知る
Kazuki Nakajima
今さらきけない環境ハブ
今さらきけない環境ハブ
Kazuki Nakajima
Spring'15 ISV様向け新機能紹介
Spring'15 ISV様向け新機能紹介
Kazuki Nakajima
絶対使いたくなるAppexchangeアプリとそのアーキテクチャー
絶対使いたくなるAppexchangeアプリとそのアーキテクチャー
Kazuki Nakajima
ビジネスアイデアを最速で形にできるApp exchange
ビジネスアイデアを最速で形にできるApp exchange
Kazuki Nakajima
キャンバス個人用アプリ 速習ガイド
キャンバス個人用アプリ 速習ガイド
Kazuki Nakajima
活躍中のアプリケーションから紐解くForcecom
活躍中のアプリケーションから紐解くForcecom
Kazuki Nakajima
Upwardのご紹介
Upwardのご紹介
Kazuki Nakajima
Salesforce1入門
Salesforce1入門
Kazuki Nakajima
Drawloop intro
Drawloop intro
Kazuki Nakajima
Mehr von Kazuki Nakajima
(20)
ビーコンBotによるニュータイプな受付
ビーコンBotによるニュータイプな受付
Apexで作成したrest apiをしっかり保護する方法
Apexで作成したrest apiをしっかり保護する方法
Waterfall cafeで働くBot
Waterfall cafeで働くBot
AIが入った栄養士Botのアーキテクチャー
AIが入った栄養士Botのアーキテクチャー
AIを組み込んだ近未来のアプリケーションで感じる新しいサービスの新しい開発手法
AIを組み込んだ近未来のアプリケーションで感じる新しいサービスの新しい開発手法
畑と会話するニュータイプなIo tアプリで加熱中の技術トレンドを鷲掴みにする45分
畑と会話するニュータイプなIo tアプリで加熱中の技術トレンドを鷲掴みにする45分
無償のAPEXワークスペース取得方法
無償のAPEXワークスペース取得方法
Oracle Cloudのjava実行環境
Oracle Cloudのjava実行環境
実はDatabase cloudだけで実現できる巷で噂の機械学習とは?
実はDatabase cloudだけで実現できる巷で噂の機械学習とは?
海外で人気沸騰中のIo tデバイスとdatabase cloudで構成するシンプルなiot構成を学ぶ
海外で人気沸騰中のIo tデバイスとdatabase cloudで構成するシンプルなiot構成を学ぶ
鳥肌必至のニューラルネットワークによる近未来の画像認識技術を体験し、IoTの知られざるパワーを知る
鳥肌必至のニューラルネットワークによる近未来の画像認識技術を体験し、IoTの知られざるパワーを知る
今さらきけない環境ハブ
今さらきけない環境ハブ
Spring'15 ISV様向け新機能紹介
Spring'15 ISV様向け新機能紹介
絶対使いたくなるAppexchangeアプリとそのアーキテクチャー
絶対使いたくなるAppexchangeアプリとそのアーキテクチャー
ビジネスアイデアを最速で形にできるApp exchange
ビジネスアイデアを最速で形にできるApp exchange
キャンバス個人用アプリ 速習ガイド
キャンバス個人用アプリ 速習ガイド
活躍中のアプリケーションから紐解くForcecom
活躍中のアプリケーションから紐解くForcecom
Upwardのご紹介
Upwardのご紹介
Salesforce1入門
Salesforce1入門
Drawloop intro
Drawloop intro
Force.com canvas入門ガイド
1.
中嶋 一樹 テクニカルエバンジェリスト @nkjm Force.com Canvas入門ガイド @nkjm
2.
Agenda • Force.com Canvasとは? •
単純なiFrameとの違い • 接続アプリケーションの作成 • 組織における接続アプリケーションのアクセス設定 • Signed Request(署名付き要求)を使った認証方法 • シングルサインオン • Force.comへのAPIコール • VisualforceへのCanvasの埋め込み • フレームのリサイズ • Canvasアプリのパッケージング • 参考情報
3.
Force.com Canvasとは? • 外部サーバーで提供されるWebアプリをForce.comの画面に組み込み、統合されたアプリとし て提供するためのフレームワーク •
画面を組み込むためにiFrameを利用。ただしフレームサイズを動的に変更するためのSDKを提 供しているため自然な画面表示が可能。 • 外部サーバーはForce.comのAPIを利用してデータベースにアクセスする。SDKがこのAPIアク セスをサポートする。 • APIの利用に必要となる認証に"Signed Request"という手法を用いてよりシンプルでセキュ アな認証を可能にしている *OAuth 2.0も選択可能 Force.com 外部アプリ iFrameSDKによる動的リサイズ
4.
単純なiFrameとの違い • 外部アプリにはセッションIDではなく認証トークンが含まれたSigned Requestを送信できる。Signed Requestは秘密
によって署名されているため途中の経路での改ざんや偽装を防止することができる。 • 認証トークンはOAuth2.0 Webフローでも取得できるが、複数回のリダイレクトが必要。Signed Request を利用すればリダイレクトが不要になる。 ! ! ! ! ! ! ! • セッションIDは常にログインユーザーのフルアクセス権限が与えられてしまうが、Signed Requestに含まれ る認証トークンでは必要な範囲に権限を限定することができる。 • Canvasアプリはどのユーザーがアクセスできるか、組織の管理者が設定可能。 Force.com 外部アプリ ①iFrameのコンテンツ要求と同時に Signed Request送信 ②APIコール アクセストークン Signed Requestのフロー Force.com 外部アプリ ①iFrameのコンテンツ要求 OAuth2.0 Webフロー ②認証サーバへのリダイレクト ③認証後アクセスコードと共に リダイレクト ④トークンの要求 ⑤トークン送信 ⑥APIコール
5.
接続アプリケーションの作成 • Canvasアプリはこの接続アプリケーションを作成した組織、またはインストールした組織で利用可能になる。 • 接続アプリケーションは開発者がこのアプリの名前、秘密
、権限範囲、外部アプリのURLや認証方式を定義す るためのもの。 • 作成手順 • ビルド > 作成 > アプリケーションで、「接続アプリケーション」のセクションで「新規」ボタンをクリック • 基本情報セクションを適当に入力 • OAuth設定セクションで「OAuth設定の有効化」にチェック => 認証方式にSigned Requestを利用する場合はOAuthの認 証フローは利用しませんが、このチェックにより生成されるConsumer Secretは依然として必要になるためチェックしま す。 • コールバックURLを「sfdc://success」と設定 => ダミーです。Signed Request方式では実際には利用されません。 • 選択したOAuth範囲を必要に応じて追加 • サポートされているアプリケーション種別セクションでForce.com Canvasにチェック • キャンバスアプリケーションのURLに外部アプリのトップURLを入力 => URLはhttpsが必要です。 • アクセス方法を署名付き要求(POST)に設定 => 後述のSigned Request方式を指定しています。 • 場所をCanvasアプリを表示させる場所に応じて設定
6.
組織における接続アプリケーションのアクセス設定 • 組織内のどのユーザーがこのCanvasアプリにアクセスできるのかを設定する。 • 設定手順 •
管理 > アプリケーションを管理する > 接続アプリケーションで作成した接続アプリを選択 • OAuthポリシーセクションの許可されているユーザーを「管理者が承認したユーザーは事前承認済み」に設定して保存 • 関連リストのプロファイルまたは権限セットで、Canvasアプリにアクセスを許可す るプロファイル/または権限セットを追加する * この設定はあくまでこの組織内で有効な設定であり、パッケージには含めることはできません。
7.
Signed Request(署名付き要求)を使った認証方法 • 外部アプリはForce.comにAPIアクセスするための認証情報(トークン)が必要だが、この認証情報を含め ユーザーに関する情報をForce.comから外部アプリに初回の1リクエストで伝送する効率的な仕組み •
Force.comから外部アプリには下記のフォーマットのデータ(Signed Request)を伴ったPOSTリクエス トが送信される。 dfj984ropjdjflsdf.09wjefokjljlsdfpjdogodjfgpsdjgdsgjlkdsjgf(以後省略) ハッシュ Canvas Request デリミター(ドット) アプリの情報、ユーザーの情報、トークンなどがJSON形式で 格納されておりそれをBase64エンコードした値 Canvas RequestをConsumer SecretをキーとしてHMAC SHA-256でハッ シュ化、さらにBase64エンコードした値 Force.com 外部アプリ ①ユーザーがCanvasアプリにアクセス ②Signed Requestを伴ったPOSTリクエスト
8.
Signed Requestを使った認証方法(続き) • 外部アプリはこのリクエストを受け取り、
Consumer Secretを用いてこのリクエストが想 定されるForce.comアプリからのものであること、改ざんがないことを検証する。 • Canvas RequestをConsumer SecretをキーとしてHMAC SHA-256でハッシュ化し、Base64エン コードをおこなう • 上記値を受信したハッシュと比較し、等しければ検証は成功。 <?php // Signed Requestを.で分割 $sr_r = explode('.', $_POST["signed_request"], 2); ! // Canvas RequestをConsumer SecretをキーにしてHMAC SHA-256でハッシュ化。さらにBase64エンコード。 $calculated_value = base64_encode(hash_hmac("sha256", $sr_r[1], YOUR_CONSUMER_SECRET, true)); ! // 算出した値と、POSTリクエストに含まれていたハッシュ値を比較して検証 if ($sr_r[0] == $calculated_value){ return true; // 合格 } else { return false; // 不合格 } ?> *サーバー側のサンプルコードはPHPを利用しています。
9.
Signed Requestを使った認証方法(続き) • 外部アプリはCanvas
RequestをBase64デコードし、APIコールに必要なトークン、インス タンスURLをはじめ必要な情報を取得することができる。 <?php // Signed Requestを.で分割 $sr_r = explode('.', $_POST["signed_request"], 2); ! // Canvas RequestをBase64デコードし、canvas_requestオブジェクトとして取得 $canvas_request = json_decode(base64_decode($sr_r[1])); ! // Javascriptから利用するためにJSON形式のままの変数を用意 $canvas_request_in_json = base64_decode($sr_r[1]); ! // APIアクセスに必要なアクセストークン、インスタンスURLは下記のように取得 $oauthToken = $canvas_request->client->oauthToken; $instanceUrl = $canvas_request->client->instanceUrl; ?>
10.
Signed Requestを使った認証方法(続き) • Signed
Requestが送信されるのはChatterタブのCanvas Appをクリックしたとき、およ びCanvasアプリが含まれるVisualforceページを表示させたときのみです。Canvasアプリ 内のリンクをクリックしたときには送信されません。後続のリクエストに備えて外部アプリは Canvas Requestを何らかの形でセッションに保存しておく必要があります。 • Safari等一部のブラウザはiFrame内からのCookieを拒絶するため、Canvas Requestの保 持にCookieが利用できないケースがあります。サーバー側で全リンクにセッションIDを自動 挿入する機能や、HTMLコンテンツ内にセッションIDを埋め込むなどのワークアラウンドを検 討してください。(例えばPHPではsession.use_trans_sidを有効にすることでCookieを 用いずにセッションの保持が可能) iFrame Cookie
11.
シングルサインオン • 外部アプリ側でもデータベース等のリソースを保持しそのアクセスに認証が必要な場 合、シングルサインオン(SSO)をおこなうことがのぞましい。 Signed Requestに含まれるトークンでアクセス可能
別途認証し、セッションを確立する必要がある Force.com 外部アプリ
12.
シングルサインオン(続き) • Signed Requestを活用すればシンプルなSSOが可能。*またはSAMLを用いたSSOも構築可能 •
あらかじめ外部アプリ側のアカウント情報にSalesforceユーザー名をマッピングしておく。*外部アプリ のユーザー名とSalesforceユーザー名が一致している場合には必要ありません。 ! ! ! ! ! ! ! ! ! • 外部アプリ側で通常どおりSigned Requestを検証する。 • Canvas Requestから抽出したSalesforceユーザー名を外部アプリ側のアカウント情報から検索。 ヒットすればそのユーザーですでに認証されていると見なしてセッションを発行する。 username password salesforce_username nakajima@mydom.com 90dfoj4BnM knakajima@sf.mydom.com yamashita@mydom.com kd8FIKJef8e tyamashita@sf.mydom.com 追加 外部アプリのアカウント情報
13.
シングルサインオン(続き) • Sample Code <?php //
Signed Requestを.で分割 $sr_r = explode('.', $_POST["signed_request"], 2); ! // Canvas RequestをConsumer SecretをキーにしてHMAC SHA-256でハッシュ化。さらにBase64エンコード。 $calculated_value = base64_encode(hash_hmac("sha256", $sr_r[1], YOUR_CONSUMER_SECRET, true)); $canvas_request = json_decode(base64_decode($sr_r[1])); ! // 算出した値と、POSTリクエストに含まれていたハッシュ値を比較して検証 if ($sr_r[0] == $calculated_value){ // ローカルデータベース(PostgreSQL)から該当するユーザーを検索 $dbconn = pg_connect(YOUR_CONNECTION_STRING); $query = "select * from users where salesforce_username = '" . $canvas_request->context->user->userName . "'"; $result = pg_query($query); $result_all = pg_fetch_all($result); if (isset($result_all[0]["username"])){ // SSO成功 session_start(); $_SESSION["username"] = $result_all[0]["username"]; $_SESSION["canvas_request"] = $canvas_request; return true; } else { // Signed Requestの検証は成功しているが、SSOは失敗 return false; } } else { return false; // 不合格 } ?>
14.
Force.comへのAPIコール • Force.comへはクライアント側(Javascript)、サーバ側、双方からAPIコール可能。 • クライアント側についてはクロスドメインアクセスとなるが、SDKを利用することでアクセス可 能となる。 Force.com
外部アプリ クライアント側(Javascript)からのAPIコール(SDKがサポート) *Javascriptは外部アプリからロードしたものなのでForce.comにアクセスす るとクロスドメインアクセス(通常ブラウザによりブロックされる)になるが、 SDKに含まれるProxy機能がこれを可能にしている。 サーバー側からのAPIコール Canvas Requestから取得し たアクセストークン サーバーから間接的に受け 取ったアクセストークン
15.
Force.comへのAPIコール(続き) • Force.com Canvas
SDKをインポート <script src="<?php echo $sr->canvas_request->client->instanceUrl;?>/canvas/sdk/js/<?php echo $sr->canvas_request->context->environment->version->api; ?>/canvas-all.js"></script> <script type="text/javascript"> var canvas_request = JSON.parse('<?php echo $canvas_request_in_json; ?>'); var url = '/services/data/v' + canvas_request.context.environment.version.api + '/query? q=SELECT+ID,NAME+FROM+ACCOUNT'; Sfdc.canvas.client.ajax( url, { client: canvas_request.client, method: 'GET', contentType: 'application/json', success: function(data){ if (data.status === 200){ console.log(data.payload.records); } else { console.log(data.statusText); } } } ); </script> • APIコール(取引先データ取得)
16.
Force.comへのAPIコール(続き) <script type="text/javascript"> var canvas_request
= JSON.parse('<?php echo $canvas_request_in_json; ?>'); var body = {Name: "Test Account"}; var url = '/services/data/v' + canvas_request.context.environment.version.api + '/sobjects/ Account'; Sfdc.canvas.client.ajax( url, { client: canvas_request.client, method: 'POST', contentType: 'application/json', data: JSON.stringify(body), success: function(data){ if (data.status === 201){ console.log('SUCCESS'); } else { console.log(data.statusText); } } } ); </script> • APIコール(取引先データ作成)
17.
Force.comへのAPIコール(続き) <script type="text/javascript"> var canvas_request
= JSON.parse('<?php echo $canvas_request_in_json; ?>'); var body = {Name: "Test Account"}; var record_id = ''; // 更新する取引先のレコードIDをセット var url = '/services/data/v' + canvas_request.context.environment.version.api + '/sobjects/ Account/' + record_id; Sfdc.canvas.client.ajax( url, { client: canvas_request.client, method: 'PATCH', contentType: 'application/json', data: JSON.stringify(body), success: function(data){ if (data.status === 204){ console.log('SUCCESS'); } else { console.log(data.statusText); } } } ); </script> • APIコール(取引先データ更新)
18.
Force.comへのAPIコール(続き) <script type="text/javascript"> var canvas_request
= JSON.parse('<?php echo $canvas_request_in_json; ?>'); var body = {Name: "Test Account"}; var record_id = ''; // 削除する取引先のレコードIDをセット var url = '/services/data/v' + canvas_request.context.environment.version.api + '/sobjects/ Account/' + record_id; Sfdc.canvas.client.ajax( url, { client: canvas_request.client, method: 'DELETE', contentType: 'application/json', data: JSON.stringify(body), success: function(data){ if (data.status === 204){ console.log('SUCCESS'); } else { console.log(data.statusText); } } } ); </script> • APIコール(取引先データ削除)
19.
Visualforceへの埋め込み • Canvasアプリの表示場所はChatterタブ、またはVisualforceページ • VisualforceページではCanvas用のタグを用いて全体あるいは一部にCanvasアプ リを配置可能 *
VisualforceはAPIバージョン27.0以上が必要です。 * パッケージとして配布する場合、必ずnamespacePrefix属性とdeveloperName属性を指定してください。 * applicationName属性も同時に指定した方が表示が若干速くなります。 * parameters属性で指定した値はcanvas_request->context->environment->parametersで取得できま す。 * apex:canvasAppの完全な属性リストはVisualforce開発者ガイドの標準コンポーネントを参照ください。 // デフォルトでheightは900px、widthは800pxになります <apex:canvasApp namespacePrefix="myprefix" applicaitonName="My App" developerName="myapp" /> ! // parametersで任意の値をCanvas Requestに含めることができます。 <apex:canvasApp namespacePrefix="myprefix" applicaitonName="My App" developerName="myapp" parameters="{p1:'value1',p2:'value2'}" />
20.
フレームのリサイズ • iFrameはHTMLの仕様上サイズを静的に指定する必要があり、動的なコンテンツを表示させた 場合スクロールバーが多重に表示される、またはコンテンツが途中で切れるといった現象が発 生しユーザービリティを損なう。 • SDKのautogrow(),
resize()メソッドを利用することで、コンテンツに応じてフレームサイ ズを動的に変更し、上記の問題を解消できる。 height=400px width=750pxとしたCanvasアプリの出力結果 自動リサイズ無効 自動リサイズ有効
21.
フレームのリサイズ(続き) Sfdc.canvas(function(){ sr = JSON.parse('<?php
echo $canvas_request_in_json; ?>'); ! // フレームを縦横ともにコンテンツに応じて自動でリサイズする。デフォルトでは300msごとにコンテンツサイズの検出 がおこなわれる。 Sfdc.canvas.client.autogrow(sr.client); ! // 検出間隔を100msにセットして自動リサイズ Sfdc.canvas.client.autogrow(sr.client, true, 100); ! // 検出と自動リサイズを無効にする Sfdc.canvas.client.autogrow(sr.client, false); }); * HTMLでフレームサイズをheight, widthで指定しても自動リサイズ機能はフレームサイズを動的に変更しますが、maxHeight, maxWidthで指定したフレームサイズを超えることはありません。
22.
Canvasアプリのパッケージング • 管理パッケージに接続アプリケーションを含めることでCanvasアプリが配布可能になる • ユーザー組織では接続アプリケーションのアクセス設定をおこなう必要がある •
接続アプリケーションの定義を変更した場合は、パッケージを転送アップグレードすることで 即座にユーザー環境に変更を反映可能 *アプリケーションパートナーのみ 組織A 組織B 組織C開発組織 (Developer Edition) 管理パッケージ 接続アプリケーション ユーザー組織 インストール
23.
参考情報 • Force.com Canvas
SDK開発者ガイド • http://developerforcejp.s3.amazonaws.com/developer/docs/platform_connect/ canvas_framework.pdf • DeveloperforceのCanvasまとめサイト • http://wiki.developerforce.com/page/Force.com_Canvas • Force.com Canvas SDKのリファレンス • http://htmlpreview.github.io/?https://raw.github.com/forcedotcom/ SalesforceCanvasJavascriptSDK/master/docs/index.html • Force.com Canvas Toolkit for PHP(サーバー側でのSigned Requestの取 り扱いをまとめたツールキット。Herokuでも利用可能) • https://github.com/nkjm/Force.com-Canvas-Toolkit-for-PHP
24.
Force.com アプリケーションPaaS 開発者 製品 appexchange ビジネスアプリのマーケットプレイス ユーザー 出品 フィードバック 開発 i
appexchange開発者向けに用意された無償トレーニングで開発と公開のノウハウを学べます。 appexchangeであれば全国のお客様にビジネスアプリを販売できますGetting Started!
Jetzt herunterladen