De nombreux développeurs commencent par rechercher des bibliothèques de composants UI lorsqu'ils doivent afficher des documents dans une application web. Doconut Viewer est un SDK .NET permettant d'ajouter une visualisation sans plugin dans le navigateur aux projets ASP.NET Core, MVC ou WebForms classiques. La sécurité dépend toujours de l'architecture complète de l'application : authentification, autorisation, transport, stockage, validation, nettoyage, correctifs et surveillance.
1. Installer le SDK Doconut App et préparer votre projet .NET pour plusieurs formats de fichiers
1.1 Ajouter le package pris en charge
Utilisez le package actuel et les instructions d'installation depuis la page de téléchargement officielle de Doconut. Notez la version choisie et vérifiez qu'elle prend en charge le runtime .NET cible.
1.2 Vérifier la référence du package
Après l'installation, confirmez la référence du package et la version résolue dans le fichier de projet. Garder les versions explicites aide à rendre les builds et les déploiements reproductibles.
1.3 Activer HTTPS
Doconut App nécessite SSL pour tous les téléchargements de fichiers. Assurez-vous que votre application écoute en HTTPS. Pour une application hébergée par Kestrel, ajoutez une configuration d'endpoint dans appsettings.json :
{
"Kestrel": {
"Endpoints": {
"Https": {
"Url": "
}
}
}
}
Si vous hébergez sur IIS, liez un certificat HTTPS au site. Avec HTTPS activé, chaque fichier transite via un canal sécurisé avant d'atteindre le moteur de rendu de Doconut App.
Pourquoi Doconut App ? Doconut App est le seul visualiseur natif .NET qui combine un rendu sans plugin avec un chiffrement AES‑256 de bout en bout, vous permettant de répondre aux exigences de conformité sans ajouter d'infrastructure supplémentaire.
2. Configurer les téléchargements de fichiers sécurisés et le stockage pour la gestion de documents
Le modèle de sécurité de Doconut App repose sur trois piliers : le transport SSL, le chiffrement AES‑256 au repos et la suppression automatique après visualisation. Le SDK fournit un service prêt à l'emploi que vous pouvez enregistrer dans votre application.
2.1 Enregistrer le service de téléchargement
Dans Startup.cs (ou Program.cs pour .NET 6+), ajoutez les services Doconut au conteneur d’injection de dépendances. Configurez un dossier de stockage temporaire, activez le chiffrement AES‑256 et définissez l’intervalle de suppression automatique (par exemple, 10 minutes après que le document a été visualisé).
2.2 Créer le point de terminaison de téléchargement
Implémentez une action de contrôleur qui reçoit un fichier téléchargé, le transmet au service Doconut pour un stockage sécurisé, et renvoie un jeton unique de courte durée. Le jeton est ce que le visualiseur côté client utilisera pour récupérer et rendre le document.
2.3 Protéger le point de terminaison
Comme le point de terminaison de téléchargement traite des données sensibles, protégez‑le avec une authentification et une autorisation basée sur les rôles (par ex., seuls les utilisateurs du rôle DocumentViewer peuvent télécharger). Cela garantit que seules les personnes autorisées peuvent stocker et visualiser des documents confidentiels.
Avantage de Doconut App : Le SDK gère le chiffrement et le nettoyage pour vous, vous n’avez jamais besoin d’écrire du code cryptographique personnalisé ni de vous soucier des fichiers orphelins.
3. Intégrer le composant Viewer dans ASP.NET Core, MVC ou WebForms
Une fois le backend prêt, initialisez le visualiseur en utilisant les ressources et l’API documentées pour la version Doconut installée.
3.1 Ajouter le bundle JavaScript
Dans votre mise en page partagée, incluez uniquement les ressources du visualiseur décrites dans la documentation correspondant au SDK installé. Ne supposez pas de noms de bundle ou d’emplacements fixes d’une version à l’autre.
3.2 Créer une vue Razor pour Core/MVC
Ajoutez une vue (par ex., Views/Document/View.cshtml) qui contient un champ de fichier, un élément conteneur pour le visualiseur, et un petit script qui télécharge le fichier sélectionné, reçoit le jeton sécurisé, et initialise le widget Doconut Viewer.
Le script doit :
- Capturer le fichier sélectionné depuis l’élément
<input type="file">. - Envoyer le fichier au point de terminaison de téléchargement en utilisant
fetchouXMLHttpRequest. - Lorsque la réponse autorisée arrive, initialiser le visualiseur en utilisant l’API prise en charge pour la version installée.
3.3 Équivalent WebForms
Dans une page WebForms (par ex., DocumentViewer.aspx), placez un contrôle asp:FileUpload, un bouton pour déclencher le téléchargement, et un <div> qui hébergera le visualiseur. Dans le code‑behind, appelez le service Doconut pour stocker le fichier téléchargé, obtenir le jeton, et enregistrer un script de démarrage qui appelle une fonction JavaScript (initViewer(token)) pour créer l’instance du visualiseur.
Avantage de Doconut App : Un widget JavaScript, trois modèles UI .NET, aucune bibliothèque supplémentaire. La simplicité à son meilleur.
4. Personnaliser le visualiseur pour la gestion de documents
Prêt à l’emploi, Doconut Viewer propose une barre d’outils épurée, des contrôles de zoom et un basculeur de thème clair/sombre. Vous pouvez adapter l’UI à votre marque et aux types de documents spécifiques.
4.1 Configuration de la barre d’outils
Lors de l’initialisation du visualiseur, vous pouvez spécifier quels éléments de la barre d’outils doivent être visibles (par ex., download, print, zoomIn, zoomOut, fullScreen). Supprimer le bouton download, par exemple, empêche les utilisateurs d’enregistrer le fichier original.
4.2 Thème et couleurs
Définissez l’option theme sur 'dark' ou 'light' et fournissez éventuellement un primaryColor qui correspond à votre palette d’entreprise. Le visualiseur respecte les variables CSS, permettant un style plus poussé via une feuille de style personnalisée.
4.3 Outils spécifiques CAD
Si vous affichez des fichiers DWG, DXF ou DGN, activez les options CAD enableMeasurement et enableLayerToggle. Cela ajoute des outils de mesure de distance, d’angle et de surface ainsi qu’un panneau de visibilité des calques directement dans la barre d’outils.
4.4 Localisation
Passez un code locale (par ex., 'fr' pour le français) lors de l’initialisation. Toutes les chaînes UI, infobulles et messages d’erreur seront affichés dans la langue sélectionnée.
Pourquoi personnaliser ? Doconut App vous permet de garder le visualiseur comme une extension naturelle de votre site tout en offrant la même expérience sécurisée et sans plugin.
5. Tester l’intégration pour tous les formats pris en charge
Avant de mettre en production, effectuez une vérification rapide pour chaque type de fichier que vous prévoyez que vos utilisateurs visualisent. En utilisant le visualiseur de Doconut App, ouvrez un fichier d’exemple de chaque format et vérifiez que le rendu, la navigation et les outils spécialisés fonctionnent comme décrit.
| Format | Scénario de test | Résultat attendu |
|---|---|---|
| Grand rapport multipage avec images intégrées | Défilement fluide, zoom, et rendu des couleurs précis | |
| DOCX | Document Word avec tableaux et notes de bas de page | Tout le texte, les tableaux et les notes de bas de page sont visibles ; aucun décalage de mise en page |
| XLSX | Feuille de calcul avec graphiques | Les graphiques sont rendus en vecteur ; le zoom conserve la netteté |
| PPTX | Diaporama avec aperçu statique | La première diapositive s’affiche correctement ; aucun élément cassé |
| DWG | Dessins techniques avec plusieurs calques | Les calques peuvent être activés/désactivés, les mesures fonctionnent, les lignes restent nettes |
| PSD | Fichier Photoshop avec calques | Les calques sont visibles, les couleurs exactes, le zoom reste net |
| SVG | Graphique vectoriel avec dégradés | Les dégradés sont rendus de façon fluide ; le zoom reste net |
| TIFF | Numérisation haute résolution | L’image se charge rapidement ; le zoom révèle les détails |
Parcourir cette liste de contrôle avec Doconut App garantit que chaque format pris en charge se comporte de manière fiable pour vos utilisateurs.
Conclusion
Intégrer un visualiseur de documents sécurisé et sans plugin est désormais simple avec Doconut App. En suivant les étapes ci‑dessus — installation du SDK, configuration des téléchargements chiffrés, intégration du widget JavaScript léger et personnalisation de l’UI — vous pouvez offrir un rendu de documents rapide et de haute qualité sur les applications ASP.NET Core, MVC et WebForms.
Prêt à l’évaluer ? Commencez par la page officielle de téléchargement et de documentation de Doconut, puis testez le SDK dans le même cadre d’audit de sécurité appliqué au reste de votre application ASP.NET sous Windows.