Wie man zu CSV in Blazor exportiert

Einrichten Ihres Blazor-Projekts

Um zu beginnen, müssen Sie ein neues Blazor-Server-Projekt erstellen. Öffnen Sie Visual Studio, erstellen Sie ein neues Projekt und wählen Sie die Vorlage "Blazor Server App" aus. Benennen Sie Ihr Projekt und klicken Sie auf "Erstellen".

Sobald Ihr Projekt erstellt ist, öffnen Sie den Seitenordner und suchen Sie die Datei Index.razor. Hier werden die Blazor-Komponenten hinzugefügt und codiert, um Datei-Uploads und -Konvertierungen zu handhaben.

Installation von IronXL

Bevor Sie mit dem Schreiben von Code beginnen, ist es notwendig, die IronXL-Bibliothek zu installieren. Öffnen Sie die Paket-Manager-Konsole in Visual Studio und führen Sie den folgenden Befehl aus:

Install-Package IronXL.Excel

Dieser Befehl wird die IronXL-Bibliothek in Ihrem Blazor-Projekt installieren. Jetzt sind Sie bereit, mit dem Schreiben von Code zu beginnen!

Erstellen der Datei-Upload-Komponente

Erstellen Sie zunächst eine grundlegende Datei-Upload-Komponente, die es Benutzern ermöglicht, eine vorhandene Excel-Datei hochzuladen. Anschließend wird die InputFile-Komponente aus dem Microsoft.AspNetCore.Components.Forms-Namensraum hinzugefügt. Fügen Sie folgenden Code in Ihre Index.razor-Datei ein, unterhalb der "@page """ Zeile:

@using Microsoft.AspNetCore.Components.Forms
@using IronXL
@using System.IO
@using System.Threading.Tasks

<div class="container">
    <h3>File Upload</h3>

    <InputFile class="button" OnChange="@OnInputFileChange" accept=".xls,.xlsx,.xlsm,.xltx,.csv,.tsv" />
    <h3>Selected File: @originalFileName</h3>
    <h3 style="color:bisque">Is File converted: <span>@message</span></h3>
</div>

Dieser Code richtet die Datei-Upload-Komponente ein, komplett mit einem Button und einem Nachrichtenbereich zur Anzeige des Status der Dateikonvertierung. Das accept-Attribut an der InputFile-Komponente gibt die akzeptierten Dateiformate an.

Schreiben des Dateikonvertierungscodes

Nun schreiben wir den Code, der den Datei-Upload und die Konvertierung handhabt. Eine Kombination aus IronXL, Blazor und C# wird verwendet, um diese Aufgabe zu bewältigen. Sie können IronXL verwenden, um eine CSV- in eine Excel-Datei zu konvertieren.

Fügen Sie den folgenden Code in Ihre Index.razor-Datei ein, unterhalb des div-Elements, das Sie zuvor hinzugefügt haben.

@code {
    private string originalFileName;
    private string message = "";

    private async Task OnInputFileChange(InputFileChangeEventArgs e)
    {
        var file = e.File;
        originalFileName = file.Name;

        try
        {
            // Read the uploaded file into a memory stream
            using var memoryStream = new MemoryStream();
            await file.OpenReadStream().CopyToAsync(memoryStream);

            // Load the workbook using IronXL
            WorkBook workBook = WorkBook.Load(memoryStream);

            // Save the workbook as a CSV file
            string outputPath = "sample.csv";
            workBook.SaveAsCsv(outputPath);

            message = "Conversion completed!";
        }
        catch (Exception ex)
        {
            message = $"An error occurred: {ex.Message}";
        }
    }
}

Dieser Code definiert eine private Methode namens OnInputFileChange, die ausgelöst wird, wenn ein Excel-Tabellenblatt mit der InputFile-Komponente hochgeladen wird. Excel kann im XLS- oder XLSX-Format vorliegen. Der Code liest die hochgeladene einfache Excel-Datei, lädt sie in ein WorkBook-Objekt und speichert dann das WorkBook als CSV-Datei. Der Status der Konvertierung wird im Nachrichtenbereich auf der Seite angezeigt.

Code-Zerlegung

Sehen Sie sich zunächst den gesamten Code an:

@page "/"
@using Microsoft.AspNetCore.Components.Forms
@using IronXL
@using System.IO
@using System.Threading.Tasks

<style>
    body{
        background-color: skyblue
    }
    .container {
        max-width: 800px;
        margin: 0 auto;
        font-family: Arial, sans-serif;
    }

    h3 {
        margin-top: 30px;
        font-size: 30px;
        margin-bottom: 30px;
    }

    .button {
        background-color: #4CAF50;
        border: none;
        color: white;
        padding: 15px 32px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: 15px 0;
        cursor: pointer;
    }
    span {
        font-size: 20px;
    }
</style>

<div class="container">
    <h3>File Upload</h3>

    <InputFile class="button" OnChange="@OnInputFileChange" accept=".xls,.xlsx,.xlsm,.xltx,.csv,.tsv" />
    <h3>Selected File: @originalFileName</h3>
    <h3 style="color:bisque">Is File converted: <span>@message</span></h3>
</div>

@code {
    private string originalFileName;
    private string message = "";

    private async Task OnInputFileChange(InputFileChangeEventArgs e)
    {
        var file = e.File;
        originalFileName = file.Name;

        try
        {
            // Read the uploaded file into a memory stream
            using var memoryStream = new MemoryStream();
            await file.OpenReadStream().CopyToAsync(memoryStream);

            // Load the workbook using IronXL
            WorkBook workBook = WorkBook.Load(memoryStream);

            // Save the workbook as a CSV file
            string outputPath = "sample.csv";
            workBook.SaveAsCsv(outputPath);

            message = "Conversion completed!";
        }
        catch (Exception ex)
        {
            message = $"An error occurred: {ex.Message}";
        }
    }
}

Brechen wir den Code weiter herunter:

1. Wenn eine Datei hochgeladen wird, wird die OnInputFileChange-Methode ausgelöst und ein InputFileChangeEventArgs-Objekt wird an sie übergeben. Dieses Objekt enthält Informationen über die hochgeladene Datei, wie z. B. ihren Namen und ihre Größe.
2. Speichern Sie den ursprünglichen Dateinamen in einer Variablen namens originalFileName, um ihn auf der Seite anzuzeigen.
3. Erstellen Sie innerhalb eines Try-Catch-Blocks ein neues MemoryStream-Objekt, um die Inhalte der hochgeladenen Datei zu lesen. Die Using-Anweisung stellt sicher, dass der Speicherstrom ordnungsgemäß freigegeben wird, sobald er nicht mehr benötigt wird.
4. Verwenden Sie das Schlüsselwort await, um die Inhalte der hochgeladenen Datei asynchron in den Speicherstrom zu kopieren. Dies stellt sicher, dass diese Anwendung während des Lesens der Datei reaktionsfähig bleibt.
5. Als Nächstes wird die WorkBook.Load-Methode verwendet, um die Inhalte des Speicherstroms in ein WorkBook-Objekt zu laden. Dieses Objekt repräsentiert das gesamte Excel-Arbeitsbuch, einschließlich seiner Blätter, Zellen und Daten.
6. Geben Sie dann einen Ausgabedateinamen für die konvertierte CSV-Datei an. In diesem Fall verwenden wir den Namen "sample.csv".
7. Die SaveAsCsv-Methode des WorkBook-Objekts wird dann verwendet, um das Arbeitsbuch als CSV-Datei mit dem angegebenen Ausgabedateinamen zu speichern.
8. Wenn die Konvertierung erfolgreich ist, wird eine Nachricht angezeigt, die darauf hinweist, dass die Konvertierung abgeschlossen ist. Wenn ein Fehler auftritt, fangen Sie die Ausnahme ab und zeigen Sie eine Fehlermeldung an.

Testen der Anwendung

Jetzt, da die Blazor-Anwendung vollständig ist, ist es Zeit, sie zu testen! Drücken Sie F5, um Ihre Anwendung in Visual Studio auszuführen. Sobald die Anwendung gestartet ist, sollten Sie einen Datei-Upload-Button auf der Seite sehen.

Führen Sie die Blazor-Anwendung aus

Klicken Sie auf den Button und wählen Sie eine Excel-Datei zum Hochladen aus. Die akzeptierten Dateiformate sind im accept-Attribut der InputFile-Komponente aufgelistet.

Eine Excel-Datei auswählen

Nachdem Sie eine Datei ausgewählt haben, wird die Anwendung die Datei lesen, sie mit IronXL in ein CSV-Format konvertieren und die konvertierte Datei unter dem angegebenen Ausgabedateinamen speichern. Sie sollten eine Nachricht sehen, die den Status der Konvertierung sowie den ursprünglichen Dateinamen anzeigt.

Konvertierungsstatus

Herzlichen Glückwunsch! Sie haben erfolgreich eine Blazor-Anwendung erstellt, die Excel-Dateien mithilfe von IronXL in das CSV-Format exportieren kann. Der folgende Screenshot zeigt die Ausgabe des obigen Programms.

Die ausgegebene Excel-Datei