削除ページを作成する

  • [アーティクル]

アプリで削除と変更のオプションをサポートすることで、ユーザー エクスペリエンスを拡張および強化できます。 Teams を使用すると、ユーザーはチャネルまたはグループ タブの名前を変更または削除でき、インストール後にユーザーがタブを再構成できるようになります。 さらに、タブの削除エクスペリエンスを使用すると、コンテンツを削除またはアーカイブするための削除後オプションがユーザーに提供されます。

注:

このトピックでは、Microsoft Teams JavaScript クライアント ライブラリ (TeamsJS) のバージョン 2.0.x を反映しています。 以前のバージョンを使用している場合は、 最新の TeamsJS と以前のバージョンの違いに関するガイダンスについては、TeamsJS ライブラリの概要を参照してください。

インストール後にタブを再構成できるようにする

タブ manifest.json の機能を定義します。 tab インスタンス canUpdateConfiguration プロパティは、作成後にユーザーがタブを変更または再構成できるかどうかを示すブール値を受け取ります。 次の表に、プロパティの詳細を示します。

名前 型 最大サイズ 必須 説明
canUpdateConfiguration ブール型 タブの構成のインスタンスを作成後にユーザーが更新できるかどうかを示す値。 既定値は true です。

タブがチャネルまたはグループ チャットにアップロードされると、Teams によってタブの右クリック ドロップダウン メニューが追加されます。使用可能なオプションは、設定によって canUpdateConfiguration 決まります。 次の表に、設定の詳細を示します。

canUpdateConfiguration true false 説明
Settings √ ページは configurationUrl iFrame に再読み込みされ、ユーザーはタブを再構成できます。
名前の変更 √ √ ユーザーは、タブ バーに表示されるタブ名を変更できます。
削除 √ √ removeURLプロパティと値が構成ページに含まれている場合、削除ページは iFrame に読み込まれ、ユーザーに表示されます。 削除ページが含まれていない場合、ユーザーに確認ダイアログ ボックスが表示されます。

アプリケーションのタブ削除ページを作成する

オプションの削除ページはホストする HTML ページであり、タブが削除されると表示されます。 削除ページ URL は、構成ページ内の setConfig() メソッド (または setSettings() TeamsJS v.2.0.0 より前) によって指定されます。 アプリ内のすべてのページと同様に、削除ページは Teams タブの前提条件に準拠している必要があります。

削除ハンドラーを登録する

必要に応じて、削除ページ ロジック内で、ユーザーが既存のタブ構成を registerOnRemoveHandler((RemoveEvent) => {} 削除するときにイベント ハンドラーを呼び出すことができます。 メソッドはインターフェイスを RemoveEvent 受け取り、ユーザーがコンテンツを削除しようとしたときにハンドラーでコードを実行します。 メソッドは、タブ コンテンツに基づくリソースの削除などのクリーンアップ操作を実行するために使用されます。 一度に登録できる削除ハンドラーは 1 つだけです。

インターフェイスでは RemoveEvent 、次の 2 つのメソッドを持つオブジェクトについて説明します。

  • 関数が notifySuccess() 必要です。 基になるリソースの削除が成功し、そのコンテンツを削除できることを示します。

  • 関数は notifyFailure(string) 省略可能です。 基になるリソースの削除に失敗し、そのコンテンツを削除できないことを示します。 省略可能な文字列パラメーターは、エラーの理由を指定します。 指定した場合、この文字列はユーザーに表示されます。それ以外の場合は、一般的なエラーが表示されます。

関数を使用するgetConfig()

(以前getSettings()の) を使用getConfig()して、削除するタブ コンテンツを割り当てることができます。 関数は getConfig() 、Config オブジェクトで解決される promise を返し、取得できる有効な設定プロパティ値を提供します。

関数を使用するgetContext()

を使用 getContext() して、フレームが実行されている現在のコンテキストを取得できます。 関数は getContext() 、Context オブジェクトで解決される promise を返します。 Context オブジェクトは、削除ページ ロジックで使用できる有効な Context プロパティ値を提供し、削除ページに表示するコンテンツを決定します。

認証を含める

ユーザーがタブ コンテンツを削除できるようにする前に、認証が必要です。 コンテキスト情報は、認証要求と承認ページ URL の構築に役立ちます。 タブについては、「 Microsoft Teams 認証フロー」を参照してください。 タブ ページで使用されているすべてのドメインが、アプリ マニフェストの配列に validDomains 一覧表示されていることを確認します。

次の例は、タブ削除コード ブロックの例です。

<body>
  <button onclick="onClick()">Delete this tab and all underlying data?</button>
  <script>
    await microsoftTeams.app.initialize();
    pages.config.registerOnRemoveHandler((removeEvent) => {
      // Here you can designate the tab content to be removed and/or archived.
        const configPromise = pages.getConfig();
        configPromise.
            then((configuration) => {
                configuration.contentUrl = "...";
                removeEvent.notifySuccess()}).
            catch((error) => {removeEvent.notifyFailure("failure message")});
    });

    const onClick() => {
        pages.config.setValidityState(true);
    }
  </script>
</body>

ユーザーがタブのドロップダウン メニューから [削除] を選択すると、Teams は構成ページで割り当てられたオプションremoveUrlのページを iFrame に読み込みます。 ユーザーには、呼び出すpages.config.setValidityState(true)関数がonClick()読み込まれたボタンが表示され、削除ページ iFrame の下部に表示される [削除] ボタンが有効になります。

削除ハンドラーが実行された後、 removeEvent.notifySuccess() または removeEvent.notifyFailure() コンテンツの削除結果を Teams に通知します。

注:

  • 承認されたユーザーによるタブの制御が禁止されないようにするために、Teams は成功と失敗の両方のケースでタブを削除します。
  • イベント ハンドラーを呼び出した registerOnRemoveHandler 後、15 秒以内に メソッドに応答します。 [削除] ボタンを有効にし、remove ハンドラーが呼び出されるためには、アプリが を呼びsetValidityState(true)出す必要があります。
  • ユーザーが [削除] を選択すると、アクションが完了したかどうかにかかわらず、30 秒後にタブが削除されます。

次の手順

モバイルのタブ

関連項目