Editor di parole ASP.NET MVC

Aspose.Words for .NET fornisce un set completo di funzionalità per la manipolazione e la conversione di documenti MS Word all’interno di una moltitudine di applicazioni .NET. In particolare, puoi creare nuovi documenti Word o modificare quelli esistenti all’interno delle applicazioni desktop o web. In questo post, ti mostrerò come sfruttare le capacità di elaborazione testi di Aspose.Words per .NET e creare un editor di MS Word basato sul Web in ASP.NET MVC.

Editor di parole ASP.NET MVC - Crea documenti di Word

Creeremo un editor di parole MVC ASP.NET che sarà basato su un editor HTML WYSIWYG per scrivere e aggiornare il contenuto dei documenti. Inoltre, Aspose.Words per .NET verrà utilizzato per il rendering del contenuto del documento di Word in HTML per la modifica e la generazione di documenti di Word dal contenuto aggiornato.

Passaggi per creare MS Word Editor in ASP.NET MVC

Per la dimostrazione, ho utilizzato l’editor WYSIWYG Suneditor basato su JavaScript in questa applicazione. Puoi utilizzare lo stesso o selezionare qualsiasi altro editor HTML adatto alle tue esigenze. Di seguito sono riportati i passaggi per creare l’editor di parole ASP.NET.

  • Innanzitutto, crea una nuova applicazione Web ASP.NET Core in Visual Studio.
  • Selezionare il modello Applicazione Web (Model-View-Controller).
  • Scarica i file dell’editor WYSIWYG e conservali nella directory wwwroot.
  • Aprire Gestione pacchetti NuGet e installare il pacchetto Aspose.Words per .NET.
  • Aggiungi il seguente script nella vista 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>
  • Aggiungi i seguenti metodi nel controller HomeController.cs.
[HttpPost]
public FileResult Index(string editor)
{
	try
	{
		// Crea un nome file univoco
		string fileName = Guid.NewGuid() + ".docx";
		// Converti testo HTML in array di byte
		byte[] byteArray = Encoding.UTF8.GetBytes(editor.Contains("<html>") ? editor : "<html>" + editor + "</html>");
		// Genera documento Word dall'HTML
		MemoryStream stream = new MemoryStream(byteArray);
		Document Document = new Document(stream);
		// Crea flusso di memoria per il file di Word
		var outputStream = new MemoryStream();
		Document.Save(outputStream, SaveFormat.Docx);
		outputStream.Position = 0;
		// Restituisce il file Word generato
		return File(outputStream, System.Net.Mime.MediaTypeNames.Application.Rtf, fileName);
	}
	catch (Exception exp)
	{
		return null;
	}
}
[HttpPost]
public ViewResult UploadFile(IFormFile file)
{
	// Imposta il percorso del file
	var path = Path.Combine("wwwroot/uploads", file.FileName);
	using (var stream = new FileStream(path, FileMode.Create))
	{
		file.CopyTo(stream);
	}
	// Carica documento Word
	Document doc = new Document(path);
	var outStream = new MemoryStream();
	// Imposta le opzioni HTML
	HtmlSaveOptions opt = new HtmlSaveOptions();
	opt.ExportImagesAsBase64 = true;
	opt.ExportFontsAsBase64 = true; 
	// Converti documento Word in HTML
	doc.Save(outStream, opt);
	// Leggi il testo dallo stream
	outStream.Position = 0;
	using(StreamReader reader = new StreamReader(outStream))
	{
		ViewBag.HtmlContent = reader.ReadToEnd();
	}
	return View("Index");
}
  • Infine, crea ed esegui l’applicazione nel tuo browser preferito.

Demo

Di seguito è riportata la dimostrazione di come creare o modificare documenti di Word in ASP.NET Word Editor.

Crea un documento Word in ASP.NET

Modifica un documento di Word in ASP.NET

Scarica il codice sorgente

Puoi scaricare il codice sorgente di MS Word Editor da qui.

Conclusione

In questo articolo, hai imparato come creare documenti MS Word in ASP.NET. La guida dettagliata insieme agli esempi di codice ha mostrato come creare un semplice editor di MS Word basato sul Web in ASP.NET MVC. Inoltre, puoi esplorare di più su Aspose.Words per .NET usando le seguenti risorse.

Prova Aspose.Words per .NET gratuitamente

Puoi provare Aspose.Words per .NET gratuitamente richiedendo una licenza temporanea.

articoli Correlati