View
1
Download
0
Category
Preview:
Citation preview
de:code 2019 PR03
これでできる！
Microsoft Teams アプリ開発の
ポイント徹底解説日本マイクロソフト株式会社
パートナー事業本部 テクニカルエバンジェリスト
物江 修
さまざまな Teams のセッションをご用意しています
PR08
速習! Microsoft Teams ～最新情報を一気にキャッチ アップ～
PR04
これからはじめる!
やさしい Microsoft
Teams アプリ開発の
基本
PR03
これでできる!
Microsoft Teams
アプリ開発のポイント
徹底解説
本セッションはこちら
このセッションの目的
• Teams アプリケーションの概念の理解(おさらい)
• アプリ開発を開始するための具体的な方法
• Teams が提供する代表的なリソースの利用方法
Microsoft Teams アプリケーションの開発について
対象者 : コーディングスキルを持ったプログラマー
アジェンダ
1. Microsoft Teams での開発
2. アプリケーションの実装
3. アプリの配布
Microsoft Teams での開発
Microsoft Teams
Microsoft 365 における
チームワークのハブ
コミュニケーション
コラボレーション
さまざまなツールとの連携
安心・安全
タブ
Microsoft Teams が提供する拡張可能なプラットフォーム
アプリの配布と管理
ボット
音声と
ビデオ
メッセージ
拡張
Microsoft Graph
アダプティブ
カード
通知
アプリをビルドチャット、チャネル、個人のワークスペース
Bot Framework
Microsoft Teams SDK
Microsoft Teams
API
Microsoft Teams の開発
ボットメッセージ
拡張/アクションタスクモジュール
Web
Microsoft
Graph
APIs
Web アプリかボットをマッシュアップ + Teams 固有の機能
タブ
Microsoft Teams の SDK と API
.NET
JS
Teams Bot Builder SDK
• Microsoft
Teams JavaScript
client SDK
• C#/.NET (v3)
• C#/.NET - Beta (v4)
• Node.js (v3)
• Node.js - Beta (v4)
Microsoft Graph
{ REST }
• Microsoft
Teams API v1.0
• Microsoft
Teams API - Beta
Teams のタブから使用 ボットを Teams 固有の機能で拡張 Teams にコードからアクセス
アプリの定義
•アプリ マニフェストを
作成
•機能を指定
1
機能の実装
•Web やサービス
アプリケーションを
ホスティング
•ボット、タブなどを
実装
• Teams SDK を
利用
2
アプリのテスト
•アプリ パッケージを
作成
• Teams に
サイド ロード
3
アプリの配布
•パッケージを
アップロード
•組織のユーザーの
アプリを有効化
4
Teams におけるアプリ開発のワークフロー
開発の準備 1/2
開発用 Office 365 サブスクリプションの準備
https://developer.microsoft.com/ja-JP/office/dev-program
開発の準備 2/2
Microsoft 365 管理センターで外部アプリのサイドローディングを有効化
Teams アプリケーションの実装
アプリの定義 : アプリマニフェストの記述
manifest.json に JSON でアプリケーションの機能を定義
アプリの定義
App Studio を使用したアプリマニフェストの編集
• アプリ プロジェクトの作成と保存
• manifest.json の編集
• カードのコードのプレビューと生成
• 1 クリック サイド ロード
• ボット認証情報と設定管理を完全に統合
GUI ツールでアプリマニフェストを作成
タブ
• Teams JavaScript client SDK で
Teams の情報にアクセス可能
• 静的タブと構成可能タブ
• 個々のユーザーをサポート (静的)
• チャネルの一部として動作 (構成可能)
Web サイト/アプリをマッシュアップ
Teams JavaScript client SDK の使用
//DOM がロードされたらdocument.addEventListener('DOMContentLoaded', () => {
//Microsoft Teams のユーザーコンテキストを取得microsoftTeams.getContext((context) => {
$id('showUpn').innerText = context.upn; $id('showUoid').innerText = context.userObjectId;$id('showTheme').innerText = context.theme;$id('showLocale').innerText = context.locale;
});
タブ内の JavaScript でユーザー情報を取得
デモ : タブとTeams JavaScript client SDK
ボット
• コマンド
• アクション可能なメッセージ
Microsoft Bot Framework に登録されたボットに接続
Teams へのボットの登録
アプリマニフェストに登録する情報
• App パスワード
App Studio から直接ボットの登録を行える
ボットプロジェクトの作成
New Visual Studio template
MSBOT/npm コマンド
Teams 開発におけるボットサービスのホスト
開発の段階に合わせてホストする方法を変える
デモ : ボット作成と Teams での公開
Bot Builder SDK の Teams 拡張
ボットを Teams 固有の機能で拡張
メッセージ拡張
メッセージアクション
タスクモジュール (※)
Microsoft
Teams SDK
(※) ボット/タブ内から使用
メッセージ拡張の構成
Bot Builder SDK
Teams 拡張
JSON
アダプティブカード/
タスクモジュール等
"composeExtensions": [{"botId": "92f1101b-3b54-46af-98e9-c542a30a8d77","commands": [{"id": "queryCards","description": "Test command to run query","title": "Query cards","parameters": [{"name": "queryText","title": "Query parameter","description": "Query parameter"
}]
},{"id": "createCard","type": "action","description": "Test command to run action to create a card","title": "Create cards","fetchTask": true,
メッセージ拡張の UI 定義
←メッセージ拡張
←① ←①
←②
←②
←③
←③
メッセージ拡張
メッセージ作成時にボットの機能を呼び出す
• 投稿時にアプリ コンテンツをクエリしたり、会話に挿入
• コマンドボックスからも利用可能
メッセージ アクション New!
投稿済メッセージの内容を取得してアクション
• [その他のオプション] から起動
• JSON 形式で投稿内容を取得
デモ : メッセージ拡張とメッセージアクション
• 共通かつ一貫した方法でUI コンテンツを交換できるオープンなカード交換形式(https://adaptivecards.io)
• Web、デスクトップ、モバイルでの完全サポート
• iOS および Android の UI に対
• 迅速な対話とタスク完了
アダプティブ カード
機能豊富で柔軟性の高い対話式カードでボット エクスペリエンスを向上
デモ : アダプティブカード
コネクタ
他のサービスの更新をチャネルに配信
デモ : カスタムコネクタの作成
ボット
メッセージ拡張
タブ
コネクタ
アダプティブ カード
タスク モジュール
自然言語コマンドによる会話
構造化 UI ベースの
ボット コマンド呼び出し
コンテンツの完全埋め込み
エクスペリエンスの実現
チャネルへの通知送信のための
シンプルな着信 Web フック統合
対話コンテンツの機能豊富で
柔軟性の高いレイアウト
ユーザー入力や
レンダリング詳細情報の収集
既存の資産を以下に
接続:
• SharePoint
• Microsoft Graph
• Azure Bot Service
• Flow &
PowerApps
Teams 拡張のチートシート
Teams アプリケーションの配布
アプリの配布
A. Teams アプリ ストアによる
一般公開配布
• Microsoft 販売者ダッシュボードから
• アプリ パッケージを提出 (パートナー セ
ンターからもまもなく可能)
B. テナント アプリ カタログによる、
社内ユーザーのみを対象とした配布
• Teams 内から、または API 経由で
アップロード
アプリ配布の 2 つのオプション
Office 365 管理ポータル
きめ細かい許可管理アプリへのユーザー アクセスを管理
アプリ設定のポリシーアプリのプレインストールと
プレピン留めで組織アプリの検出と
利用を促進
開発の制御アプリの「サイド ロード」を特定の
個人に限定
アプリの管理
まとめ
多様性を活かした開発
Microsoft Teams アプリ
Teams デベロッパー センター
• Microsoft Teams の優れたアプリ、ボット、
タブのビルドを開始する
• トレーニングとチュートリアル
• 開発を迅速に進めるために用意されたリソース
Developer サポート
•アナウンスとプログラム情報
•ベスト プラクティスや最新情報を常に
入手
Teams デベロッパー ガイダンス
Microsoft Teams の計画、配信、採
用、管理の方法を学ぶ
チームの移行ガイダンスに Skype for
Business を含める
https://aka.ms/TeamsDeveloper https://aka.ms/TeamsDevSupport https://aka.ms/TeamsDevDocs
Microsoft Teams 開発のリソース
リソース次のステップ
• さぁ、はじめようMicrosoft Teams
Teamwork Solution Accelerator
• リソースとサポートへアクセスする
• FastTrack
• https://aka.ms/SuccessWithTeams
•
• https://developer.microsoft.com/ja-
JP/office/dev-program
•
• https://github.com/OfficeDev/BotBuilder-
MicrosoftTeams-node
https://aka.ms/TeamworkSolutionAccelerator
aka.ms/TeamworkAssessment
https://aka.ms/TeamsDeveloper
https://aka.ms/TeamsDevSupport
https://aka.ms/TeamsDevDocs
© 2018 Microsoft Corporation. All rights reserved.
本情報の内容（添付文書、リンク先などを含む）は、作成日時点でのものであり、予告なく変更される場合があります。
© 2019 Microsoft Corporation. All rights reserved.
本情報の内容 (添付文書、リンク先などを含む) は、de:code 2019 開催日 (2019年5月29~30日) 時点のものであり、予告なく変更される場合があります。
本コンテンツの著作権、および本コンテンツ中に出てくる商標権、団体名、ロゴ、製品、サービスなどはそれぞれ、各権利保有者に帰属します。
Recommended