Ícono de mensaje
Saltar al pie de página
  1. IronXL
  2. Blog de IronXL
  3. Usando IronXL
  4. Visor de Excel de ASP.NET
USANDO IRONXL

Cómo ver Excel en ASP.NET

Jordi Bardia
Jordi Bardia
Actualizado:

Este tutorial completo demostrará cómo construir un visor de Excel utilizando ASP.NET MVC e IronXL. Este visor permitirá a los usuarios mostrar, editar y navegar por archivos de Excel directamente desde su página web.

¿Qué es IronXL?

IronXL es una poderosa biblioteca .NET que ofrece una multitud de funcionalidades relacionadas con las operaciones de Excel. Ofrece una API simplificada que permite a los desarrolladores de .NET escribir, manipular y leer documentos de Excel en varios formatos de archivo, incluidos XLS, XLSX, CSV y más.

Con IronXL, puedes leer archivos de Excel, extraer datos, agregar o editar hojas de trabajo, crear o modificar filas y columnas, aplicar fórmulas, guardar cambios, y mucho más. Todas estas operaciones pueden realizarse sin la necesidad de tener Microsoft Excel instalado en tu máquina.

IronXL es compatible con imágenes, estilos, formato condicional y otras características complejas de Excel, lo que lo convierte en una solución integral para operaciones de Excel en .NET. Es perfecto para manejar requisitos de fuentes de datos y hojas de cálculo en tus aplicaciones ASP.NET MVC. La biblioteca IronXL se utilizará para ver archivos de Excel en aplicaciones web de ASP.NET.

Requisitos previos

  • Comprensión básica de ASP.NET MVC
  • Visual Studio instalado en tu máquina
  • Instalado la biblioteca IronXL. Puedes encontrar la guía de instalación en su documentación oficial.

Empezando

Primero, vamos a crear un nuevo proyecto ASP.NET MVC en Visual Studio.

  1. Abre Visual Studio.
  2. Haz clic en Archivo > Nuevo > Proyecto.
  3. En la ventana de nuevo proyecto, elige la plantilla Aplicación web ASP.NET (.NET Framework).

Cómo ver Excel en ASP.NET, Figura 1: Crear una nueva aplicación web de ASP.NET en Visual Studio Crea una nueva aplicación web de ASP.NET en Visual Studio

  1. Nombra tu proyecto ExcelViewer, selecciona la ubicación del proyecto y haz clic en el botón Crear.

Cómo ver Excel en ASP.NET, Figura 2: Configurar tu proyecto Configurar tu proyecto

Este artículo se centrará en implementar la funcionalidad del visor de Excel en esta aplicación ASP.NET MVC.

Cómo añadir IronXL a su proyecto

Para manejar formatos de archivos de Excel (como .xls, .xlsx y .csv), IronXL ofrece características completas para cargar documentos de Excel, leer, escribir e incluso modificar datos de Excel. Es compatible con fórmulas, imágenes, formato, y mucho más.

  1. Haz clic derecho en tu proyecto en el Explorador de Soluciones, y navega a Administrar paquetes NuGet.
  2. En el Administrador de paquetes NuGet, busca IronXL.Excel.
  3. Haz clic en Instalar para agregarlo a tu proyecto.

Cómo ver Excel en ASP.NET, Figura 3: Buscar e instalar el paquete IronXL en la interfaz de usuario del Administrador de paquetes NuGet Buscar e instalar el paquete IronXL en la interfaz de usuario del administrador de paquetes NuGet

También puedes instalar IronXL usando la Consola del Administrador de Paquetes con el siguiente comando:

Install-Package IronXL.Excel

Cómo ver Excel en ASP.NET, Figura 4: Instalar el paquete IronXL desde la Consola del Administrador de Paquetes Instala el paquete IronXL desde la Consola del Administrador de Paquetes

Ahora que IronXL está instalado, pasemos al siguiente paso.

Modelos de construcción

ExcelModel

El primer paso es crear un modelo para los datos de Excel. La clase ExcelModel representará una sola hoja de Excel y contendrá el nombre de la hoja y los datos presentes en la hoja de Excel.

namespace Excel_File_Viewer_IronXL.Models
{
    public class ExcelModel
    {
        public string SheetName { get; set; }

        // Data is a list of string arrays, each array represents a row in the sheet.
        public List<string[]> Data { get; set; }
    }
}
namespace Excel_File_Viewer_IronXL.Models
{
    public class ExcelModel
    {
        public string SheetName { get; set; }

        // Data is a list of string arrays, each array represents a row in the sheet.
        public List<string[]> Data { get; set; }
    }
}
Namespace Excel_File_Viewer_IronXL.Models
	Public Class ExcelModel
		Public Property SheetName() As String

		' Data is a list of string arrays, each array represents a row in the sheet.
		Public Property Data() As List(Of String())
	End Class
End Namespace
$vbLabelText   $csharpLabel

El ExcelModel se define con dos propiedades, SheetName y Data. SheetName es una cadena simple para almacenar el nombre de cada hoja de Excel. Data es una lista de arreglos de cadenas para almacenar los datos de cada fila en la hoja de Excel.

ExcelViewModel

A continuación, vamos a crear ExcelViewModel. Este modelo es un contenedor que contiene un archivo, un mensaje, y una lista de ExcelModel que representa los datos de todas las hojas en el archivo.

using Microsoft.AspNetCore.Http;
using System.Collections.Generic;

namespace Excel_File_Viewer_IronXL.Models
{
    public class ExcelViewModel
    {
        public IFormFile File { get; set; }  // For uploading Excel file
        public string Message { get; set; }  // Message for storing success/error messages
        public List<ExcelModel> ExcelData { get; set; }  // List to store data from all sheets
    }
}
using Microsoft.AspNetCore.Http;
using System.Collections.Generic;

namespace Excel_File_Viewer_IronXL.Models
{
    public class ExcelViewModel
    {
        public IFormFile File { get; set; }  // For uploading Excel file
        public string Message { get; set; }  // Message for storing success/error messages
        public List<ExcelModel> ExcelData { get; set; }  // List to store data from all sheets
    }
}
Imports Microsoft.AspNetCore.Http
Imports System.Collections.Generic

Namespace Excel_File_Viewer_IronXL.Models
	Public Class ExcelViewModel
		Public Property File() As IFormFile ' -  For uploading Excel file
		Public Property Message() As String ' -  Message for storing success/error messages
		Public Property ExcelData() As List(Of ExcelModel) ' -  List to store data from all sheets
	End Class
End Namespace
$vbLabelText   $csharpLabel

Esta clase se utilizará como el modelo de vista. Tiene una propiedad IFormFile para la carga de archivos, una cadena de Message para mostrar cualquier mensaje, y una List<ExcelModel> para almacenar los datos de Excel recuperados.

5. Cree ExcelController para cargar archivos de Excel para la extracción de datos

Luego crea un nuevo ExcelController. ¡Aquí es donde ocurre la magia! Los archivos de Excel se cargan utilizando la función WorkBook.Load de IronXL, se recorren las hojas de trabajo, se extraen los datos y se añaden al ExcelViewModel.

using Excel_File_Viewer_IronXL.Models;
using IronXL;
using System.Collections.Generic;
using System.Web.Mvc;
using System;
using System.Linq;

public class ExcelController : Controller
{
    // GET: Excel
    public ActionResult Index()
    {
        var model = new ExcelViewModel();

        // Define the file path for the Excel file
        string filePath = Server.MapPath("~/App_Data/Test.xlsx"); 

        // List to store data for each sheet
        List<ExcelModel> data = new List<ExcelModel>();

        try
        {
            // Load workbook directly from a file path
            var workbook = WorkBook.Load(filePath);

            // Loop through all worksheets in the workbook
            foreach (var worksheet in workbook.WorkSheets)
            {
                // Add each worksheet's name and data to the data list
                data.Add(new ExcelModel
                {
                    SheetName = worksheet.Name,
                    Data = worksheet.Rows.Select(r => r.ToArray().Select(c => c.Value.ToString()).ToArray()).ToList()
                });
            }

            model.ExcelData = data;
            model.Message = "File processed successfully!";
        }
        catch (Exception ex)
        {
            model.Message = $"Error occurred while processing file: {ex.Message}";
        }

        return View(model);
    }
}
using Excel_File_Viewer_IronXL.Models;
using IronXL;
using System.Collections.Generic;
using System.Web.Mvc;
using System;
using System.Linq;

public class ExcelController : Controller
{
    // GET: Excel
    public ActionResult Index()
    {
        var model = new ExcelViewModel();

        // Define the file path for the Excel file
        string filePath = Server.MapPath("~/App_Data/Test.xlsx"); 

        // List to store data for each sheet
        List<ExcelModel> data = new List<ExcelModel>();

        try
        {
            // Load workbook directly from a file path
            var workbook = WorkBook.Load(filePath);

            // Loop through all worksheets in the workbook
            foreach (var worksheet in workbook.WorkSheets)
            {
                // Add each worksheet's name and data to the data list
                data.Add(new ExcelModel
                {
                    SheetName = worksheet.Name,
                    Data = worksheet.Rows.Select(r => r.ToArray().Select(c => c.Value.ToString()).ToArray()).ToList()
                });
            }

            model.ExcelData = data;
            model.Message = "File processed successfully!";
        }
        catch (Exception ex)
        {
            model.Message = $"Error occurred while processing file: {ex.Message}";
        }

        return View(model);
    }
}
Imports Excel_File_Viewer_IronXL.Models
Imports IronXL
Imports System.Collections.Generic
Imports System.Web.Mvc
Imports System
Imports System.Linq

Public Class ExcelController
	Inherits Controller

	' GET: Excel
	Public Function Index() As ActionResult
		Dim model = New ExcelViewModel()

		' Define the file path for the Excel file
		Dim filePath As String = Server.MapPath("~/App_Data/Test.xlsx")

		' List to store data for each sheet
		Dim data As New List(Of ExcelModel)()

		Try
			' Load workbook directly from a file path
			Dim workbook = WorkBook.Load(filePath)

			' Loop through all worksheets in the workbook
			For Each worksheet In workbook.WorkSheets
				' Add each worksheet's name and data to the data list
				data.Add(New ExcelModel With {
					.SheetName = worksheet.Name,
					.Data = worksheet.Rows.Select(Function(r) r.ToArray().Select(Function(c) c.Value.ToString()).ToArray()).ToList()
				})
			Next worksheet

			model.ExcelData = data
			model.Message = "File processed successfully!"
		Catch ex As Exception
			model.Message = $"Error occurred while processing file: {ex.Message}"
		End Try

		Return View(model)
	End Function
End Class
$vbLabelText   $csharpLabel

Aquí, inicializa un ExcelViewModel y luego carga el WorkBook usando IronXL, recorre cada WorkSheet, y para cada WorkSheet, creamos un ExcelModel con el nombre y los datos de la hoja de trabajo. El ExcelModel luego se añade a la lista ExcelData en el ExcelViewModel.

Se va a cargar y mostrar los datos del siguiente archivo de Excel:

Cómo ver Excel en ASP.NET, Figura 5: El archivo de Excel de muestra El archivo de Excel de muestra

6. Crear la vista

En tu directorio Views/Excel, crea un nuevo archivo HTML Index.cshtml para mostrar los datos de Excel. Luego usa nav-tabs de Bootstrap para representar cada hoja en el archivo de Excel. Cada hoja será una pestaña separada, y el contenido de la pestaña será los datos de la hoja.

@model Excel_File_Viewer_IronXL.Models.ExcelViewModel

@{
    ViewBag.Title = "Index";
}

<h2>Excel File Viewer</h2>

@if (Model.ExcelData != null)
{
    <ul class="nav nav-tabs" id="myTab" role="tablist">
        @for (int i = 0; i < Model.ExcelData.Count; i++)
        {
            <li class="nav-item">
                <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href="#content-@i" role="tab" aria-controls="content-@i" aria-selected="@(i == 0)">
                    @Model.ExcelData[i].SheetName
                </a>
            </li>
        }
    </ul>
    <div class="tab-content" id="myTabContent">
        @for (int i = 0; i < Model.ExcelData.Count; i++)
        {
            <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role="tabpanel" aria-labelledby="tab-@i">
                <table class="table table-bordered">
                    @foreach (var row in Model.ExcelData[i].Data)
                    {
                        <tr>
                            @foreach (var cell in row)
                            {
                                <td>@cell</td>
                            }
                        </tr>
                    }
                </table>
            </div>
        }
    </div>
}
@model Excel_File_Viewer_IronXL.Models.ExcelViewModel

@{
    ViewBag.Title = "Index";
}

<h2>Excel File Viewer</h2>

@if (Model.ExcelData != null)
{
    <ul class="nav nav-tabs" id="myTab" role="tablist">
        @for (int i = 0; i < Model.ExcelData.Count; i++)
        {
            <li class="nav-item">
                <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href="#content-@i" role="tab" aria-controls="content-@i" aria-selected="@(i == 0)">
                    @Model.ExcelData[i].SheetName
                </a>
            </li>
        }
    </ul>
    <div class="tab-content" id="myTabContent">
        @for (int i = 0; i < Model.ExcelData.Count; i++)
        {
            <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role="tabpanel" aria-labelledby="tab-@i">
                <table class="table table-bordered">
                    @foreach (var row in Model.ExcelData[i].Data)
                    {
                        <tr>
                            @foreach (var cell in row)
                            {
                                <td>@cell</td>
                            }
                        </tr>
                    }
                </table>
            </div>
        }
    </div>
}
model ReadOnly Property () As Excel_File_Viewer_IronXL.Models.ExcelViewModel
	ViewBag.Title = "Index"
End Property

'INSTANT VB TODO TASK: The following line could not be converted:
(Of h2) Excel File Viewer</h2> [if](Model.ExcelData != Nothing)
If True Then
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <ul class="nav nav-tabs" id="myTab" role="tablist"> for(int i = 0; i < Model.ExcelData.Count; i++)
	"myTab" role="tablist"> [for](Integer i = 0; i < Model.ExcelData.Count; i)
		If True Then
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <ul class="nav nav-tabs" id="myTab" role
	"nav nav-tabs" id="myTab" role
	<ul class="nav nav-tabs" id
	i += 1
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href="#content-@i" role="tab" aria-controls="content-@i" aria-selected="@(i == 0)"> @Model.ExcelData[i].SheetName </a> </li>
			"content-@i" aria-selected="@(i == 0)"> Model.ExcelData(i).SheetName </a> </li>
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href="#content-@i" role="tab" aria-controls="content-@i" aria-selected
			"tab" aria-controls="content-@i" aria-selected
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href="#content-@i" role="tab" aria-controls
			"#content-@i" role="tab" aria-controls
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href="#content-@i" role
			"tab" href="#content-@i" role
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href
			"tab-@i" data-toggle="tab" href
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle
			"nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id
			"nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id
			<li class="nav-item"> <a class
		End If
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: </ul> <div class="tab-content" id="myTabContent"> for(int i = 0; i < Model.ExcelData.Count; i++)
	"tab-content" id="myTabContent"> [for](Integer i = 0; i < Model.ExcelData.Count; i)
		If True Then
	</ul> <div class="tab-content" id
	i += 1
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role="tabpanel" aria-labelledby="tab-@i"> <table class="table table-bordered"> foreach(var row in Model.ExcelData[i].Data)
			"tab-@i"> <table class="table table-bordered"> foreach(var row in Model.ExcelData(i).Data)
					If True Then
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role="tabpanel" aria-labelledby="tab-@i"> <table class
			"tabpanel" aria-labelledby="tab-@i"> <table class
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role="tabpanel" aria-labelledby
			"content-@i" role="tabpanel" aria-labelledby
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role
			"tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role
			<div class="tab-pane fade @(i == 0 ? "show active" : "")" id
'INSTANT VB TODO TASK: Local functions are not converted by Instant VB:
'						(Of tr) @foreach(var cell in row)
'							{
'								<td> @cell</td>
'							}
						</tr>
					End If
				</table> </div>
		End If
	</div>
End If
$vbLabelText   $csharpLabel

En este ejemplo de código, nav nav-tabs generará una lista de pestañas, cada una representando una hoja del archivo de Excel. El contenido correspondiente de la pestaña mostrará los datos de la hoja respectiva en formato de tabla. Haciendo algunos cambios, se añade un botón de examinar para seleccionar el archivo de Excel manualmente.

Ejecutando el programa

Después de haber seguido todos los pasos y configurado el proyecto correctamente, es hora de ejecutarlo. Deberías ver una página web con pestañas nombradas según los nombres de las hojas en tu archivo de Excel. Hacer clic en una pestaña mostrará los datos de la hoja respectiva en formato de tabla.

Cómo ver Excel en ASP.NET, Figura 6: El visor de Excel El visor de Excel

Conclusión

¡Acabas de crear un visor de Excel en ASP.NET usando IronXL! Esta potente biblioteca permite a los usuarios trabajar con archivos de Excel de una manera más eficiente y manejable. Con la ayuda de IronXL, manejar archivos de Excel nunca ha sido tan fácil en el entorno .NET.

IronXL proporciona una prueba gratuita, permitiéndote explorar y entender su vasta funcionalidad sin ningún costo inicial. Una vez que lo hayas probado y encontrado que es la solución perfecta para tus necesidades, la licencia comienza desde $799.

Preguntas Frecuentes

¿Cómo puedo crear un visor de Excel usando ASP.NET MVC?

Puedes crear un visor de Excel usando ASP.NET MVC configurando un nuevo proyecto en Visual Studio y añadiendo la biblioteca IronXL a través del Administrador de Paquetes NuGet. Esto te permite cargar, mostrar y manipular archivos de Excel directamente en tu aplicación web.

¿Cuáles son los pasos para configurar un proyecto ASP.NET MVC para manejar archivos de Excel?

Para configurar un proyecto ASP.NET MVC para manejar archivos de Excel, abre Visual Studio, crea un nuevo proyecto de Aplicación Web ASP.NET e instala la biblioteca IronXL vía NuGet. Luego, implementa modelos como ExcelModel y ExcelViewModel para gestionar datos de Excel y usa el ExcelController para cargar y procesar archivos de Excel.

¿Puedo mostrar múltiples hojas de Excel en una aplicación ASP.NET?

Sí, puedes mostrar múltiples hojas de Excel en una aplicación ASP.NET usando IronXL para cargar el archivo de Excel y luego utilizar nav-tabs de Bootstrap para crear pestañas separadas para cada hoja, mostrando los datos en un formato de tabla.

¿Cómo cargo y proceso un archivo de Excel en ASP.NET usando una biblioteca .NET?

En ASP.NET, puedes cargar y procesar un archivo de Excel usando el método WorkBook.Load de IronXL. Este método te permite leer el archivo de Excel, iterar a través de sus hojas de trabajo y extraer los datos para mostrarlos o para una manipulación más profunda.

¿Cuáles son las ventajas de usar IronXL para operaciones de Excel en .NET?

IronXL ofrece varias ventajas para operaciones de Excel en .NET, incluyendo soporte para diversos formatos de archivos de Excel, la capacidad de manipular características complejas de Excel como imágenes y formato condicional, y el beneficio de no requerir la instalación de Microsoft Excel en el servidor.

¿Cómo puedo solucionar problemas comunes al crear un visor de Excel en ASP.NET?

Problemas comunes al crear un visor de Excel en ASP.NET se pueden solucionar asegurando que la biblioteca IronXL esté correctamente instalada a través de NuGet, verificando que todos los modelos y controladores necesarios estén implementados correctamente, y comprobando que los archivos de Excel estén en un formato compatible.

¿Es posible editar archivos de Excel directamente desde una página web ASP.NET?

Sí, es posible editar archivos de Excel directamente desde una página web ASP.NET usando IronXL. La biblioteca te permite cargar archivos de Excel en tu aplicación web, modificar datos y guardar los cambios de vuelta al archivo sin problemas.

¿IronXL admite tanto la lectura como la escritura de archivos de Excel?

Sí, IronXL admite tanto la lectura como la escritura de archivos de Excel. Puedes usarlo para leer datos de documentos de Excel existentes y escribir nuevos datos o cambios en archivos de Excel en múltiples formatos, incluyendo XLS, XLSX, y CSV.

¿Qué modelos se deben crear para gestionar datos de Excel en una aplicación ASP.NET MVC?

En una aplicación ASP.NET MVC, deberías crear modelos como ExcelModel para representar hojas de Excel individuales y ExcelViewModel para gestionar una colección de hojas y manejar la carga de archivos y mensajes.

¿Cómo puedo probar las características de IronXL antes de comprarlo?

Puedes probar las características de IronXL descargando la versión de prueba gratuita disponible en su sitio web. Esta prueba te permite explorar las capacidades de la biblioteca en el manejo de archivos de Excel dentro de tus aplicaciones .NET sin ningún costo inicial.

Jordi Bardia
Jordi Bardia
  Chatea con el equipo de ingeniería ahora
Ingeniero de Software
Jordi es más competente en Python, C# y C++. Cuando no está aprovechando sus habilidades en Iron Software, está programando juegos. Compartiendo responsabilidades para pruebas de productos, desarrollo de productos e investigación, Jordi agrega un valor inmenso a la mejora continua del producto. La experiencia variada lo mantiene ...
Leer más

Artículos Relacionados

Prueba de 30 días → Producto completo. Sin límites. Sin tarjeta. Comenzar prueba gratuita