Compartir a través de


Tutorial: Cree un adaptador de la aplicación Web de UII

 

Publicado: noviembre de 2016

Se aplica a: Dynamics 365 (online), Dynamics 365 (on-premises), Dynamics CRM 2013, Dynamics CRM 2015, Dynamics CRM 2016

Puede crear un adaptador de la aplicación web si desea mejorar y editar las aplicaciones web para las que no tiene acceso al código origen o tiene permisos para cambiar mediante código administrado.Microsoft Dynamics 365 proporciona una plantilla de Microsoft Visual Studio para crear un adaptador de la aplicación web. La plantilla proporciona código básico como comentarios para ayudarle a comenzar a crear un adaptador de aplicación web.

En este tutorial, creará una aplicación web externa denominada QsWebApplication y la hospedará en Unified Service Desk. Después creará y configurará un adaptador de la aplicación web denominado MyWebApplicationAdapter para que la aplicación web externa interactúe con Unified Service Desk. La aplicación web tiene cuatro etiquetas: para el nombre del cliente, apellidos, dirección, e Id., y cuatro cuadros de texto correspondientes para mostrar los valores de Unified Service Desk.

En este tema

Requisitos previos

Paso 1: Crear una aplicación web de ejemplo

Paso 2: Configure la aplicación web en Dynamics 365

Paso 3: Pruebe la aplicación web

Paso 4: Cree el adaptador de la aplicación web

Paso 5: Configure el adaptador de la aplicación web en Dynamics 365

Paso 6: Pruebe el adaptador de la aplicación web

Requisitos previos

  • 4.5.2 Microsoft .NET Framework

  • Aplicación cliente deUnified Service Desk; requerida para probar el control hospedado.

  • Microsoft Visual Studio 2012, Visual Studio 2013 o Visual Studio 2015

  • Administrador del paquete de Administrador de paquetes de NuGet para Visual Studio 2012, Visual Studio 2013, o Visual Studio 2015

  • Plantillas de SDK de Microsoft Dynamics 365 para Visual Studio que contiene la plantilla de proyecto de control hospedado de la UII. Puede obtenerla de una de las siguientes formas:

Paso 1: Crear una aplicación web de ejemplo

  1. Descargue el paquete del SDK de la UII (.exe)

  2. Para extraer el contenido, haga doble clic en el archivo del paquete.

  3. Desplácese hasta la carpeta <ExtractedFolder>\UII\SampleCode\UII\AIF\QsWebApplication y abra el archivo Microsoft.Uii.QuickStarts.QsWebApplication.csproj en Visual Studio.

  4. Presione F5 o elija Depurar > Iniciar depuración para alojar la aplicación web de ejemplo localmente en su equipo. La aplicación se hospedará en https://localhost:2627/.

    Aplicación web en Visual Studio

Paso 2: Configure la aplicación web en Dynamics 365

  1. Inicie sesión en Microsoft Dynamics 365.

  2. Vaya a Configuración > Unified Service Desk.

  3. Elija Controles hospedados.

  4. Elija Nuevo.

  5. En la página Nuevo control hospedado, especifique los siguientes valores.

    Campo

    Valor

    Nombre

    QsWebApplication

    Tipo de componente de USD

    Aplicación hospedada de CCA

    Aplicación hospedada

    Aplicación hospedada web

    La aplicación es global

    Activado

    Grupo de presentación

    MainPanel

    Adaptador

    No usar adaptador

    La aplicación es dinámica

    No

    Hospedaje de aplicación

    Usar SetParent

    Dirección URL

    Especifique la ubicación en la que se hospedará la aplicación web. En este caso es https://localhost:2627/

    Captura de pantalla de configuración de aplicación web en Dynamics 365

  6. Elija Guardar.

Paso 3: Pruebe la aplicación web

  1. Asegúrese de que la aplicación web de ejemplo que creó en el paso 1 sigue ejecutándose.

  2. Ejecute el cliente de Unified Service Desk para conectarse al servidor de Microsoft Dynamics 365.

  3. Después de iniciar sesión correctamente, verá Ejemplo de la aplicación web externa en el escritorio.

  4. Haga clic en la pestaña Ejemplo de la aplicación web externa para ver su aplicación web hospedada en Servicios unificados.

Hospedaje de aplicaciones web en Unified Service Desk

Nota

En este punto los campos están vacíos porque solo está hospedando la aplicación web externa en Servicios unificados. Para llenarlos con valores de Servicios unificados tenemos que crear un adaptador de la aplicación web como se muestra en el siguiente paso.

Paso 4: Cree el adaptador de la aplicación web

  1. Inicie Microsoft Visual Studio y cree un nuevo proyecto.

  2. En el cuadro de diálogo Nuevo proyecto:

    1. En la lista de plantillas instaladas de la izquierda, expanda Visual C# y seleccione Plantillas SDK de Dynamics 365 > Servicios unificados > Adaptador de aplicación web de UII.

    2. Especifique el nombre y la ubicación del proyecto y haga clic en Aceptar para crear un nuevo proyecto.

      Captura de pantalla del adaptador web en Visual Studio

    3. Elija WebAppAdapter.cs y actualice la definición de NotifyContextChange con el siguiente código para rellenar los campos de texto de la información de contexto.Más información:NotifyContextChange

      public override bool NotifyContextChange(Context context)
              {
                  // Populating text fields from context information.
      
                  HTMLDocument htmlDoc = Browser.Document as HTMLDocument;
                  if (htmlDoc != null)
                  {
                      IHTMLElementCollection htmlElementCollection = htmlDoc.all;
                      IHTMLElement htmlFirstName = htmlElementCollection.item("txtFirstName", 0) as IHTMLElement;
                      htmlFirstName.setAttribute("value", context["firstname"], 0);
                      IHTMLElement htmlLastName = htmlElementCollection.item("txtLastName", 0) as IHTMLElement;
                      htmlLastName.setAttribute("value", context["lastname"], 0);
                      IHTMLElement htmlAddress = htmlElementCollection.item("txtAddress", 0) as IHTMLElement;
                      htmlAddress.setAttribute("value", context["address1_line1"], 0);
                      IHTMLElement htmlID = htmlElementCollection.item("txtID", 0) as IHTMLElement;
                      htmlID.setAttribute("value", context["CustomerID"], 0);
                  }
                  return base.NotifyContextChange(context);
              }
      
    4. Agregue el siguiente código en la definición de reemplazo de DoAction para actualizar la aplicación con valores de Unified Service Desk

      public override bool DoAction(HostedWebApplication.WebAction action, ref string data)
              {
                  Trace.WriteLine(string.Format("{0}>>>>> RECEIVED (WebAction) Action : {1} ", this.Name, action.Name));
      
                  // Check to see if the browser is working on something before allowing the system to do 'normal' behavior.
                  if (Browser.WebBrowser.ReadyState != tagREADYSTATE.READYSTATE_COMPLETE)
                  {
                      // Browser is not in a state to process this request,  Queue it for when the browser is ready to handle it. 
                      Trace.WriteLine(string.Format("{0}>>>>> Browser Busy,({2}) Queuing Action : {1} ", this.Name, action.Name, Browser.WebBrowser.ReadyState.ToString()));
                      qReqActionList.Enqueue(new BrowserActionData(action, data));
                      return false;
                  }
                Trace.WriteLine(string.Format("{0}>>>>>>>>>>> Action:Name={1} Action:Url={2} Action:Query={3} Action:Init={4}", this.Name, action.Name, action.Url, action.QueryString, action.Initialization));
      
                  // Get browser DOM and element collection.
                  // Create an XML Document to load the passed in data to.
                  HTMLDocument htmlDoc = Browser.Document as HTMLDocument;
                  IHTMLElementCollection htmlElementCollection = htmlDoc.all;
      
                  // Check action name for something we know how to process.
                  switch (action.Name)
                  {
                      case "UpdateFirstName":
                          IHTMLElement htmlFirstName = htmlElementCollection.item("txtFirstName", 0) as IHTMLElement;
                          htmlFirstName.setAttribute("value", data, 0);
                          break;
                      case "UpdateLastName":
                          IHTMLElement htmlLastName = htmlElementCollection.item("txtLastName", 0) as IHTMLElement;
                          htmlLastName.setAttribute("value", data, 0);
                          break;
                      case "UpdateAddress":
                          IHTMLElement htmlAddress = htmlElementCollection.item("txtAddress", 0) as IHTMLElement;
                          htmlAddress.setAttribute("value", data, 0);
                          break;
                      case "UpdateID":
                          IHTMLElement htmlID = htmlElementCollection.item("txtID", 0) as IHTMLElement;
                          htmlID.setAttribute("value", data, 0);
                          break;
                  }
                  return false;
              }
      
    5. Guarde el proyecto y créelo (Generar > Generar solución). Después de generar el proyecto correctamente, se genera un ensamblado (MyWebApplicationAdapter.dll) en la carpeta \bin\debug de su carpeta del proyecto. Necesitará este ensamblado más adelante para probar y usar el adaptador de la aplicación web.

Paso 5: Configure el adaptador de la aplicación web en Dynamics 365

  1. Inicie sesión en Microsoft Dynamics 365.

  2. En la barra de navegación, elija Microsoft Dynamics 365 y luego seleccione Configuración.

  3. Elija Configuración > Servicios unificados > Controles hospedados.

  4. En la lista de controles hospedados, seleccione el control hospedado QsWebApplication.

    Lista de controles hospedados en Dynamics 365

  5. En la sección Configuración del adaptador, especifique los siguientes valores.

    Campo

    Valor

    Adaptador

    Usar adaptador

    URI

    MyWebApplicationAdapter

    Tipo

    MyWebApplicationAdapter.WebAppAdapter

    Configuración del adaptador web en Dynamics 365

    Nota

    URI es el nombre del ensamblado y Tipo es el nombre del ensamblado (dll) seguido de un punto (.) y luego el nombre de clase en el proyecto de Visual Studio. En este ejemplo, el nombre del ensamblado es MyWebApplicationAdapter y el nombre de la clase es WebAdapter, que es el nombre de clase predeterminado cuando se crea un adaptador de aplicación web.

  6. Elija Guardar para guardar los cambios.

Paso 6: Pruebe el adaptador de la aplicación web

  1. Copie el ensamblado que contiene la definición del adaptador de la aplicación web de la carpeta de salida del proyecto de Visual Studio(<ProjectFolder>\bin\debug) al directorio de aplicaciones de Servicios unificados. En este caso, copiará el archivo MyWebApplicationAdapter.dll al directorio c:\Program Files\Microsoft Dynamics CRM USD\USD.

  2. Ejecute el cliente de Unified Service Desk para conectarse al servidor de Microsoft Dynamics 365.

  3. Después de iniciar sesión correctamente, verá el botón de la aplicación web externa de ejemplo en el escritorio.

  4. Elija Buscar y luego elija Contactos y seleccione un contacto. En este caso, seleccione Patrick Sands.

    Captura de pantalla de la lista de contactos

  5. Haga clic en Ejemplo de la aplicación web externa y verá el nombre, apellidos, dirección, y el Id. de cliente rellenados.

    Captura de pantalla del adaptador WebApp de pruebas

Nota

Este tutorial le ha mostrado cómo leer y mostrar datos de Unified Service Desk en la aplicación web externa. Para actualizar los datos en Unified Service Desk desde la aplicación web externa, y viceversa, vea Tutorial: Crear un control hospedado de Windows Forms de UII

Ver también

Uso de adaptadores de UII para interactuar con aplicaciones externas y web

Unified Service Desk 2.0

© 2017 Microsoft. Todos los derechos reservados. Copyright