Tutorial paso a paso: Desarrolladores integrando un visor de documentos seguro y sin plugins en aplicaciones ASP.NET Core, MVC o WebForms
24/7/2026

Tutorial paso a paso: Desarrolladores integrando un visor de documentos seguro y sin plugins en aplicaciones ASP.NET Core, MVC o WebForms

Cómo integrar el SDK Doconut Viewer en ASP.NET Core, MVC o WebForms: 75 formatos de archivo, conversión de DOC a PDF, y de dónde proviene realmente la seguridad.

Muchos desarrolladores comienzan buscando bibliotecas de componentes UI cuando necesitan mostrar documentos en una aplicación web. Visor Doconut es un SDK .NET para añadir visualización en el navegador sin plugins a proyectos ASP.NET Core, MVC o WebForms clásicos. La seguridad sigue dependiendo de la arquitectura completa de la aplicación: autenticación, autorización, transporte, almacenamiento, validación, limpieza, parcheo y monitoreo.

Visor de documentos ASP.NET seguro protegido por controles de aplicación en capas
Visor de documentos ASP.NET seguro protegido por controles de aplicación en capas

1. Instalar el SDK Doconut App y preparar su proyecto .NET para múltiples formatos de archivo

1.1 Añadir el paquete compatible

Utilice el paquete actual y las instrucciones de configuración de la página de descarga de Doconut. Registre la versión elegida y verifique que soporta el runtime .NET de destino.

1.2 Verificar la referencia del paquete

Después de la instalación, confirme la referencia del paquete y la versión resuelta en el archivo del proyecto. Mantener versiones explícitas ayuda a que las compilaciones y despliegues sean reproducibles.

1.3 Habilitar HTTPS

Sirva la aplicación mediante HTTPS para que los documentos subidos no viajen en texto claro por su red. Para una aplicación alojada en Kestrel, agregue una configuración de endpoint en appsettings.json:

 {
   "Kestrel": {
     "Endpoints": {
       "Https": {
         "Url": "
       }
     }
   }
 }

Si la aloja en IIS, asocie un certificado HTTPS al sitio. Con HTTPS habilitado, el archivo viaja por un canal seguro en su camino hacia su propio servidor, que es donde el SDK lo renderiza.

De dónde proviene la seguridad.
El SDK se ejecuta dentro de su aplicación, en su infraestructura: no realiza llamadas a servidores Doconut, por lo que los documentos nunca abandonan su red. Esa es la característica alrededor de la cual vale la pena diseñar. No es un certificado de cumplimiento — el SDK no incluye ninguna certificación ISO 27001, SOC 2 o HIPAA propia, y no puede otorgar una a su aplicación. Lo que hace es mantener el archivo dentro de un límite que ya controla y audita.


2. Configurar cargas de archivos seguras y almacenamiento para la gestión de documentos

Esta es la parte que le corresponde a usted y no al SDK, y vale la pena decirlo claramente: la seguridad del transporte, el cifrado en reposo, la retención y la limpieza son decisiones que toma su aplicación. El SDK renderiza documentos; no es una capa de almacenamiento y no cifra su disco por usted.

2.1 Registrar los servicios

En Startup.cs (o Program.cs en .NET moderno), registre los servicios Doconut en el contenedor de inyección de dependencias siguiendo la documentación de la versión que instaló. Donde el SDK necesite una carpeta de trabajo para la salida temporal de renderizado, apúntela a un lugar que controle, y haga la limpieza de esa carpeta su responsabilidad — un trabajo programado o una vida gestionada por la aplicación, no una suposición.

2.2 Crear el endpoint de carga

Implemente una acción de controlador que reciba un archivo subido, lo escriba en el almacén que su aplicación ya use y devuelva un token de un solo uso. El token es lo que el visor del lado del cliente usará para obtener y renderizar el documento. Observe que el almacenamiento es suyo: entrega al SDK los bytes o la ruta cuando es momento de renderizar, y él le devuelve las páginas.

2.3 Proteger el endpoint

Debido a que el endpoint de carga maneja datos sensibles, protégalo con autenticación y autorización basada en roles (por ejemplo, solo los usuarios con el rol DocumentViewer pueden subir). Valide la extensión y el tamaño del archivo del lado del servidor así como en el navegador, y trate los bytes subidos como entrada no confiable.

No omita esto bajo la suposición de que el SDK lo cubre. El cifrado en reposo, la gestión de claves y la limpieza de archivos huérfanos son responsabilidad de su aplicación. Si necesita documentos cifrados en disco, use las facilidades de la plataforma en las que ya confía — el visor no es el lugar para eso.

3. Insertar el componente Viewer en ASP.NET Core, MVC o WebForms

Con el backend listo, inicialice el visor usando los recursos y la API documentados para la versión instalada de Doconut.

3.1 Añadir el paquete JavaScript

En su diseño compartido, incluya solo los recursos del visor descritos en la documentación que corresponde al SDK instalado. No asuma nombres de paquetes o ubicaciones fijas entre versiones.

3.2 Crear una vista Razor para Core/MVC

Agregue una vista (p. ej., Views/Document/View.cshtml) que contenga un campo de entrada de archivo, un elemento contenedor para el visor y un pequeño script que cargue el archivo seleccionado, reciba el token seguro e inicialice el widget Doconut Viewer.

El script debe:

  1. Capturar el archivo seleccionado del elemento <input type="file">.
  2. Enviar el archivo al endpoint de carga usando fetch o XMLHttpRequest.
  3. Cuando llegue la respuesta autorizada, inicializar el visor usando la API compatible con la versión instalada.

3.3 Equivalente para WebForms

En una página WebForms (p. ej., DocumentViewer.aspx), coloque un control asp:FileUpload, un botón para iniciar la carga y un <div> que alojará el visor. En el código subyacente, llame al servicio Doconut para almacenar el archivo subido, obtener el token y registrar un script de inicio que invoque una función JavaScript (initViewer(token)) para crear la instancia del visor.

La razón para hacerlo de esta manera: una única ruta de renderizado que sirve a los tres modelos UI de .NET, sin que el usuario final necesite instalar nada en su máquina.


4. Personalizar el Viewer para la gestión de documentos

El visor se renderiza dentro de un contenedor en su propia página, por lo que la aplicación circundante ya es suya. Además, tome los nombres de opciones y valores predeterminados de la documentación de la versión que instaló, en lugar de cualquier tutorial, incluido este; la superficie de configuración cambia entre versiones y un nombre de opción codificado es lo que más probablemente se rompa al actualizar.

Los aspectos que conviene decidir con antelación:

4.1 Qué controles recibe el usuario

Decida si sus usuarios podrán descargar el archivo original o solo leer las páginas renderizadas. La impresión controlada forma parte del visor y no de una compra separada, por lo que las reglas de impresión son una cuestión de configuración, no de licencia.

4.2 Qué complementos necesita realmente

Cuatro se licencian por separado, y la lista es lo suficientemente corta como para memorizarla: Annotation, Converter, DICOM y Search. La conversión — de DOC a PDF y el resto — corresponde al complemento Converter. La búsqueda de texto corresponde al complemento Search. Si no necesita ninguno de los dos, no los adquiere.

4.3 Localización

Si su aplicación es multilingüe, verifique qué cadenas de UI del visor ofrece la versión instalada antes de diseñar alrededor de ellas.

Por qué esto importa: el visor debe parecer parte de su producto. Lo que no debe hacer es prometer silenciosamente a sus usuarios capacidades que la licencia que compró no incluye.


5. Probar la integración con todos los formatos compatibles

Antes de lanzar, realice una rápida verificación de sanidad para cada tipo de archivo que espera que sus usuarios visualicen. Usando el visor de la aplicación Doconut, abra un archivo de muestra de cada formato y verifique que la renderización, la navegación y cualquier herramienta especializada funcionen como se describe.

FormatoEscenario de pruebaResultado esperado
PDFInforme grande, multipágina con imágenes incrustadasDesplazamiento fluido, zoom y renderizado de color preciso
DOCXDocumento Word con tablas y notas al pieTodo el texto, tablas y notas al pie visibles; sin cambios de diseño
XLSXHoja de cálculo con gráficosLos gráficos se renderizan como vectores; el zoom mantiene la claridad
PPTXPresentación con animaciones de construcciónCada construcción en una diapositiva se muestra apilada en un fotograma — es lo esperado, no un error
DWGDibujo técnico con capas y referencias externasAlternar capas, medición de distancia y área funciona; las referencias externas y fuentes SHX están ausentes porque nunca estuvieron en el archivo
PSDArchivo Photoshop con capasSe muestra el compuesto guardado, con capas ocultas permaneciendo ocultas; los colores se conservan al hacer zoom
SVGGráfico vectorial con degradadosLos degradados se renderizan suavemente; el zoom se mantiene nítido
TIFFEscaneo de alta resoluciónLa imagen se carga rápidamente; el zoom revela detalles

Pruebe con los archivos reales de sus usuarios, no solo con muestras limpias. Los formatos que sorprenden a la gente son los que tienen peculiaridades propias — un DWG que referencia a cuatro dibujos, una hoja de cálculo cuyos valores almacenados nunca se recalculan, una presentación cuyas fuentes no están incrustadas. El visor gratuito en Doconut.app utiliza el mismo motor, por lo que es una forma rápida de ver cómo sale un archivo complicado antes de escribir código.

Conclusión

Incorporar un visor de documentos sin complementos se reduce a cuatro cosas: instalar el SDK, asegurar tu propia ruta de carga, renderizar en un contenedor de tu página y configurar solo lo que la versión instalada documenta. La contribución del visor a la seguridad es limitada y real — funciona en tus servidores y no envía nada. Todo lo demás en esa lista corresponde a tu aplicación, y ningún SDK puede hacerse cargo por ti.

¿Listo para evaluarlo? Comienza con la página oficial de descarga y documentación de Doconut, luego prueba el SDK dentro de la misma revisión de seguridad aplicada al resto de tu aplicación ASP.NET basada en Windows.