Task Module call from Ms Teams in Bot Framework

Question

I am looking to open a task module (Pop up - iframe with audio/video) in my bot that is connected to Teams channel. I am having issues following the sample code provided on the GitHub page.

I have tried to follow the sample and incorporate to my code by did not succeed.

In my bot.cs file I am creating card action of invoke type:

card.Buttons.Add(new CardAction("invoke", TaskModuleUIConstants.YouTube.ButtonTitle, null,null,null,
                new Teams.Samples.TaskModule.Web.Models.BotFrameworkCardValue<string>()
                {
                    Data = TaskModuleUIConstants.YouTube.Id
                }));

In my BotController.cs that inherits from Controller

   [HttpPost]
        public async Task PostAsync()
        {
            // Delegate the processing of the HTTP POST to the adapter.
            // The adapter will invoke the bot.
           await _adapter.ProcessAsync(Request, Response, _bot);        

        }

        public async Task<HttpResponseMessage> Post([FromBody] Activity activity)
        {
           if (activity.Type == ActivityTypes.Invoke)
            {
                return HandleInvokeMessages(activity);
            }

            return new HttpResponseMessage(HttpStatusCode.Accepted);
        }

        private  HttpResponseMessage HandleInvokeMessages (Activity activity)
        {

            var activityValue = activity.Value.ToString();
            if (activity.Name == "task/fetch")
            {
                var action = Newtonsoft.Json.JsonConvert.DeserializeObject<Teams.Samples.TaskModule.Web.Models.BotFrameworkCardValue<string>>(activityValue);

                Teams.Samples.TaskModule.Web.Models.TaskInfo taskInfo = GetTaskInfo(action.Data);
                Teams.Samples.TaskModule.Web.Models.TaskEnvelope taskEnvelope = new Teams.Samples.TaskModule.Web.Models.TaskEnvelope
                {
                    Task = new Teams.Samples.TaskModule.Web.Models.Task()
                    {
                        Type = Teams.Samples.TaskModule.Web.Models.TaskType.Continue,
                        TaskInfo = taskInfo
                    }
                };
                return msg;
            }

            return new HttpResponseMessage(HttpStatusCode.Accepted);
        }

There is more code as per the GitHub sample but I won't paste it here. Can someone point me into the correct direction ?

I have got to the stage that it is displaying a pop up window but the content and title comes from manifest file instead of creating actual iframe also no video is rendering. My goal is to render video within my teams using iframe container.

Answer 1

The important part from the sample:

This sample is deployed on Microsoft Azure and you can try it yourself by uploading Task Module CSharp.zip to one of your teams and/or as a personal app. (Sideloading must be enabled for your tenant; see step 6 here.) The app is running on the free Azure tier, so it may take a while to load if you haven't used it recently and it goes back to sleep quickly if it's not being used, but once it's loaded it's pretty snappy.

So,

1. Your Teams Admin MUST enable sideloading
2. Your bot MUST be sideloaded into Teams

The easiest way to do this would be download the sample manifest, open it in App Studio, then edit your bot information in. You then need to make sure Domains and permissions > Valid Domains are set for your bot. Also ensure you change the Tabs URLs to your own.

You also need to make sure that in your Tasks, the URLs they call ALL use https and not http. If anywhere in the chain is using http (like if you're using ngrok and http://localhost), it won't work.