検索
Close
カテゴリー内の他の記事

Zoom API を使って、Zoomミーティングを kintone で管理しよう

作成日
更新日

Index

はじめに

使い方がシンプル & 無料でも利用できるWeb会議システム「Zoom」、
最近の仕事やプライベートで活用されている方はたくさんいらっしゃると思います。

しかし、オンラインミーティングが増えるにつれ、日程の管理が大変..!!と悩んでいる方も実は多いのではないでしょうか。
そんなとき、会議の日程を管理したり、会議の前にリマインダーを設定できる kintone と連携できたら便利かと思います。

この記事では「Zoom API」を利用して、ミーティング日程の管理などを実現する、
Zoom と kintone の連携カスタマイズをご紹介したいと思います。

完成イメージ

今回のカスタマイズは、「会議日程管理」という kintone アプリと「kintone2Zoom」というプラグインを利用します。
「会議日程管理」アプリに「kintone2Zoom」プラグインをインストールすることで、
Zoomミーティングの作成 / 削除などの操作を kintone アプリからできるようになります。

architecture.png

できること

  • 会議日程の管理
    • 「会議日程管理」アプリからレコードを登録 / 削除することで、Zoomミーティングを作成 / 削除することができます。
    • 登録されたミーティングの日程を、カレンダー形式の一覧画面で管理できます。
      image_calender-view.png
  • 会議の集計
    • 毎月の会議を集計し、グラフにすることができます。
      image_graph.png
  • 会議の日程のリマインド
    • kintone のリマインダー機能を利用することで、「会議の○○時間前」にリマインダーを設定することができます。
      詳細の設定手順は、kintone ヘルプ- リマインダーの設定をご参照ください。
      image_reminder.png

使い方

ミーティングを登録 / 削除する

ミーティングの登録は、次の手順で行います。

  1. kintone の「会議日程管理」アプリに、レコードを新規追加します。
  2. 「会議名」「開始時間」「会議時間」などの関連情報を入力します。
    image_create.png
  3. レコードを保存します。
    保存されたレコードの「ZoomInfo」グループに、登録された Zoomミーティングの情報が表示されます。
    image_meetingInfo.png
    Zoom の「ミーティング」画面（ログインが必要）からも、登録された予定を確認できます。
    image_zoomMeeting.png

ミーティングを削除したい場合は、
kintone のレコードを削除すれば、該当ミーティングも Zoom から自動的に削除されます。

登録したミーティングに参加する

  1. 「会議日程管理」アプリから、開始したい会議のレコードの詳細画面を開き、
    「ZoomInfo」にある「会議リンク」をからミーティングに参加します。
    image_link.png

利用上の注意事項

  • レコード保存後に内容を編集した場合、編集された内容は Zoom に反映されません。
    会議時間などの情報を変更したい場合は、レコードを削除してもう一度登録し直してください。
  • Zoom の無料版に対応したカスタマイズのため、複数のミーティングを同時に行うことはできません。

環境の準備

  1. Zoom の準備
    1. 必要な認証情報の準備
  2. kintone の準備
    1. アプリの作成
    2. プラグインのパッケージング

Zoom の準備

Zoom の準備で必要な作業は、Zoom の Developer Account から JWTアプリを作成し、
認証用の Token を取得することです。

JWTアプリの作成

  1. Zoom App Marketplace ページにアクセスし、
    右上にある「Develop」プルダウンから「Build App」を選択します。
  2. Developer Account のサインイン画面が表示されたら、ログインをします。
    （初めての方は「サインアップ」して進めてください）
  3. 「Choose your app type」画面から、JWT の「Create」をクリックします。
    prerequisites_JWT-create.png
  4. 画面の指示に従って「App Name」「Basic Information」などの情報を入力し、
    「Continue」ボタンをクリックします。

JWT Token の確認

  1. 作成した JWTアプリの「App Credentials」画面に表示された「JWT Token」 を、利用する期間を設定した上で、控えておきます。
    prerequisites_JWT-Token.png

kintone の準備

kintone の準備で必要な作業は「会議日程管理」というアプリの作成と、
「kintone2Zoom」というプラグインのパッケージングをすることです。

  • 「会議日程管理」アプリ

「はじめから作成」からアプリを新規作成し、下記のフィールドをアプリに追加してください。

フィールドの種類 フィールドコード  備考
文字列（1行） topic 会議の「会議名」を入力します。
日時 start_time 会議の「開始時間」情報を入力します。
数値 duration 会議の「会議時間」情報を入力します。
ユーザー選択 participants 会議の「参加者」情報を入力します。
グループ ZoomInfo 会議の「会議番号」「会議パスワード」「会議リンク」を入れるグループです。
文字列（１行） meetingNumber 会議の「会議番号」情報が自動入力されます。
文字列（１行） password 会議の「会議パスワード」情報が自動入力されます。
文字列（１行） join_url 会議の「会議リンク」情報が自動入力されます。
  • 「kintone2Zoom」プラグイン

「サンプルコード」部分の手順に沿ってサンプルプログラムをパッケージングした上で、kintone にインストールしてください。
※プラグインをインストール手順の詳細は、kintone ヘルプ - アプリにプラグインを追加する をご参照ください。
利用する前には、事前に用意した Token をプラグインに入力し、保存してください。

prerequisites_plugin_kintone2Zoom.png

サンプルコード

サンプルコードは、GitHub に公開されています。

https://github.com/kintone-samples/sample-kintone-to-zoom

こちらの手順を参考に、「kintone2zoom-plugin」フォルダ内にある「plugin」ファイルをパッケージングしてください。

「kintone2zoom-plugin」の「src」フォルダ内にビルド前のファイルがあります。
ソースコードに変更を加えたい方はそちらのファイルを編集し、ビルドをした上でパッケージング作業を行ってください。
ビルド作業の仕方については「webpack入門 ~Babel,Polyfillを使って快適ES6ライフ~」記事をご参照ください。

カスタマイズのポイント

今回のカスタマイズのポイント、レコード登録 / 削除をするタイミングで Zoomミーティングを生成 / 削除する処理は、
「kintone2Zoom」プラグインで実装されている「index.js」「zoomApi.js」で行われています。
詳細は下記をご確認ください。

index.js

zoomApi.js

注意事項

  • 本カスタマイズについて、プラグインファイル（zipファイル）の公開予定はありません。
    プラグインとして利用してみたい方は、サンプルコード を確認しパッケージングを行ってください。
  • 本カスタマイズは、Zoomの無料版を対象としています。

おわりに

今回の記事は、Zoom API を使った Zoom と kintone の連携カスタマイズを紹介しました。
Zoom が提供している「Zoom Web SDK」を利用することで、
Zoomミーティングの画面を直接 kintone アプリに表示させるなどの機能も実現できるので、興味ある方はぜひ試してみてください。

他にも、kintone から音声通話を実現する「Twilioを使ってkintoneから直接電話をかけてみよう」などの記事も、
cybozu developer network で紹介していますので、気になる方はぜひ確認してみてください。

この記事で利用しているライブラリ

本Tipsは、2020年11月版 kintoneで確認したものになります。

 

記事に関するフィードバック

記事のコメント欄は記事に対するフィードバックをする場となっております。
右の記事フィードバックのためのガイドを参照してコメントしてください。
記事のリンク切れなど、気になる点がある場合も、こちらのフォームからフィードバックいただけますと幸いです。

Avatar
Hiroki Sano

この記事に記載されている「会議日程管理アプリ」はどこで入手可能でしょうか？kintone アプリストアで見つかりませんでしたので・・・・。

2020/12/23追記：

アプリは自分で作成するんですね。無事、Zoom連携できました。（ゲストスペースです）

 

Hiroki Sanoにより編集されました
Avatar
cybozu Development team

Hiroki Sano 様

お世話になっております。cybozu developer network 運営でございます。
返事が遅くなりまして大変申し訳ございませんもうでした。

無事に解決できてよかったです。
引き続きよろしくお願いいたします。

 

Avatar
katsuya

githubのテンプレートで各自のカスタマイズが必要な個所はどちらになりますでしょうか。

Avatar
cybozu Development team

katsuya 様

お世話になっております。
cybozu developer network 事務局です。

kintone 側の処理は「index.js」に、Zoom の API を用いた処理は「zoomApi.js」に記載されておりますのでご確認ください。

また、本コメント欄は、記事へのフィードバックを目的としておりますので、

具体的なカスタマイズ方法や技術的な質問につきましては、cybozu developer コミュニティをご活用ください。
よろしくお願いいたします。

Avatar
廣野光夫

素晴らしい記事ありがとうございます。

この記事の通りにやってみました。

zoomのミーティングURL、ミーティングIDはアプリに入りますが、どうしてもパスワードがアプリに入りません。

Zoom側を見るとパスワードがないミーティングが生成されていました。

ということは、ミーティング生成時のオプションにパスワード生成するオプションを入れなければならない、ということでしょうか（推察するに、index.jsの28行目から34行目の中にパスワードを設定するオプションを入れれば解決するような気もします）。

初心者ですみません。もしおわかりになれば…。

 

廣野光夫により編集されました
Avatar
cybozu Development team

廣野光夫 様

お世話になっております。
cybozu developer network 事務局です。

「会議パスワード」フィールドは、Zoomのアカウント設定でミーティング登録時のパスワード生成がオンの状態を想定しています。Zoomアカウントの設定をご確認ください。

また、本コメント欄は、記事へのフィードバックを目的としておりますので、

具体的なカスタマイズ方法や技術的な質問につきましては、cybozu developer コミュニティをご活用ください。
よろしくお願いいたします。

サインインしてコメントを残してください。