Configure Copilot single sign-on for Web

Neil HaddleyMarch 16, 2024

Publish|Configure channels

I created a new copilot

I created a new copilot

I named the copilot "Blog Site Copilot"

I named the copilot "Blog Site Copilot"

The copilot was setup

The copilot was setup

"On Unknown Intent" the "Conversational boosting" Topic will generate an answer based on the contents of https://haddley.github.io (the Data source).

"On Unknown Intent" the "Conversational boosting" Topic will generate an answer based on the contents of https://haddley.github.io (the Data source).

To test the Copilot I asked the question "What is Docker?"

To test the Copilot I asked the question "What is Docker?"

I added a Message to display "System.Activity.Text"

I added a Message to display "System.Activity.Text"

Now the text provided by the user is echoed back to them before the generated answer is displayed

Now the text provided by the user is echoed back to them before the generated answer is displayed

Restarting the session displays the message specified in the "Conversation Start" Topic

Restarting the session displays the message specified in the "Conversation Start" Topic

I wanted to publish the Copilot on a custom website.

I clicked the Publish|Go to Channels link

I clicked the Publish|Go to Channels link

"Because you chose Teams Authentication, only Teams channel is available. To use other channels, change your authentication settings. Go to authentication settings."

"Because you chose Teams Authentication, only Teams channel is available. To use other channels, change your authentication settings. Go to authentication settings."

Settings|Security|Authentication

By default the Copilot was configured with Authentication "Only for Teams and Power Apps".

I clicked on the Security menu item

I clicked on the Security menu item

I clicked on the Authentication tile

I clicked on the Authentication tile

The "Only for Teams and Power Apps" authentication option is selected (by default).

The "Only for Teams and Power Apps" authentication option is selected (by default).

Notice that a "Blog Site Copilot (Power Virtual Agents)" application registration was automatically created in Azure.

Notice that a "Blog Site Copilot (Power Virtual Agents)" application registration was automatically created in Azure.

Security|Authentication|No Authentication

I set the Authentication setting to No authentication. I navigated to the Demo Website channel.

I selected the No authentication option

I selected the No authentication option

I clicked the Save button

I clicked the Save button

I clicked the Copy button

I clicked the Copy button

I navigated to https://web.powerva.microsoft.com/environments/b838e044-3024-ea32-b2f4-7862b85e9903/bots/cr74e_blogSiteCopilot/canvas?__version__=2

I navigated to https://web.powerva.microsoft.com/environments/b838e044-3024-ea32-b2f4-7862b85e9903/bots/cr74e_blogSiteCopilot/canvas?__version__=2

I navigated to the Publish tab and clicked the Publish button

I navigated to the Publish tab and clicked the Publish button

I clicked the Publish button

I clicked the Publish button

I returned to the demo website and asked the question "What is NGRX?"

I returned to the demo website and asked the question "What is NGRX?"

Setting|Security|Manual

To Configure Copilot with single sign-on for I created two Application Registrations.

A "Blog Site Copilot (Canvas App)" Application Registration for the Web Page https://delightful-moss-0ad02620f.5.azurestaticapps.net; and

A "Blog Site Copilot (Authenticated App)" Application Registration for Copilot Studio https://token.botframework.com/.auth/web/redirect

The Canvas App Registration has a Web Redirect URI https://delightful-moss-0ad02620f.5.azurestaticapps.net/

The Canvas App Registration has a Web Redirect URI https://delightful-moss-0ad02620f.5.azurestaticapps.net/

The Access tokens and ID tokens options are both checked

The Access tokens and ID tokens options are both checked

The Canvas App Registration has a generated Client secret

The Canvas App Registration has a generated Client secret

The Canvas App Registration Overview

The Canvas App Registration Overview

The Authenticated App Registration has a Web Redirect URI https://token.botframework.com/.auth/web/redirect

The Authenticated App Registration has a Web Redirect URI https://token.botframework.com/.auth/web/redirect

Notice that the Redirect URL can be copied from the Copilot Studio Security|Authentication page

Notice that the Redirect URL can be copied from the Copilot Studio Security|Authentication page

The Access tokens and ID tokens options are both checked

The Access tokens and ID tokens options are both checked

The Authenticated App Registration has a generated Client secret

The Authenticated App Registration has a generated Client secret

The Authenticated App Registration includes a scope. The Authenticated App is configured to trust the Canvas App Registration. Notice that the Canvas App Client ID "ff20..." has been added.

The Authenticated App Registration includes a scope. The Authenticated App is configured to trust the Canvas App Registration. Notice that the Canvas App Client ID "ff20..." has been added.

The Authenticated App Registration includes scope: api://69552d8b-12ac-4e44-96a6-1dc285405aa5/Readfiles

The Authenticated App Registration includes scope: api://69552d8b-12ac-4e44-96a6-1dc285405aa5/Readfiles

The Authenticated App Registration Overview

The Authenticated App Registration Overview

Notice that the Authenticated The Authenticated App Registration Client ID and Client Secret have been added to the Copilot Studio Security|Authentication page. The "api://6955..." scope has been added to the Copilot Studio Security|Authentication page.

Notice that the Authenticated The Authenticated App Registration Client ID and Client Secret have been added to the Copilot Studio Security|Authentication page. The "api://6955..." scope has been added to the Copilot Studio Security|Authentication page.

Code is from https://github.com/microsoft/CopilotStudioSamples/blob/master/BuildYourOwnCanvasSamples/3.single-sign-on/index.html

Code is from https://github.com/microsoft/CopilotStudioSamples/blob/master/BuildYourOwnCanvasSamples/3.single-sign-on/index.html

Static Web App has URL https://delightful-moss-0ad02620f.5.azurestaticapps.net

Static Web App has URL https://delightful-moss-0ad02620f.5.azurestaticapps.net

To get this example to work I needed to load the web page and to click the "log in" button (promptly).

To get this example to work I needed to load the web page and to click the "log in" button (promptly).

Whoami Topic

Whoami Topic

This part of the code posts a "signin/tokenExchange" message to the Copilot (avoiding the need for the web page logged in user to login to the Copilot themselves).

This part of the code posts a "signin/tokenExchange" message to the Copilot (avoiding the need for the web page logged in user to login to the Copilot themselves).