英語で読む

次の方法で共有

Microsoft Graph を使用して Bot フレームワークのボットを作成する

Microsoft Graph を使用してユーザーの詳細を取得する

このセクションでは、Microsoft Graph SDK を使用して、ログインしているユーザーを取得します。

サービスのGraphする

まず、ボットが Microsoft Graph SDK から GraphServiceClient を取得するために使用できるサービスを実装し、そのサービスを依存関係の挿入によってボットで利用できます。

  1. プロジェクトのルートに新しいディレクトリを作成します。Graph。 IGraphClientService.cs という名前の ./Graph ディレクトリに新しいファイルを作成し、次のコードを追加します。

    using Microsoft.Graph;
    
    namespace CalendarBot.Graph
    {
        public interface IGraphClientService
        {
            GraphServiceClient GetAuthenticatedGraphClient(string accessToken);
        }
    }
    
  2. GraphClientService.cs という 名前の ./Graph ディレクトリに新しいファイルを作成し、次のコードを追加します。

    using Microsoft.Graph;
    using System.Net.Http.Headers;
    using System.Threading.Tasks;
    
    namespace CalendarBot.Graph
    {
        public class GraphClientService : IGraphClientService
        {
            public GraphServiceClient GetAuthenticatedGraphClient(string accessToken)
            {
                return new GraphServiceClient(new DelegateAuthenticationProvider(
                    async (request) => {
                        // Add the access token to the Authorization header
                        // on the outgoing request
                        request.Headers.Authorization =
                            new AuthenticationHeaderValue("Bearer", accessToken);
                        await Task.CompletedTask;
                    }
                ));
            }
        }
    }
    
  3. ./Startup.cs を 開き、ファイルのusing上部に次のステートメントを追加します。

    using CalendarBot.Graph;
    
  4. 次の関数を ConfigureServices 関数の最後に追加します。

    // Add the Graph client service
    services.AddSingleton<IGraphClientService, GraphClientService>();
    
  5. ./Dialogs/MainDialog.cs を開きます。 ファイルの上部 using に次のステートメントを追加します。

    using System;
    using System.IO;
    using AdaptiveCards;
    using CalendarBot.Graph;
    using Microsoft.Graph;
    
  6. MainDialog クラスに次 のプロパティを追加 します。

    private readonly IGraphClientService _graphClientService;
    
  7. MainDialog クラスのコンストラクターを見つけて、署名を更新して IGraphServiceClient パラメーターを取得 します。

    public MainDialog(
        IConfiguration configuration,
        ILogger<MainDialog> logger,
        IGraphClientService graphClientService)
        : base(nameof(MainDialog), configuration["ConnectionName"])
    
  8. コンストラクターに次のコードを追加します。

    _graphClientService = graphClientService;
    

ログオンしているユーザーを取得する

このセクションでは、Microsoft Graphを使用して、ユーザーの名前、電子メール アドレス、および写真を取得します。 次に、情報を表示するアダプティブ カードを作成します。

  1. CardHelper.cs という名前のプロジェクトのルートに新しいファイルを作成します。 次のコードをファイルに追加します。

    using AdaptiveCards;
    using Microsoft.Graph;
    using System;
    using System.IO;
    
    namespace CalendarBot
    {
        public class CardHelper
        {
            public static AdaptiveCard GetUserCard(User user, Stream photo)
            {
              // Create an Adaptive Card to display the user
                // See https://adaptivecards.io/designer/ for possibilities
                var userCard = new AdaptiveCard("1.2");
    
                var columns = new AdaptiveColumnSet();
                userCard.Body.Add(columns);
    
                var userPhotoColumn = new AdaptiveColumn { Width = AdaptiveColumnWidth.Auto };
                columns.Columns.Add(userPhotoColumn);
    
                userPhotoColumn.Items.Add(new AdaptiveImage {
                    Style = AdaptiveImageStyle.Person,
                    Size = AdaptiveImageSize.Small,
                    Url = GetDataUriFromPhoto(photo)
                });
    
                var userInfoColumn = new AdaptiveColumn {Width = AdaptiveColumnWidth.Stretch };
                columns.Columns.Add(userInfoColumn);
    
                userInfoColumn.Items.Add(new AdaptiveTextBlock {
                    Weight = AdaptiveTextWeight.Bolder,
                    Wrap = true,
                    Text = user.DisplayName
                });
    
                userInfoColumn.Items.Add(new AdaptiveTextBlock {
                    Spacing = AdaptiveSpacing.None,
                    IsSubtle = true,
                    Wrap = true,
                    Text = user.Mail ?? user.UserPrincipalName
                });
    
                return userCard;
            }
    
            private static Uri GetDataUriFromPhoto(Stream photo)
            {
                // Copy to a MemoryStream to get access to bytes
                var photoStream = new MemoryStream();
                photo.CopyTo(photoStream);
    
                var photoBytes = photoStream.ToArray();
    
                return new Uri($"data:image/png;base64,{Convert.ToBase64String(photoBytes)}");
            }
        }
    }
    

    このコードでは、AdaptiveCard NuGet を使用してアダプティブ カードを作成し、ユーザーを表示します。

  2. MainDialog クラスに次 の関数を追加 します。

    private async Task DisplayLoggedInUser(
        string accessToken,
        WaterfallStepContext stepContext,
        CancellationToken cancellationToken)
    {
        var graphClient = _graphClientService
            .GetAuthenticatedGraphClient(accessToken);
    
        // Get the user
        // GET /me?$select=displayName,mail,userPrincipalName
        var user = await graphClient.Me
            .Request()
            .Select(u => new {
                u.DisplayName,
                u.Mail,
                u.UserPrincipalName
            })
            .GetAsync();
    
        // Get the user's photo
        // GET /me/photos/48x48/$value
        var userPhoto = await graphClient.Me
            .Photos["48x48"]
            .Content
            .Request()
            .GetAsync();
    
        // Generate an Adaptive Card
        var userCard = CardHelper.GetUserCard(user, userPhoto);
    
        // Create an attachment message to send the card
        var userMessage = MessageFactory.Attachment(
            new Microsoft.Bot.Schema.Attachment {
                ContentType = AdaptiveCard.ContentType,
                Content = userCard
            });
    
        await stepContext.Context.SendActivityAsync(userMessage, cancellationToken);
    }
    

    このコードの動作を検討します。

    • graphClient を使用して、ログインしているユーザーを取得します
      • このメソッドを使用 Select して、返されるフィールドを制限します。
    • graphClient を使用してユーザーの写真を取得し、サポートされている最小サイズの 48x48 ピクセルを要求します。
    • CardHelper クラスを使用して アダプティブ カードを作成し、カードを添付ファイルとして送信します。
  3. ブロック内のコードを次 else if (command.StartsWith("show me")) のコードに ProcessStepAsync 置き換えます。

    else if (command.StartsWith("show me"))
    {
        await DisplayLoggedInUser(tokenResponse.Token, stepContext, cancellationToken);
    }
    
  4. すべての変更を保存し、ボットを再起動します。

  5. ボットにBot Framework Emulatorログインするには、次の情報を使用します。 [表示 ] ボタンを 選択して、ログオンしているユーザーを表示します。

    ユーザーを示すアダプティブ カードのスクリーンショット