Following up on my previous post about Microsoft Teams meeting apps, let’s now have a look at how we can invoke the Microsoft Graph in our meeting app.
Specifically, we will be using the Microsoft Graph communications API to get all meeting participants.
When I was first looking at this scenario, I thought it would be quite straightforward as this seems to be quite a common use case for meeting apps. However, I was in for a bit of a surprise as that did not turn out to be the case.
My thinking was that I would get a meetingId as part of the Teams JS SDK context object and I would use this meetingId to get details from the Graph. But it turns out that the meetingId which the Teams JS SDK provides is completely different than the meetingId recognised by that Microsoft Graph.
To fetch the meetingId which the Graph recognises, we have to introduce the Bot Framework SDK to the mix and exchange the Teams JS SDK meetingId for the Graph meeting Id.
So let’s see how to achieve this using code:
1) Using Teams JS SDK, get user id, meeting id, tenant id
This bit is straightforward, in your Teams tab you can get the meeting context using the Teams JS SDK:
| import * as microsoftTeams from “@microsoft/teams-js”; | |
| useEffect(() => { | |
| microsoftTeams.initialize(); | |
| microsoftTeams.getContext(async function (context: microsoftTeams.Context) { | |
| const rawResponse = await fetch(`/Meeting?userId=${context.userObjectId}&meetingId=${context.meetingId}&tenantId=${context.tid}`, { | |
| method: ‘GET’, | |
| headers: { | |
| ‘Accept’: ‘application/json’, | |
| ‘Content-Type’: ‘application/json’ | |
| } | |
| }); | |
| }); | |
| }, []); |
view rawmeetingapp.tsx hosted with ❤ by GitHub
2) Use Bot SDK to get Graph meeting ID from the Teams meeting id
Next, from your Teams Bot, call the /v1/meetings/{meeting-id} API. Couple of things you should know beforehand:
This API is currently in developer preview. This means that it will only work for when the Microsoft Teams Clients have been switched to preview mode.
Secondly, we have to turn on Resource Specific Consent (RSC) for your app and request the required scopes. More details on both points here: https://docs.microsoft.com/en-us/microsoftteams/platform/apps-in-teams-meetings/api-references?tabs=dotnet#get-meeting-details-api
Once you have everything setup, you can call the API to get the meeting details:
| public async Task<OnlineMeetingServiceResponse> GetMeetingDetails(string serviceUrl, string meetingId) | |
| { | |
| using var getRoleRequest = new HttpRequestMessage(HttpMethod.Get, new Uri(new Uri(serviceUrl), string.Format(“v1/meetings/{0}”, meetingId))); | |
| getRoleRequest.Headers.Authorization = new AuthenticationHeaderValue(“Bearer”, await this.botCredentials.GetTokenAsync()); | |
| using var getRoleResponse = await this.httpClient.SendAsync(getRoleRequest); | |
| getRoleResponse.EnsureSuccessStatusCode(); | |
| var meetingresponse = JsonConvert.DeserializeObject<OnlineMeetingServiceResponse>(await getRoleResponse.Content.ReadAsStringAsync()); | |
| return meetingresponse; | |
| } |
view rawmeetingdetails.cs hosted with ❤ by GitHub
The response would contain a details object with an msGraphResourceId property. This will be the meeting id which would work with the Graph API.
| { | |
| “details”: { | |
| “id”: “meeting ID”, | |
| “msGraphResourceId”: “”, | |
| “scheduledStartTime”: “2020-08-21T02:30:00+00:00”, | |
| “scheduledEndTime”: “2020-08-21T03:00:00+00:00”, | |
| “joinUrl”: “https://teams.microsoft.com/l/xx”, | |
| “title”: “All Hands”, | |
| “type”: “Scheduled” | |
| }, | |
| //..// | |
| } |
3) Use Graph API to get meeting participants from Graph meeting id
Finally, from the msGraphResourceId, we can make a regular call to the Graph to get the meeting details. Specifically, we will call the /onlineMeetings/{meetingId} endpoint: https://docs.microsoft.com/en-us/graph/api/onlinemeeting-get?view=graph-rest-1.0&tabs=http
In this case, we will get the meeting participants:
| GraphServiceClient graphClient = await GetGraphClient(); | |
| OnlineMeeting onlineMeeting = await graphClient.Users[userId].OnlineMeetings[meetingresponse.details.msGraphResourceId].Request().GetAsync(); | |
| MeetingParticipants participants = onlineMeeting.Participants; |
view rawgraphmeetingdetails.cs hosted with ❤ by GitHub
Make sure you have the correct Delegated or Application permissions granted to the Azure AD app registration you are using for authenticating to the Graph.
This is not an ideal situation as you might not have a requirement for a Bot in your Teams app and might be building a tab for example. In this case, Yannick Reekmans has written a post for you here: https://blog.yannickreekmans.be/get-full-meeting-details-in-a-teams-meetings-app-without-using-bot-sdk/
That’s it for now. Hope you find this helpful when exploring meeting apps right now.
This blog is part of Microsoft Team Week. Discover more.
About the Author
Working as a Technical Architect / Developer in London.
Reference
Deshpande, V., 2022, Working with the Microsoft Graph communications API in a Microsoft Teams meeting app, Available at: https://www.vrdmn.com/2022/02/working-with-microsoft-graph.html [Accessed on 15 March 2023]
