How to create SSO enabled app for Teams meetings and calls in React

Question

How to create SSO enabled app for Teams meetings and calls in React

Aman Sharma 0

What are some resources that can help me build a single sign-on (SSO) enabled app for Teams meetings and calls using React? I've tried working with provided samples and the Teams Toolkit, but I'm having trouble getting the Save button to work after configuring my manifest with the correct settings. I want to deploy the app on Azure app service and integrate it with Azure Fluid Relay service.

  "configurableTabs": [
    {
      "configurationUrl": "${{TAB_ENDPOINT}}/index.html#/config",
      "canUpdateConfiguration": true,
      "scopes": ["team", "groupchat"],
      "context": [
        "channelTab",
        "privateChatTab",
        "meetingChatTab",
        "meetingDetailsTab",
        "meetingSidePanel"
      ],
      "meetingSurfaces": ["sidePanel", "stage"]
    }
  ],
  "staticTabs": [],

Vaibhav-MSFT 15 Reputation points Microsoft External Staff

2024-05-10T06:27:59.2266667+00:00

Hello Aman Sharma,
Thanks for reporting your issue here.
You can refer the sample to build SSO enabled app for meeting-
https://github.com/OfficeDev/Microsoft-Teams-Samples/tree/main/samples/meetings-token-app/csharp

Also for better understanding of how to enable SSO for Teams app you can refer-
https://learn.microsoft.com/en-us/microsoftteams/platform/tabs/how-to/authentication/tab-sso-overview
https://learn.microsoft.com/en-us/microsoftteams/platform/tabs/how-to/authentication/tab-sso-code

For SAVE button not working-
Can you please check if the configurationUrl points to the correct endpoint where your configuration page is hosted.
Use dev tools to get more insights about the issue.
Vaibhav-MSFT 15 Reputation points Microsoft External Staff

2024-05-10T09:38:50.8333333+00:00

Please let us know more about the error you are facing if the issue persists