> For the complete documentation index, see [llms.txt](https://docs.devolutions.net/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.devolutions.net/powershell-universal/es/aplicaciones/interaction.md). # Interacción Cree aplicaciones interactivas de PowerShell Universal utilizando el almacenamiento local del navegador, el portapapeles, las descargas, los avisos toast, los modales, los cmdlets de JavaScript y las ```powershell Invoke-UDRedirect https://devolutions.net/powershell-universal/ ``` Universal Apps permite crear sitios web interactivos con PowerShell. Varios cmdlets proporcionan información al usuario, actualizan componentes, leen el estado de los componentes y conservan las preferencias locales del navegador. ## Portapapeles Puede establecer datos de cadena en el portapapeles del usuario con `Set-UDClipboard`. ```powershell New-UDButton -Text 'Clipboard' -OnClick { Set-UDClipboard -Data 'Hello, there!' } ``` #### API * Set-UDClipboard ## Descargas Puede iniciar una descarga en el navegador del usuario utilizando `Start-UDDownload`. Debido a la seguridad del navegador, el usuario debe realizar una acción, como hacer clic en un botón, para permitir la descarga. `Start-UDDownload` no es adecuado para descargas de ficheros grandes. ```powershell New-UDButton -Text 'Download' -OnClick { Start-UDDownload -StringData 'Hello, World!' } ``` ## Almacenamiento local Utilice `Set-UDLocalStorage` y `Get-UDLocalStorage` para conservar las preferencias de la aplicación de un usuario en el almacenamiento local del navegador. Los valores permanecen disponibles después de recargar la página y cuando el usuario abre más tarde la misma aplicación en el mismo perfil de navegador. PowerShell Universal limita el ámbito de los valores almacenados al dashboard y al navegador. No se comparten con otros usuarios, navegadores ni dashboards. Utilice estos cmdlets desde un controlador de eventos interactivo para que PowerShell Universal pueda comunicarse con el navegador conectado. Los valores se serializan con el serializador de PowerShell antes de almacenarse, por lo que puede guardar y recuperar objetos de PowerShell y tablas hash. `Get-UDLocalStorage` devuelve `$null` cuando el elemento no existe. ```powershell New-UDForm -Content { New-UDTextbox -Id 'theme' -Label 'Theme' -Value 'Dark' New-UDTextbox -Id 'pageSize' -Label 'Page Size' -Value '25' } -OnSubmit { Set-UDLocalStorage -Name 'preferences' -Value @{ Theme = $EventData.theme PageSize = [int]$EventData.pageSize } Show-UDToast -Message 'Preferences saved.' } New-UDButton -Text 'Show preferences' -OnClick { $preferences = Get-UDLocalStorage -Name 'preferences' if ($null -eq $preferences) { Show-UDToast -Message 'No preferences have been saved.' return } Show-UDToast -Message "Theme: $($preferences.Theme); page size: $($preferences.PageSize)" } ``` El almacenamiento local del navegador puede ser leído y modificado por el código que se ejecuta en la página. No almacene en él contraseñas, credenciales, claves de API, tokens ni otros datos sensibles. Trate los valores almacenados como entradas controladas por el usuario. #### API * Set-UDLocalStorage * Get-UDLocalStorage ## Controladores de eventos Muchos componentes admiten controladores de eventos en forma de bloques de script. También puede verlos denominados endpoints, ya que así se llamaban en Universal Dashboard v2. Estos controladores de eventos le permiten invocar scripts de PowerShell cuando se producen determinadas acciones en la página. Por ejemplo, puede tener un clic de botón que llame a un controlador de eventos. Este botón muestra un toast al hacer clic. Puede incluir cualquier cmdlet de PowerShell válido dentro del código del controlador de eventos. ```powershell New-UDButton -Text 'Click Me' -OnClick { Show-UDToast 'Hello!' } ``` ### Ámbito de las variables Las variables se incluyen automáticamente en el ámbito de los controladores de eventos. Puede acceder a las variables que defina fuera del controlador de eventos. ```powershell $MyVariable = "Hello!" New-UDButton -Text 'Click Me' -OnClick { Show-UDToast $MyVariable } ``` ### Datos del evento Algunos controladores de eventos proporcionan datos como cadena o como tabla hash. Esto depende del controlador de eventos que utilice. Por ejemplo, el controlador de eventos `-OnClick` de `New-UDButton` no proporciona datos. Por otro lado, `-OnChange` de `New-UDSelect` sí proporciona datos de evento. Puede acceder a los datos del evento utilizando la variable `$Body` como cadena, a veces con formato JSON, o utilizando la variable `$EventData` como tabla hash. ```powershell New-UDSelect -Option { New-UDSelectOption -Name 'One' -Value 1 New-UDSelectOption -Name 'Two' -Value 2 New-UDSelectOption -Name 'Three' -Value 3 } -OnChange { Show-UDToast -Message $EventData } ``` ## Formularios ### Enviar un formulario Puede forzar el envío de un formulario utilizando el cmdlet `Invoke-UDForm`. De forma opcional, puede aplicar la validación incluyendo el parámetro `-Validate`. ```powershell New-UDForm -Id 'form' -Content { New-UDTextbox -Id 'Text' -Label 'Submit Me' } -OnSubmit { Show-UDToast "Hello!" } New-UDButton -Text "Submit Form" -OnClick { Invoke-UDForm -Id 'form' } ``` ### Validar un formulario Puede forzar la validación de un formulario utilizando `Test-UDForm`. ```powershell New-UDForm -Id 'form' -Content { New-UDTextbox -Id 'Text' -Label 'Submit Me' } -OnSubmit { Show-UDToast "Hello!" } -OnValidate { New-UDValidationResult } New-UDButton -Text "Submit Form" -OnClick { Test-UDForm -Id 'form' } ``` ## JavaScript Puede invocar JavaScript desde PowerShell utilizando el cmdlet `Invoke-UDJavaScript`. ```powershell New-UDButton -Text 'Alert Me' -OnClick { Invoke-UDJavaScript -JavaScript 'alert("Hello!")' } ``` #### API * Invoke-UDJavaScript ## Toast ### Mostrar un toast Puede utilizar el cmdlet `Show-UDToast` para crear un mensaje toast que aparece en la página web del usuario final. Se produce a través de un WebSocket y muestra el toast inmediatamente. ```powershell Show-UDToast -Message 'Hello, World!' ``` ### Mostrar un toast con un icono Los toasts admiten iconos como cadenas. Puede utilizar todos los iconos de FontAwesome v5. ```powershell Show-UDToast -Icon "Ad" -Message "Test" ``` ### Ocultar un toast Oculte un toast según el ID especificado. ```powershell Show-UDToast -Message 'Hello, World!' -Id 'Toast' -Duration 30000 New-UDButton -Text 'Click' -OnClick { Hide-UDToast -Id 'Toast' } ``` ### API * Show-UDToast * Hide-UDToast ## Redirección Puede redirigir a los usuarios a diferentes páginas utilizando el cmdlet `Invoke-UDRedirect`. Se produce a través de un WebSocket y redirige en cuanto se llama al cmdlet. ```powershell Invoke-UDRedirect http://www.ironmansoftware.com ``` `Invoke-UDRedirect` redirige automáticamente a las páginas del dashboard cuando se utiliza una ruta relativa. ```powershell Invoke-UDRedirect '/page1' ``` Si desea redirigir a una ruta local fuera del dashboard, utilice el parámetro `-Native`. ```powershell Invoke-UDRedirect '/publishedFolder/test.txt' -Native ``` #### API * Invoke-UDRedirect ## Modal Puede abrir un modal utilizando el cmdlet `Show-UDModal`. Se abre en cuanto lo llama. Puede incluir los componentes que desee dentro del modal. Lea más sobre los modales aquí. ## Gestión del estado de los componentes Puede gestionar el estado de los componentes de forma dinámica utilizando los comandos UDElement. ### Obtener el estado de un componente Puede recibir el estado de un elemento utilizando `Get-UDElement`. El estado se devuelve como una tabla hash. Esto resulta útil principalmente para los componentes de entrada. ```powershell $Value = (Get-UDElement -Id 'txtExample').value ``` ### Establecer el estado de un componente Como alternativa, puede establecer el estado de un componente utilizando `Set-UDElement`. Debe especificar un ID y una tabla hash de propiedades que establecer en el componente. Todos los componentes integrados admiten `Set-UDElement`. ```powershell New-UDTextbox -Id 'textbox' New-UDButton -Text 'Click' -OnClick { Set-UDElement -Id 'textbox' -Properties @{ Value = 'My Value' } } ``` ### Eliminar un componente Puede eliminar componentes de la página utilizando `Remove-UDElement`. El componente ya no aparece en la página. ```powershell Remove-UDComponent -Id 'txtExample' ``` ### Añadir un componente Añada un componente secundario a un componente principal existente. ```powershell New-UDElement -Id 'myDiv' -Tag div New-UDButton -Text 'Click' -OnClick { Add-UDElement -ParentId 'myDiv' -Content { New-UDTypography -Text 'Hi' } } ``` ### Borrar un componente Puede eliminar todos los componentes secundarios de un componente existente utilizando `Clear-UDElement`. ```powershell New-UDElement -Id 'myDiv' -Tag div New-UDButton -Text 'Click' -OnClick { Add-UDElement -ParentId 'myDiv' -Content { New-UDTypography -Text 'Hi' } Add-UDElement -ParentId 'myDiv' -Content { New-UDTypography -Text 'Hi' } Add-UDElement -ParentId 'myDiv' -Content { New-UDTypography -Text 'Hi' } } New-UDButton -Text 'Clear' -OnClick { Clear-UDElement -Id 'myDiv' } ``` ### Recargar un componente Algunos componentes admiten la recarga. Puede activar la recarga de un componente utilizando `Sync-UDElement`. ```powershell New-UDDynamic -Id 'reloadMe' -Content { Get-Date } New-UDButton -Text 'Click' -OnClick { Sync-UDElement -Id 'reloadMe' } ``` ### Seleccionar un componente Puede seleccionar un componente con `Select-UDElement`. ```powershell New-UDElement -Id 'txt' -Tag input -Properties @{ type = text } New-UDButton -Text 'Select' -OnClick { Select-UDElement -Id 'txt' -ScrollToElement } ``` ## Integración con el host de PowerShell Los dashboards se integran directamente con el host de PowerShell para proporcionar funciones basadas en cmdlets estándar. ### Read-Host Al utilizar el cmdlet `Read-Host` se muestra un diálogo en el dashboard del usuario. El texto introducido es devuelto por el cmdlet. ```powershell $Text = Read-Host 'Enter Some Text' Show-UDToast $Text ```
### Get-Credential Al utilizar `Get-Credential` se muestra un diálogo que acepta un nombre de usuario y una contraseña. El cmdlet devuelve un objeto `PSCredential`. ```powershell Get-Credential -UserName "adam" ```
### Write-Progress Los cmdlets que utilizan el flujo de progreso o `Write-Progress` dan como resultado un diálogo de progreso. La ventana emergente muestra la actividad, el porcentaje completado y la operación actual. ```powershell 1..100 | ForEach-Object { Write-Progress -PercentComplete $_ -Activity 'Processing...' -CurrentOperation "User $_" Start-Sleep -Milliseconds 500 } ```
Puede desactivar la integración de Write-Progress estableciendo `$ProgressPreference` en `SilentlyContinue`. ```powershell $ProgressPreference = 'SilentlyContinue' ``` ### Solicitar una elección Puede utilizar la función `$Host.UI.PromptForChoice` para mostrar un diálogo de selección múltiple. ```powershell $Title = "Welcome" $Info = "Just to Demo Prompt for Choice" $options = [System.Management.Automation.Host.ChoiceDescription[]] @("Power", "Shell", "Quit") [int]$defaultchoice = 2 $opt = $host.UI.PromptForChoice($Title, $Info, $Options, $defaultchoice) switch ($opt) { 0 { Show-UDToast "Power" } 1 { Show-UDToast "Shell" } 2 { Show-UDToast "Good Bye!!!" } } ```
### Write-Host `Write-Host` dentro de las aplicaciones escribe en la pestaña **Log** de la Admin Console de la aplicación. Para recibir estos mensajes de registro en la consola de herramientas de desarrollo de su navegador, active el registro en consola en `appsettings.json`. ```json { "UniversalDashboard": { "ConsoleLog": true } } ``` ## API * Get-UDElement * Set-UDElement * Clear-UDElement * Remove-UDElement * Sync-UDElement * Select-UDElement --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://docs.devolutions.net/powershell-universal/es/aplicaciones/interaction.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.