Saturday 21 March 2020

Azure Web App – Integrate Microsoft Teams Channel and show Conversation highlights with MS Graph API endpoints

This article helps you out integrating the Microsoft Teams channel data into custom web applications. Assume an use case, web application has channel mapping, where the app interface needs to show the highlights of latest conversations from respective team channels.

Currently the graph endpoint which exposes the channel messages is beta and available as protected endpoints.

Note: Microsoft Team restricts more sensitive data, and integrate the endpoints if there is a need. Please read out the following notes for the integration guidance.
  • This article little focuses on information about integrating protected APIs. As of today, Microsoft has restricted integrating some of their beta APIs. The protected endpoint list is shown here. https://docs.microsoft.com/en-us/graph/teams-protected-apis
  • To enable the protected APIs for integration, you would need to reach out to Microsoft team for integrations. The request could be submitted through this form. https://aka.ms/teamsgraph/requestaccess
  • The request is generally reviewed, approved and enabled over a timeline mentioned in the article. 
  • The request form needs to be filled with tenant, Azure AD app (explained below) and other details. 
  • Once the request is approved, you will get a notification over email confirming the API enablement within specific timeline. 


Azure AD App Registration and Configuration


Before submitting the request, an Azure AD app needs to be registered on the tenant. The use case requires to get the channel conversations. So, the following snapshot shows the configured and granted permissions. Apart from this configuration, the other key parameters needs to be configured.
  • Enabling oAuth implicit flow. 
  • Enabling implicit tokens 
  • And providing redirect APIs. 
API permissions required for integration
API permissions required for integration



Then the API can be integrated with the web application. In my case it is Azure web app. I have followed the SPA application reference explained in the article. https://docs.microsoft.com/en-us/azure/active-directory/develop/tutorial-v2-javascript-spa


App Repository


The following github library, has working version of code, that could be hosted as Web App on Azure. https://github.com/nakkeerann/SPAAppForChannelData

The following code snippet shows the core integration component. Integrates and shows the app with the Microsoft Teams Channel messages.


The following snapshot shows the messages shown as highlights.
Channel Conversation listed as highlights
Channel Conversation listed as highlights