Desarrollar una extensión de herramienta

Una extensión de una herramienta es la forma principal de interacción por parte de los usuarios con Windows Admin Center para administrar una conexión, como un servidor o un clúster. Al hacer clic en una conexión en la pantalla principal de Windows Admin Center y conectarse, se le mostrará una lista de herramientas en el panel de navegación izquierdo. Al hacer clic en cualquiera de ellas, se carga la interfaz de usuario de la herramienta y se muestra en el panel derecho.

Cuando se carga una extensión de una herramienta, puede ejecutar llamadas WMI o scripts de PowerShell en un servidor o clúster de destino, y mostrar información en la interfaz de usuario o ejecutar comandos en función de la entrada del usuario. Las extensiones de herramientas definen las soluciones para las que se deben mostrar, lo que da lugar a un conjunto de herramientas diferente para cada solución.

Preparación del entorno

Si aún no lo ha hecho, prepare el entorno mediante la instalación de dependencias y requisitos previos globales necesarios para todos los proyectos.

Creación de una extensión de una herramienta con el SDK de Windows Admin Center

Una vez que todas las dependencias estén instaladas, estará listo para crear la extensión de la herramienta. Cree una carpeta que contenga los archivos del proyecto, o vaya a ella, abra un símbolo del sistema y establezca esa carpeta como directorio de trabajo. Utilice el SDK de Windows Admin Center que se instaló anteriormente para crear una extensión con esta sintaxis:

wac create --company "{!Company Name}" --tool "{!Tool Name}" --version latest

Observa el siguiente ejemplo de uso:

wac create --company "Contoso Inc" --tool "Manage Foo Works" --version latest

Utilizando Windows Admin Center SDK versiones 6.0.0 y superiores, también puedes crear extensiones de herramientas basadas en React. Crea una nueva extensión de herramienta basada en React usando la siguiente sintaxis:

wac create-react --company "{!Company Name}" --tool "{!Tool Name}" --version latest

Este es un ejemplo:

wac create-react --company "Contoso Inc" --tool "Manage Foo Works" --version latest

Esto crea una carpeta nueva dentro del directorio de trabajo actual con el nombre especificado para la herramienta, copia todos los archivos de plantilla necesarios en el proyecto y configura los archivos con su empresa y el nombre de la herramienta.

Ahora, cambie el directorio a la carpeta que acaba de crear y, después, instale las dependencias locales necesarias mediante la ejecución del comando siguiente:

npm install

Una vez que se complete, configurará todo lo que necesita para cargar la nueva extensión en Windows Admin Center.

Adición de contenido a la extensión

Ahora que ha creado una extensión con el SDK de Windows Admin Center, ya puede personalizar el contenido. Consulte estas guías para obtener ejemplos de lo que puede hacer:

• Adición de un módulo vacío
• Agregar un iFrame

Puede encontrar aún más ejemplos en nuestra Guía para desarrolladores. La Guía para desarrolladores es una extensión de una solución totalmente funcional que se puede cargar lateralmente en Windows Admin Center y contiene una amplia colección de ejemplos de funcionalidades y herramientas que puede examinar y usar en su propia extensión.

Habilite la extensión Guía para desarrolladores en la página Opciones avanzadas de la configuración de Windows Admin Center.

Personalización del icono de la extensión

Puede personalizar el icono que se muestra para la extensión en la lista de herramientas. Para ello, modifique todas las entradas de icon en el archivo manifest.json para la extensión:

"icon": "{!icon-uri}",

NOTA: Actualmente, los iconos personalizados no se pueden ver al cargar lateralmente la extensión en modo de desarrollo. Como solución alternativa, quite el contenido de target como se indica a continuación:

"target": "",

Esta configuración solo es válida para la carga lateral en modo de desarrollo, por lo que es importante conservar el valor contenido en target y, después, restaurarlo antes de publicar la extensión.

Compilación y transferencia local de la extensión

Después, compila y carga localmente tu extensión en Windows Admin Center. Abre una ventana de comandos y cambia el directorio a tu directorio fuente.

• Para construir y servir la extensión, ejecuta el siguiente comando:

  npm run build
  npm start
  

Mantén esta terminal en marcha.

Por defecto, la extensión se carga lateralmente en el puerto 4200. Para cambiar el puerto, modifica los archivos package.json y appsettings.json de tu extensión. Asegúrate de no usar el puerto en el que se ejecuta Windows Admin Center.

Para instalar tu proyecto en una instancia local de Windows Admin Center para pruebas, adjunta el proyecto servido localmente.

• Inicie Windows Admin Center en un explorador web

• Abra el depurador (F12)

• Abre la consola y escribe el siguiente comando para realizar la carga lateral con localhost:

  MsftSme.sideLoad("http://localhost:4200")
  

  Si has seguido las instrucciones para realizar una instalación paralela utilizando un FQDN, abre la consola y escribe el siguiente comando:

  MsftSme.sideLoad("http://<FQDN>:4200")
  

• Actualiza el navegador web.

Tu proyecto ahora aparece en la lista de herramientas con (sideloaded) junto al nombre.