Comment puis-je télécharger des fichiers Excel à distance à l'aide d'Ajax dans MVC sans rechargement de page?

Téléchargement de fichiers Excel distant dans MVC à l'aide d'Ajax: une approche transparente

Gestion des formes étendues dans MVC nécessite souvent de générer des fichiers Excel à partir de données de formulaire spécifiques. Cet article montre comment réaliser cette efficacité à l'aide de l'AJAX, en évitant les rafraîchissements de page complets.

Le défi de téléchargement du fichier Ajax

Le téléchargement directement des fichiers via Ajax n'est pas possible. Nous avons besoin d'une solution de contournement.

La solution: génération de fichiers côté serveur et transfert de données AJAX

La solution consiste à utiliser AJAX pour envoyer des données de formulaire au serveur. Le code côté serveur (par exemple, à l'aide d'Epplus ou NPOI) crée le fichier Excel. Le fichier est ensuite stocké temporairement sous forme de tableau d'octets et une référence est renvoyée au client. Une redirection ultérieure déclenche le téléchargement réel.

Entreposage du tableau d'octets et passage de référence

Le fichier Excel généré est stocké sous forme de tableau d'octets dans le conteneur tempdata, identifié par une référence unique. Cette référence (avec le nom de fichier) est renvoyée sous forme de JSON à la fonction AJAX. La fonction ajax redirige ensuite vers une action de contrôleur distincte pour récupérer le fichier à partir de tempdata et lancer le téléchargement.

Implémentation étape par étape

1. Action du contrôleur pour la génération de fichiers:

Cette action reçoit les données de formulaire, génère le fichier Excel à l'aide d'une bibliothèque comme Epplus, les stocke en tempdata sous forme de tableau d'octets et renvoie un objet JSON contenant un identifiant unique et le nom de fichier.

<code class="language-csharp">public ActionResult PostReportPartial(ReportVM model)
{
    // Generate Excel file using EPPlus or NPOI
    ExcelPackage workbook = new ExcelPackage();
    // ... file generation logic ...

    // Store file in TempData
    string handle = Guid.NewGuid().ToString();
    TempData[handle] = workbook.GetAsByteArray();

    return Json(new { FileGuid = handle, Filename = "ReportOutput.xlsx" });
}</code>

2. Appel et redirection ajax:

L'appel AJAX envoie les données de formulaire à l'action PostReportPartial. Après une réponse réussie, il redirige vers une autre action du contrôleur pour gérer le téléchargement.

<code class="language-javascript">$.ajax({
    // ... AJAX settings ...
    success: function (response) {
        window.location = '/Report/Download?fileGuid=' + response.FileGuid + '&filename=' + response.Filename;
    }
});</code>

3. Action du contrôleur pour le téléchargement de fichiers:

Cette action récupère le fichier de tempdata à l'aide de l'identifiant unique et l'envoie au client pour télécharger.

<code class="language-csharp">[HttpGet]
public ActionResult Download(string fileGuid, string fileName)
{
    if (TempData[fileGuid] != null)
    {
        byte[] data = TempData[fileGuid] as byte[];
        return File(data, "application/vnd.ms-excel", fileName);
    }
    else
    {
        return new EmptyResult();
    }
}</code>

Cette méthode garantit des téléchargements de fichiers Excel efficaces et conviviaux sans rechargement de page, tirant parti du traitement côté serveur pour des performances optimales. Aucun fichier physique n'est stocké en permanence sur le serveur.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!