USO DE IRONXL

Cómo ver Excel en ASP.NET

Chaknith Bin
Chaknith Bin
27 de junio, 2023
Actualizado 31 de marzo, 2024
Compartir:

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

¿Qué es IronXL?

IronXL es una potente 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 necesidad de que Microsoft Excel esté instalado en su 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 completa para operaciones Excel en .NET. Es perfecto para gestionar los requisitos de fuentes de datos y hojas de cálculo de sus aplicaciones ASP.NET MVC. La biblioteca IronXL se utilizará para visualizar archivos Excel en aplicaciones web ASP.NET.

Requisitos previos

  • Conocimientos básicos de ASP.NET MVC
  • Visual Studio instalado en su equipo
  • Instalé la biblioteca IronXL. Puedes encontrar la guía de instalación en su documentación oficial.

Primeros pasos

En primer lugar, vamos a crear un nuevo proyecto ASP.NET MVC en Visual Studio.

  1. Abre Visual Studio.

  2. Haga clic en Archivo > Nuevo > Proyecto.

  3. En la ventana del nuevo proyecto, elija la plantilla ASP.NET Web Application (.NET Framework).

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

    Crear una nueva aplicación web ASP.NET en Visual Studio

  4. Nombre su proyecto ExcelViewer, seleccione la ubicación del proyecto y haga clic en el botón Crear.

    Cómo ver Excel en ASP.NET, Figura 2: Configure su proyecto

    Configure su proyecto

    Este artículo se centrará en la implementación de 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 Excel (como .xls, .xlsx y .csv), IronXL ofrece características integrales para cargar documentos Excel, leer, escribir e incluso modificar datos de Excel. Admite fórmulas, imágenes, formatos y mucho más.

  1. Haz clic derecho en tu proyecto en Solution Explorer y navega a Manage NuGet Packages**.

  2. En el Administrador de paquetes NuGet, busque 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 de NuGet Package Manager

    Busque e instale el paquete IronXL en el Administrador de paquetes de NuGet

    También puede instalar IronXL utilizando 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.

Construir modelos

ExcelModel

El primer paso consiste en crear un modelo para los datos de Excel. La clase ExcelModel representará una hoja de Excel única 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; }
        public List<string []> Data { get; set; }
    }
}
namespace Excel_File_Viewer_IronXL.Models
{
    public class ExcelModel
    {
        public string SheetName { get; set; }
        public List<string []> Data { get; set; }
    }
}
Namespace Excel_File_Viewer_IronXL.Models
	Public Class ExcelModel
		Public Property SheetName() As String
		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 que contiene el nombre de cada hoja de Excel. Data es una lista de matrices de cadenas para almacenar los datos de cada fila en la hoja de Excel.

ExcelViewModel

A continuación, creemos 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; }
        public string Message { get; set; }
        public List<ExcelModel> ExcelData { get; set; }
    }
}
using Microsoft.AspNetCore.Http;
using System.Collections.Generic;

namespace Excel_File_Viewer_IronXL.Models
{
    public class ExcelViewModel
    {
        public IFormFile File { get; set; }
        public string Message { get; set; }
        public List<ExcelModel> ExcelData { get; set; }
    }
}
Imports Microsoft.AspNetCore.Http
Imports System.Collections.Generic

Namespace Excel_File_Viewer_IronXL.Models
	Public Class ExcelViewModel
		Public Property File() As IFormFile
		Public Property Message() As String
		Public Property ExcelData() As List(Of ExcelModel)
	End Class
End Namespace
$vbLabelText   $csharpLabel

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

5. Cree ExcelController para cargar archivos 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, recorren las hojas de cálculo, extraen los datos y los 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
        string filePath = Server.MapPath("~/App_Data/Test.xlsx"); 

    // Replace 'Test.xlsx' with your file name

        List<ExcelModel> data = new List<ExcelModel>();

        try
        {
            // Load workbook directly from a file path
            var workbook = WorkBook.Load(filePath);
            foreach (var worksheet in workbook.WorkSheets)
            {
                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
        string filePath = Server.MapPath("~/App_Data/Test.xlsx"); 

    // Replace 'Test.xlsx' with your file name

        List<ExcelModel> data = new List<ExcelModel>();

        try
        {
            // Load workbook directly from a file path
            var workbook = WorkBook.Load(filePath);
            foreach (var worksheet in workbook.WorkSheets)
            {
                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
		Dim filePath As String = Server.MapPath("~/App_Data/Test.xlsx")

	' Replace 'Test.xlsx' with your file name

		Dim data As New List(Of ExcelModel)()

		Try
			' Load workbook directly from a file path
			Dim workbook = WorkBook.Load(filePath)
			For Each worksheet In workbook.WorkSheets
				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 se añade a la lista ExcelData en el ExcelViewModel.

Se van a cargar y visualizar los datos del siguiente fichero Excel:

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

El archivo Excel de muestra

6. Crear la vista

En su directorio Views/Excel, cree un nuevo archivo HTML Index.cshtml para mostrar datos de Excel. Luego, utiliza nav-tabs de Bootstrap para representar cada hoja en el archivo 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 Excel. El contenido de la pestaña correspondiente mostrará los datos de la hoja respectiva en formato de tabla. Realizando algunos cambios, se añade un botón de exploración para seleccionar manualmente el archivo Excel.

Ejecución del programa

Una vez que hayas seguido todos los pasos y configurado el proyecto correctamente, es hora de ejecutarlo. Debería ver una página web con pestañas con los nombres de las hojas de su archivo Excel. Al hacer clic en una pestaña, se mostrarán los datos de la hoja correspondiente 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 ASP.NET usando IronXL! Esta potente biblioteca permite a los usuarios trabajar con archivos Excel de forma más eficaz y manejable. Con la ayuda de IronXL, trabajar con archivos Excel nunca ha sido tan fácil en el entorno .NET.

IronXL proporciona una prueba gratuita, permitiéndote explorar y comprender su amplia 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 $749.

Chaknith Bin
Ingeniero de software
Chaknith trabaja en IronXL e IronBarcode. Tiene una gran experiencia en C# y .NET, ayudando a mejorar el software y a apoyar a los clientes. Sus conocimientos de las interacciones con los usuarios contribuyen a mejorar los productos, la documentación y la experiencia general.
< ANTERIOR
Cómo convertir archivos XLS a XLSX en C#
SIGUIENTE >
Cómo escribir datos en un archivo CSV en C#