Configurar el inicio de sesión único con Microsoft Entra ID

Copilot Studio admite el inicio de sesión único (SSO). SSO permite que los agentes de su sitio web registren a los clientes si ya iniciaron sesión en la página o aplicación donde está implementado agente.

Por ejemplo, el agente está alojado en la intranet corporativa o en una aplicación en la que el usuario ya ha iniciado sesión.

Hay cuatro pasos principales para configurar el SSO para Copilot Studio:

1. Cree un registro de aplicación en Microsoft Entra ID para el lienzo personalizado.

2. Define un alcance personalizado para tu agente.

3. Configurar la autenticación en Copilot Studio para habilitar SSO.

4. Configure su código HTML de lienzo personalizado para habilitar SSO.

Requisitos previos

• Habilite la autenticación de usuario final con ID de Microsoft Entra.
• Añade una autenticación tema a tu agente
• Usar un lienzo personalizado

Nota

Para configurar SSO utilizando otros proveedores de OAuth 2.0, consulte Configurar el inicio de sesión único con proveedores de OAuth genéricos.

Canales admitidos

La siguiente tabla detalla los canales que actualmente admiten SSO. Puedes sugerir soporte para canales adicionales en el foro Copilot Studio Ideas.

Canal	Addmitido
Canales de Azure Bot Service	No admitido
Sitio web personalizado	Addmitido
Sitio web de demostración	No admitido
Facebook	No admitido
Microsoft Teams1	Addmitido
Aplicación móvil	No admitido
Omnicanal para servicio al cliente2	Addmitido

¹ Si también tiene habilitado el canal Teams, debe seguir las instrucciones de configuración en la documentación Configurar inicio de sesión único con Microsoft Entra ID para agentes en Microsoft Teams . Si no configura los ajustes de SSO de Teams como se indica en esa página, sus usuarios siempre fallarán en la autenticación al usar el canal de Teams.

² Solo se admite el canal de chat en vivo. Para más información, consulte Configurar la transferencia a Dynamics 365 Customer Service.

Importante

Actualmente no se admite SSO cuando un agente ha sido:

• Publicación en un portal de Power Apps.
• Publicado en un SharePoint sitio web como un iframe.

Sin embargo, SSO es compatible con un agente que se haya publicado en un sitio web de SharePoint como un Componente SPFx.

Aplicación web

Crer registros de aplicación para el sitio web personalizado

Para habilitar SSO, necesitará crear dos registros de aplicaciones separados:

• Un registro de aplicación de autenticación, que permite la Microsoft Entra autenticación de usuario de ID para su agente
• Un registro de la aplicación de lienzo que habilita SSO para su página web personalizada

No recomendamos reutilizar el mismo registro de aplicación tanto para su agente como para su sitio web personalizado por razones de seguridad.

1. Siga las instrucciones en Configurar la autenticación de usuarios con Microsoft Entra ID para crear un registro de aplicación de autenticación.

2. Seguir las instrucciones para crear nuevamente un registro de aplicación de autenticación, para crear un segundo registro de aplicación, que sirve como registro de su aplicación de lienzo.

3. Agregue su id. de registro de aplicación de lienzo al registro de autenticación de aplicación.

Agregar URL de intercambio de token

Para actualizar la configuración de autenticación de Microsoft Entra ID en Copilot Studio, debe agregar la URL de intercambio de token para permitir su aplicación y Copilot Studio para compartir la información.

1. En el portal Azure, en la hoja de registro de su aplicación de autenticación, vaya a Exponer una API.

2. En Ámbitos, seleccione el icono Copiar al portapapeles.

3. En Copilot Studio, en el menú de navegación en Configuración, seleccione Seguridad y, a continuación, seleccione el mosaico Autenticación.

4. Para URL de intercambio de tokens (obligatorio para SSO), pegue el alcance que copió anteriormente.

5. Seleccione Guardar.

Configure el registro de su aplicación de lienzo

1. Una vez ha creado su registro de aplicación de lienzo, vaya a Autenticación y luego seleccione Agregar una plataforma.

2. Debajo de Configuraciones de plataforma, seleccione Agregar una plataforma y luego seleccione Web.

3. En URI de redireccionamiento, introduzca la URL de su página web; por ejemplo, http://contoso.com/index.html.

   

4. En la sección Concesión implícita y flujos híbridos, active tanto Tokens de acceso (utilizados para flujos implícitos e híbridos) como Tokens de acceso (utilizados para flujos implícitos).

5. Seleccione Configurar.

Encuentra la URL del token punto de conexión de tu agente

1. En Copilot Studio, abre tus agente y luego Seleccionar Canales.

2. Seleccione Aplicación móvil.

3. En Extremo de token, seleccione Copiar.

   

Configurar SSO en su página web

Use el código proporcionado en el repositorio de GitHub de Copilot Studio para crear una página web para la URL de redireccionamiento. Copie el código del repositorio de GitHub y modifíquelo siguiendo las siguientes instrucciones.

Nota

El código en el repositorio de GitHub requiere que el usuario seleccione un botón de inicio de sesión o inicie sesión desde un sitio diferente. Para habilitar el inicio de sesión automático, agregue el siguiente código al comienzo de aysnc function main():

    (async function main() {
        if (clientApplication.getAccount() == null) {
           await clientApplication.loginPopup(requestObj).then(onSignin).catch(function (error) {console.log(error) });
        }
        // Add your BOT ID below 
        var theURL =

1. Vaya a la página Descripción general en el portal de Azure y copie el Id. de aplicación (cliente) y Id. de directorio (inquilino) en el registro de la aplicación de lienzo.

   

2. Para configurar la Microsoft Authentication Library (MSAL):

   • Asigne clientId para su Id. de la aplicación (cliente).
   • Asigne authority a https://login.microsoftonline.com/ y agregue su Id. de directorio (inquilino) al final.

   Por ejemplo:

   var clientApplication;
       (function (){
       var msalConfig = {
           auth: {
               clientId: '00001111-aaaa-2222-bbbb-3333cccc4444',
               authority: 'https://login.microsoftonline.com/7ef988bf-xxxx-51af-01ab-2d7fd011db47'     
           },
   

3. Establezca la variable theURL en la URL del token punto de conexión que copió anteriormente. Por ejemplo:

   (async function main() {
   
       var theURL = "https://<token endpoint URL>"
   

4. Edite el valor de userId para incluir un prefijo personalizado. Por ejemplo:

   var userId = clientApplication.account?.accountIdentifier != null ? 
           ("My-custom-prefix" + clientApplication.account.accountIdentifier).substr(0, 64) 
           : (Math.random().toString() + Date.now().toString()).substr(0,64);
   

5. Guarda los cambios.

Pon a prueba tu agente usando tu página web

1. Abra su página web en su navegador.

2. Seleccione Iniciar sesión.

   

   Nota

   Si su navegador bloquea las ventanas emergentes o está utilizando una ventana de navegación privada o de incógnito, se le solicitará que inicie sesión. De lo contrario, el inicio de sesión se completa utilizando un código de validación.

   Se abre una nueva pestaña del explorador.

3. Cambie a la nueva pestaña y copie el código de validación.

4. Regrese a la pestaña con su agente y pegue el código de validación en la conversación agente.

Contenido relacionado

• Registro de aplicación de Azure

Clásico

Descripción técnica

La siguiente ilustración muestra cómo un usuario inicia sesión sin ver una solicitud de inicio de sesión (SSO) en Copilot Studio:

1. El usuario agente ingresa una frase que activa un inicio de sesión tema. El tema de inicio de sesión está diseñado para iniciar sesión y usar el token autenticado (variable User.AccessToken).

2. Copilot Studio envía una solicitud de inicio de sesión para permitir que el usuario inicie sesión con su proveedor de identidad configurado.

3. El lienzo personalizado de agente intercepta el mensaje de inicio de sesión y solicita un token en nombre de (OBO) de Microsoft Entra ID. El lienzo envía el token a agente.

4. Al recibir el token OBO, el agente intercambia el token OBO por un "token de acceso" y completa la variable usando el valor de token de acceso. AuthToken Las variables IsLoggedIn también se establecen en este momento.

Cree un registro de aplicación en Microsoft Entra ID para el lienzo personalizado

Para habilitar SSO, necesitará dos registros de aplicaciones separados:

• Uno para su agente para habilitar la autenticación de usuario con Microsoft Entra ID.
• Uno para que su lienzo personalizado habilite SSO.

Importante

No puedes reutilizar el mismo registro de aplicación tanto para la autenticación de usuario de agente como para tu lienzo personalizado.

Crear un registro de aplicación para el lienzo de agente

1. Inicie sesión en el portal Azure.

2. Vaya a Registros de aplicaciones seleccionando el icono o buscando en la barra de búsqueda superior.

   

3. Seleccione Nuevo registro.

   

4. Escriba un nombre para el registro. Puede ser útil utilizar el nombre del agente cuyo lienzo estás registrando e incluir "lienzo" para ayudar a separarlo del registro de la aplicación para la autenticación.

   Por ejemplo, si su agente se llama "ayuda de ventas Contoso", puede nombrar el registro de la aplicación como "ContosoSalesCanvas" o algo similar.

5. En Tipos de cuenta admitidos, seleccione Cuentas en cualquier inquilino de organización (Cualquier directorio de Microsoft Entra ID -Multiinquilino) y cuentas de Microsoft personales (p. ej. Skype, Xbox).

6. Deja la sección URI de redireccionamiento en blanco de momento. En los próximos pasos especificará esa información. Seleccione Registro.

   

7. Una vez completado el registro, se abrirá en la página Visión general. Vaya a Manifiesto. Confirme que accessTokenAcceptedVersion se establece en 2. Si no es así, cámbielo a 2 y luego seleccione Guardar.

Agregar la URL de redireccionamiento

1. Con el registro abierto, vaya a Autenticación y luego seleccione Agregar una plataforma.

   

2. En la hoja Configurar plataformas, seleccione Web.

   

3. En Redirigir URI, agregue la dirección URL completa a la página donde está hospedado su lienzo de chat. En la sección Concesión implícita, active las casillas Tokens de id. y Tokens de acceso.

4. Seleccione Configurar para confirmar los cambios.

   

5. Vaya a Permisos de API. Seleccione Otorgar consentimiento de administrador para <su nombre de inquilino> y después Sí.

   Importante

   Para evitar que los usuarios tengan que dar su consentimiento a cada aplicación, se debe tener un administrador global, una administrador de aplicaciones o un administrador de aplicaciones en la nube para otorgar el consentimiento en todo el inquilino para los registros de aplicaciones.

   

Define un alcance personalizado para tu agente

Defina un ámbito personalizado exponiendo una API para el registro de la aplicación de lienzo dentro del registro de la aplicación de autenticación. Los ámbitos le permite determinar los roles de usuario y administrador y los derechos de acceso.

Este paso crea una relación de confianza entre el registro de la aplicación de autenticación para la autenticación y el registro de la aplicación para su lienzo personalizado.

1. Abra el registro de la aplicación que creó cuando configuró la autenticación.

2. Vaya a Permisos de API y asegúrese de que se hayan agregado los permisos correctos para su agente. Seleccione Otorgar consentimiento de administrador para <su nombre de inquilino> y después Sí.

   Importante

   Para evitar que los usuarios tengan que dar su consentimiento a cada aplicación, se debe tener un administrador global, una administrador de aplicaciones o un administrador de aplicaciones en la nube para otorgar el consentimiento en todo el inquilino para los registros de aplicaciones.

3. Vaya a Exponer una API y seleccione Agregar un ámbito.

   

4. Escriba un nombre para el ámbito, junto con la información de visualización que se debe mostrar a los usuarios cuando accedan a la pantalla de SSO. Seleccione Agregar ámbito.

   

5. Seleccione Agregar una aplicación cliente.

6. Especifique el Id. de la aplicación (cliente) en la página Descripción general para el registro de la aplicación de lienzo en el campo Id. del cliente. Seleccione la casilla de verificación para el ámbito que aparece y que creó.

7. Seleccione Agregar aplicación.

Configurar la autenticación en Copilot Studio para habilitar SSO

La dirección URL de intercambio de tokens en la página de configuración de la autenticación de Copilot Studio se utiliza para intercambiar el token OBO por el token de acceso solicitado a través del marco del bot.

Copilot Studio llama a Microsoft Entra ID para realizar el intercambio real.

1. Inicie sesión en Copilot Studio.

2. Confirme que ha seleccionado el agente para el cual desea habilitar la autenticación seleccionando el ícono agente en el menú superior y eligiendo el agente correcto.

3. En el menú de navegación, en Configuración, seleccione Seguridad. A continuación, seleccione la tarjeta Autenticación.

   

4. Ingrese la URL de alcance completo de la hoja Exponer una API para el registro de la aplicación de autenticación de agente en el campo URL de intercambio de token . La URI tiene el formato de api://1234-4567/scope.name.

   

   

5. Seleccionar Guardar y luego publicar el contenido agente.

Configure su código HTML de lienzo personalizado para habilitar SSO

Actualice la página de lienzo personalizada donde se encuentra agente para interceptar la solicitud de inicio de sesión tarjeta e intercambiar el token OBO.

1. Configure la Biblioteca de autenticación de Microsoft (MSAL) agregando el siguiente código en una etiqueta <script> en la sección <encabezado>.

2. Actualice clientId con el Id. de la aplicación (cliente) para el registro de la aplicación de lienzo. Reemplace <Directory ID> con el Id. de directorio (inquilino). Obtendrá estos identificadores en la página Descripción general para el registro de la aplicación de lienzo.

   <head>
    <script>
      var clientApplication;
        (function () {
          var msalConfig = {
              auth: {
                clientId: '<Client ID [CanvasClientId]>',
                authority: 'https://login.microsoftonline.com/<Directory ID>'
              },
              cache: {
                cacheLocation: 'localStorage',
                storeAuthStateInCookie: false
              }
          };
          if (!clientApplication) {
            clientApplication = new Msal.UserAgentApplication(msalConfig);
          }
        } ());
    </script>
   </head>
   

3. Inserte el siguiente <script> en las sección <cuerpo>. Este script llama a un método para recuperar resourceUrl e intercambie su token actual por un token solicitado por la solicitud de OAuth.

   <script>
   function getOAuthCardResourceUri(activity) {
     if (activity &&
          activity.attachments &&
          activity.attachments[0] &&
          activity.attachments[0].contentType === 'application/vnd.microsoft.card.oauth' &&
          activity.attachments[0].content.tokenExchangeResource) {
            // asking for token exchange with Microsoft Entra ID
            return activity.attachments[0].content.tokenExchangeResource.uri;
      }
   }
   
   function exchangeTokenAsync(resourceUri) {
     let user = clientApplication.getAccount();
      if (user) {
        let requestObj = {
          scopes: [resourceUri]
        };
        return clientApplication.acquireTokenSilent(requestObj)
          .then(function (tokenResponse) {
            return tokenResponse.accessToken;
            })
            .catch(function (error) {
              console.log(error);
            });
            }
            else {
            return Promise.resolve(null);
      }
   }
   </script>
   

4. Inserte el siguiente <script> en las sección <cuerpo>. Dentro del método main , este código agrega un condicional a su store, con el identificador único de su agente. También genera un id. único como su variable userId.

5. Actualice <COPILOT ID> con el ID de su agente. Puedes ver el ID de tu agente yendo a la pestaña Canales del agente que estás usando y seleccionando Aplicación móvil en el Copilot Studio portal.

   <script>
       (async function main() {
   
           // Add your AGENT ID below 
           var BOT_ID = "<BOT ID>";
           var theURL = "https://powerva.microsoft.com/api/botmanagement/v1/directline/directlinetoken?botId=" + BOT_ID;
   
           const {
               token
           } = await fetchJSON(theURL);
   
           var directline = await fetchJSON(regionalChannelSettingsURL).then(res=> res.channelUrlsById.directline); 
   
           const directLine = window.WebChat.createDirectLine({
               domain: `${directline}v3/directline`,
               token
           });
   
           var userID = clientApplication.account?.accountIdentifier != null ?
               ("Your-customized-prefix-max-20-characters" + clientApplication.account.accountIdentifier).substr(0, 64) :
               (Math.random().toString() + Date.now().toString()).substr(0, 64); // Make sure this will not exceed 64 characters 
           const store = WebChat.createStore({}, ({
               dispatch
           }) => next => action => {
               const {
                   type
               } = action;
               if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
                   dispatch({
                       type: 'WEB_CHAT/SEND_EVENT',
                       payload: {
                           name: 'startConversation',
                           type: 'event',
                           value: {
                               text: "hello"
                           }
                       }
                   });
                   return next(action);
               }
               if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
                   const activity = action.payload.activity;
                   let resourceUri;
                   if (activity.from && activity.from.role === 'bot' &&
                       (resourceUri = getOAuthCardResourceUri(activity))) {
                       exchangeTokenAsync(resourceUri).then(function(token) {
                           if (token) {
                               directLine.postActivity({
                                   type: 'invoke',
                                   name: 'signin/tokenExchange',
                                   value: {
                                       id: activity.attachments[0].content.tokenExchangeResource.id,
                                       connectionName: activity.attachments[0].content.connectionName,
                                       token,
                                   },
                                   "from": {
                                       id: userID,
                                       name: clientApplication.account.name,
                                       role: "user"
                                   }
                               }).subscribe(
                                   id => {
                                       if (id === 'retry') {
                                           // The agent was not able to handle the invoke, so display the oauthCard
                                           return next(action);
                                       }
                                       // else: tokenexchange successful and we do not display the oauthCard
                                   },
                                   error => {
                                       // an error occurred to display the oauthCard
                                       return next(action);
                                   }
                               );
                               return;
                           } else
                               return next(action);
                       });
                   } else
                       return next(action);
               } else
                   return next(action);
           });
   
           const styleOptions = {
   
               // Add styleOptions to customize Web Chat canvas
               hideUploadButton: true
           };
   
           window.WebChat.renderWebChat({
                   directLine: directLine,
                   store,
                   userID: userID,
                   styleOptions
               },
               document.getElementById('webchat')
           );
       })().catch(err => console.error("An error occurred: " + err));
   </script>
   

Ejemplo completo de código

Para más información, puede encontrar código de muestra completo, con los scripts condicionales MSAL y de almacenamiento ya incluidos en nuestro repositorio de GitHub.