Aspose.Words for .NET มีชุดคุณลักษณะที่สมบูรณ์สำหรับจัดการและแปลงเอกสาร MS Word ภายในแอปพลิเคชัน .NET จำนวนมาก โดยเฉพาะอย่างยิ่ง คุณสามารถสร้างใหม่หรือแก้ไขเอกสาร Word ที่มีอยู่ภายในเดสก์ท็อปหรือเว็บแอปพลิเคชัน ในโพสต์นี้ ฉันจะแสดงวิธีใช้ประโยชน์จากความสามารถในการประมวลผล Word ของ Aspose.Words for .NET และสร้างโปรแกรมแก้ไข MS Word บนเว็บใน ASP.NET MVC
ASP.NET MVC Word Editor - สร้างเอกสาร Word
เรากำลังจะสร้าง ASP.NET MVC Word Editor ที่จะใช้โปรแกรมแก้ไข WYSIWYG HTML สำหรับเขียนและอัปเดตเนื้อหาของเอกสาร นอกจากนี้ Aspose.Words for .NET จะใช้ในการเรนเดอร์เนื้อหาของเอกสาร Word เป็น HTML เพื่อแก้ไขและสร้างเอกสาร Word จากเนื้อหาที่อัปเดต
ขั้นตอนในการสร้าง MS Word Editor ใน ASP.NET MVC
สำหรับการสาธิต ฉันใช้ JavaScript-based Suneditor WYSIWYG editor ในแอปพลิเคชันนี้ คุณสามารถใช้ตัวแก้ไขเดียวกันหรือเลือกตัวแก้ไข HTML อื่นที่เหมาะกับความต้องการของคุณ ต่อไปนี้เป็นขั้นตอนในการสร้าง ASP.NET Word Editor
- ขั้นแรก สร้าง ASP.NET Core Web Application ใหม่ใน Visual Studio
- เลือกเทมเพลต Web Application (Model-View-Controller)
- ดาวน์โหลดไฟล์ของตัวแก้ไข WYSIWYG และเก็บไว้ในไดเร็กทอรี wwwroot
- เปิด NuGet Package Manager และติดตั้ง Aspose.Words สำหรับแพ็คเกจ .NET
- เพิ่มสคริปต์ต่อไปนี้ในมุมมอง 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>
- เพิ่มวิธีการต่อไปนี้ในตัวควบคุม HomeController.cs
[HttpPost]
public FileResult Index(string editor)
{
try
{
// สร้างชื่อไฟล์เฉพาะ
string fileName = Guid.NewGuid() + ".docx";
// แปลงข้อความ HTML เป็นอาร์เรย์ไบต์
byte[] byteArray = Encoding.UTF8.GetBytes(editor.Contains("<html>") ? editor : "<html>" + editor + "</html>");
// สร้างเอกสาร Word จาก HTML
MemoryStream stream = new MemoryStream(byteArray);
Document Document = new Document(stream);
// สร้างสตรีมหน่วยความจำสำหรับไฟล์ Word
var outputStream = new MemoryStream();
Document.Save(outputStream, SaveFormat.Docx);
outputStream.Position = 0;
// ส่งคืนไฟล์ Word ที่สร้างขึ้น
return File(outputStream, System.Net.Mime.MediaTypeNames.Application.Rtf, fileName);
}
catch (Exception exp)
{
return null;
}
}
[HttpPost]
public ViewResult UploadFile(IFormFile file)
{
// กำหนดเส้นทางของไฟล์
var path = Path.Combine("wwwroot/uploads", file.FileName);
using (var stream = new FileStream(path, FileMode.Create))
{
file.CopyTo(stream);
}
// โหลดเอกสาร Word
Document doc = new Document(path);
var outStream = new MemoryStream();
// ตั้งค่าตัวเลือก HTML
HtmlSaveOptions opt = new HtmlSaveOptions();
opt.ExportImagesAsBase64 = true;
opt.ExportFontsAsBase64 = true;
// แปลงเอกสาร Word เป็น HTML
doc.Save(outStream, opt);
// อ่านข้อความจากสตรีม
outStream.Position = 0;
using(StreamReader reader = new StreamReader(outStream))
{
ViewBag.HtmlContent = reader.ReadToEnd();
}
return View("Index");
}
- สุดท้าย สร้างและเรียกใช้แอปพลิเคชันในเบราว์เซอร์ที่คุณชื่นชอบ
การสาธิต
ต่อไปนี้เป็นการสาธิตวิธีการสร้างหรือแก้ไขเอกสาร Word ใน ASP.NET Word Editor
สร้างเอกสาร Word ใน ASP.NET
แก้ไขเอกสาร Word ใน ASP.NET
ดาวน์โหลดซอร์สโค้ด
คุณสามารถดาวน์โหลดซอร์สโค้ดของ MS Word Editor ได้จาก ที่นี่
บทสรุป
ในบทความนี้ คุณได้เรียนรู้วิธีการสร้างเอกสาร MS Word ใน ASP.NET คำแนะนำทีละขั้นตอนพร้อมกับตัวอย่างโค้ดได้แสดงวิธีสร้างโปรแกรมแก้ไข MS Word บนเว็บอย่างง่ายใน ASP.NET MVC นอกจากนี้ คุณสามารถสำรวจเพิ่มเติมเกี่ยวกับ Aspose.Words for .NET โดยใช้แหล่งข้อมูลต่อไปนี้
ลองใช้ Aspose.Words for .NET ฟรี
คุณสามารถลองใช้ Aspose.Words for .NET ได้ฟรีโดยขอ ใบอนุญาตชั่วคราว