Gestionnaire de fichiers ASP.NET MVC gratuit avec visionneuse PDF intégrée
← Back to Blog••6 min read

Gestionnaire de fichiers ASP.NET MVC gratuit avec visionneuse PDF intégrée

Créez un gestionnaire de fichiers ASP.NET MVC gratuit qui affiche les PDFs

Vous souhaitez une page qui répertorie les fichiers stockés sur le serveur, permet à l'utilisateur de les télécharger ou de les supprimer, et ouvre tout PDF dans le navigateur sans quitter le site. Le guide suivant vous montre comment faire exactement cela avec ASP.NET MVC simple, le cache de session intégré, et le visionneur universel de documents de Doconut.

1. Créez une application MVC minimale

Créez un nouveau projet MVC dans Visual Studio (toute édition, y compris l'édition Community gratuite).

Ajoutez un FileController qui hébergera les actions du gestionnaire de fichiers :

public class FileController : Controller
{
    private readonly string _root = Path.Combine(Directory.GetCurrentDirectory(), "App_Data", "Docs");

    public IActionResult Index()
    {
        var files = Directory.GetFiles(_root).Select(Path.GetFileName).ToList();
        return View(files);
    }

    public IActionResult Download(string name)
    {
        var path = Path.Combine(_root, name);
        if (!System.IO.File.Exists(path)) return NotFound();
        var mime = "application/octet-stream";
        return PhysicalFile(path, mime, name);
    }

    public IActionResult Delete(string name)
    {
        var path = Path.Combine(_root, name);
        if (System.IO.File.Exists(path)) System.IO.File.Delete(path);
        return RedirectToAction(nameof(Index));
    }

    public async Task<IActionResult> ViewPdf(string name)
    {
        var path = Path.Combine(_root, name);
        if (!System.IO.File.Exists(path)) return NotFound();

        // The viewer token is created here (see section 2)
        var token = await _viewer.OpenDocumentAsync(
            path,
            new Doconut.PdfConfig { AllowSearch = true },
            new DocOptions(),
            CancellationToken.None);

        ViewBag.Token = token;
        ViewBag.BasePath = "doconut";          // matches the middleware branch
        ViewBag.ResPath = "doconut-res/images";// embedded resources
        return View();
    }

    private readonly Doconut.Viewer _viewer;
    public FileController(Doconut.Viewer viewer) => _viewer = viewer;
}

Le contrôleur fait trois choses :

  1. Index – lit le dossier App_Data/Docs et transmet les noms de fichiers à une vue.
  2. Download / Delete – actions MVC standard qui utilisent l’aide intégrée PhysicalFile.
  3. ViewPdf – ouvre le PDF sélectionné avec Doconut, reçoit un jeton de sécurité et le transmet à une vue Razor.

2. Configurez l’état de session et les services Doconut

Le visionneur de Doconut repose sur l’état de session ASP.NET pour protéger le jeton qui identifie un document. Ajoutez les services requis dans Program.cs (ou Startup.cs pour les projets .NET 6) :

var builder = WebApplication.CreateBuilder(args);

// MVC services
builder.Services.AddControllersWithViews();

// Session cache – required for token validation
builder.Services.AddDistributedMemoryCache();
builder.Services.AddSession();

// Doconut registration – point to your license file
builder.Services.AddDoconut(options =>
{
    options.LicensePath = Path.Combine(AppContext.BaseDirectory, "wwwroot", "Doconut.Viewer.lic");
    options.MiddlewarePath = "/doconut";
    options.ResourcesPath = "/doconut-res";
    options.UnsafeMode = false; // keep the default security
});

var app = builder.Build();

// Session must run before the viewer middleware
app.UseSession();

// The Doconut middleware must be mapped to the path configured above.
// See Doconut documentation for the exact mapping call (e.g., app.Map("/doconut", …)).

app.UseRouting();
app.UseEndpoints(endpoints => endpoints.MapDefaultControllerRoute());

app.Run();

Points clés :

  • AddDistributedMemoryCache fournit le magasin en mémoire dont AddSession a besoin.
  • UseSession() doit apparaître avant le middleware Doconut ; sinon vous verrez l’erreur d’exécution « Session middleware not configured. »
  • MiddlewarePath et ResourcesPath sont des chaînes de coordination – la branche middleware réelle doit correspondre au chemin que vous configurez.

3. Créer la vue du gestionnaire de fichiers

Créez Views/File/Index.cshtml. Il répertorie les fichiers et fournit des actions pour télécharger, supprimer et afficher le PDF.

@model List<string>
<h2>Document Library</h2>
<table>
    <thead><tr><th>Name</th><th>Actions</th></tr></thead>
    <tbody>
@foreach (var f in Model)
{
    <tr>
        <td>@f</td>
        <td>
            <a asp-action="Download" asp-route-name="@f">Download</a> |
            <a asp-action="Delete"   asp-route-name="@f">Delete</a> |
            @if (Path.GetExtension(f).Equals(".pdf", StringComparison.OrdinalIgnoreCase))
            {
                <a asp-action="ViewPdf" asp-route-name="@f">View PDF</a>
            }
        </td>
    </tr>
}
    </tbody>
</table>

Lorsque l'utilisateur clique sur View PDF, l'action ViewPdf crée un jeton et renvoie une seconde vue qui héberge le widget du visualiseur.

4. Rendre le visualiseur Doconut

Créez Views/File/ViewPdf.cshtml. La page ne nécessite qu'un élément conteneur ; le widget JavaScript est chargé à partir des ressources intégrées.

@{
    var token = ViewBag.Token as string;
    var basePath = ViewBag.BasePath as string;
    var resPath = ViewBag.ResPath as string;
}
<h2>PDF Preview</h2>
<div id="div_ctlDoc"></div>

<script src="@($"{basePath}/docViewer.js")"></script>
<link rel="stylesheet" href="@($"{basePath}/docViewer.css")" />

<script>
    $('#div_ctlDoc').docViewer({
        AccessToken: '@token',
        BasePath: '@basePath',
        ResPath: '@resPath',
        FitType: 'width',
        showThumbs: true,
        autoLoad: true,
        onError: function (msg) { console.error(msg); }
    });
</script>

Le widget lit le AccessToken que vous avez fourni, contacte le point de terminaison /doconut/DocImage.axd et diffuse chaque page sous forme d'image. Comme le jeton est lié à la session ASP.NET actuelle, un utilisateur ne peut pas copier l'URL et afficher le document depuis un autre navigateur sans le même cookie de session.

5. Gestion de l'expiration du jeton et de la sécurité

Le délai d'expiration du jeton par défaut de Doconut est de 60 minutes (configurable via DocOptions.TimeOut). Si le visualiseur reçoit « Document session not found » ou « You Are Not Authorized To View This Page », la session a soit expiré, soit la requête provient d'un autre contexte de navigateur.

Remèdes typiques :

  • Actualiser la page – le contrôleur générera un nouveau jeton.
  • Augmenter le délai d'expiration – passez un DocOptions personnalisé lors de l'ouverture du document :
var options = new DocOptions { TimeOut = TimeSpan.FromHours(2) };
var token = await _viewer.OpenDocumentAsync(
    path,
    new Doconut.PdfConfig { AllowSearch = true },
    options,
    CancellationToken.None);
  • Configurations cross‑origin – assurez‑vous que l'attribut SameSite du cookie de session est compatible avec votre domaine front‑end. Le Lax par défaut fonctionne pour la plupart des portails même origine.

6. Étendre le gestionnaire (facultatif)

Le gestionnaire de fichiers de base est déjà fonctionnel, mais vous pourriez vouloir ajouter :

  • Upload – un formulaire simple qui envoie un IFormFile et le sauvegarde dans _root.
  • Navigation de dossiers – modifiez l'action Index pour accepter un chemin relatif et le protéger contre les traversées de répertoires (Path.GetFullPath + vérification StartsWith(_root)).
  • Recherche – filtrez files par nom avant de les transmettre à la vue.

Toutes ces extensions restent dans le même modèle MVC et continuent de bénéficier du même visualiseur Doconut protégé par session.

7. Ce que vous avez accompli

  • Un gestionnaire de fichiers ASP.NET MVC gratuit – aucune bibliothèque UI tierce, aucun frais de licence.
  • Rendu PDF dans le navigateur via le visualiseur universel de Doconut, évitant la nécessité d'installations Office ou Adobe côté client.
  • Accès sécurisé basé sur un jeton qui exploite l'état de session ASP.NET, empêchant le partage d'URL arbitraire.
  • Une base de code unique qui fonctionne pour .NET 6 et .NET 8 et peut être portée vers Razor Pages ou des API minimalistes avec seulement les appels d'enregistrement (AddDoconut, UseSession) qui changent.

Déployez l'application sur IIS, Azure App Service ou Docker – la même configuration Program.cs fonctionne partout car Doconut s'exécute sur .NET 6+ et ne nécessite aucun composant Office natif.

#ASP.NET MVC#File Manager#PDF Viewer#.NET#Doconut#Gestionnaire de fichiers#Visionneuse PDF
← Previous Post

Comment ouvrir et visualiser les fichiers DWG dans les applications .NET – Répondre à plik dwg et que es dwg