Aspose.Words for .NET fournit un ensemble complet de fonctionnalités pour manipuler et convertir des documents MS Word dans une multitude d’applications .NET. En particulier, vous pouvez créer de nouveaux documents Word ou modifier les documents Word existants dans les applications de bureau ou Web. Dans cet article, je vais vous montrer comment tirer parti des capacités de traitement de texte d’Aspose.Words for .NET et créer un éditeur MS Word basé sur le Web dans ASP.NET MVC.
Éditeur de mots ASP.NET MVC - Créer des documents Word
Nous allons créer un éditeur de mots ASP.NET MVC qui sera basé sur un éditeur HTML WYSIWYG pour l’écriture et la mise à jour du contenu des documents. En outre, Aspose.Words for .NET sera utilisé pour rendre le contenu du document Word en HTML pour éditer et générer des documents Word à partir du contenu mis à jour.
Étapes pour créer l’éditeur MS Word dans ASP.NET MVC
Pour la démonstration, j’ai utilisé l’éditeur WYSIWYG Suneditor basé sur JavaScript dans cette application. Vous pouvez soit utiliser le même, soit sélectionner n’importe quel autre éditeur HTML qui répond à vos besoins. Voici les étapes pour créer l’éditeur de mots ASP.NET.
- Commencez par créer une nouvelle application Web ASP.NET Core dans Visual Studio.
- Sélectionnez le modèle Application Web (Modèle-Vue-Contrôleur).
- Téléchargez les fichiers de l’éditeur WYSIWYG et conservez-les dans le répertoire wwwroot.
- Ouvrez le gestionnaire de packages NuGet et installez le package Aspose.Words for .NET.
- Ajoutez le script suivant dans la vue index.cshtml.
@{
ViewData["Title"] = "Word Editor in ASP.NET";
}
<div class="row">
<div class="col-md-12">
<form asp-controller="Home" asp-action="UploadFile" method="post" class="form-inline"
enctype="multipart/form-data">
<br />
<div class="form-group">
<input type="file" name="file" accept=".doc, .docx" class="form-control custom-file-input" />
</div>
<div class="form-group">
<button type="submit" class="form-control btn btn-primary">Open</button>
</div>
<div class="form-group" style="position:relative; float :right">
<button type="button" id="download" class="form-control btn btn-success" value="Save and Download">Save and Download</button>
</div>
</form>
<br />
<form method="post" asp-action="Index" id="formDownload">
<textarea name="editor" id="editor" rows="80" cols="100">
@if (ViewBag.HtmlContent == null)
{
<p>Write something or open an existing Word document. </p>
}
else
{
@ViewBag.HtmlContent;
}
</textarea>
</form>
</div>
</div>
<!-- suneditor -->
<link href="~/suneditor/dist/css/suneditor.min.css" rel="stylesheet">
<!-- suneditor -->
<script src="~/suneditor/dist/suneditor.min.js"></script>
<script>
var suneditor = SUNEDITOR.create('editor', {
display: 'block',
width: '100%',
height: '30%',
popupDisplay: 'full',
buttonList: [
['font', 'fontSize', 'formatBlock'],
['paragraphStyle', 'blockquote'],
['bold', 'underline', 'align', 'strike', 'subscript', 'superscript', 'horizontalRule', 'list'],
['table', 'link', 'image'],
['align', 'horizontalRule', 'list', 'lineHeight'],
['codeView']
],
placeholder: 'Start typing something...'
});
</script>
<script>
$(document).ready(function () {
$("#download").click(function () {
suneditor.save();
$("#formDownload").submit();
});
});
</script>
- Ajoutez les méthodes suivantes dans le contrôleur HomeController.cs.
[HttpPost]
public FileResult Index(string editor)
{
try
{
// Créer un nom de fichier unique
string fileName = Guid.NewGuid() + ".docx";
// Convertir le texte HTML en tableau d'octets
byte[] byteArray = Encoding.UTF8.GetBytes(editor.Contains("<html>") ? editor : "<html>" + editor + "</html>");
// Générer un document Word à partir du HTML
MemoryStream stream = new MemoryStream(byteArray);
Document Document = new Document(stream);
// Créer un flux de mémoire pour le fichier Word
var outputStream = new MemoryStream();
Document.Save(outputStream, SaveFormat.Docx);
outputStream.Position = 0;
// Renvoyer le fichier Word généré
return File(outputStream, System.Net.Mime.MediaTypeNames.Application.Rtf, fileName);
}
catch (Exception exp)
{
return null;
}
}
[HttpPost]
public ViewResult UploadFile(IFormFile file)
{
// Définir le chemin du fichier
var path = Path.Combine("wwwroot/uploads", file.FileName);
using (var stream = new FileStream(path, FileMode.Create))
{
file.CopyTo(stream);
}
// Charger le document Word
Document doc = new Document(path);
var outStream = new MemoryStream();
// Définir les options HTML
HtmlSaveOptions opt = new HtmlSaveOptions();
opt.ExportImagesAsBase64 = true;
opt.ExportFontsAsBase64 = true;
// Convertir un document Word en HTML
doc.Save(outStream, opt);
// Lire le texte du flux
outStream.Position = 0;
using(StreamReader reader = new StreamReader(outStream))
{
ViewBag.HtmlContent = reader.ReadToEnd();
}
return View("Index");
}
- Enfin, créez et exécutez l’application dans votre navigateur préféré.
Démo
Voici la démonstration de la création ou de la modification de documents Word dans l’éditeur de mots ASP.NET.
Créer un document Word dans ASP.NET
Modifier un document Word dans ASP.NET
Télécharger le code source
Vous pouvez télécharger le code source de MS Word Editor depuis ici.
Conclusion
Dans cet article, vous avez appris à créer des documents MS Word dans ASP.NET. Le guide étape par étape ainsi que des exemples de code ont montré comment créer un éditeur MS Word simple basé sur le Web dans ASP.NET MVC. Parallèlement, vous pouvez en savoir plus sur Aspose.Words for .NET en utilisant les ressources suivantes.
Essayez gratuitement Aspose.Words for .NET
Vous pouvez essayer gratuitement Aspose.Words for .NET en demandant une licence temporaire.