aspnetcore-400321-rich-edit-get-started-net-core-application.md
This tutorial describes how to add the Rich Text Editor to an ASP.NET Core web application.
Right-click the Dependencies node in Solution Explorer and select the Manage NuGet Packages context menu item.
In the opened NuGet Package Manager window, switch to the Browse tab, select the DevExpress 25.2 Local package source, and install the DevExpress.AspNetCore.RichEdit NuGet package.
Right-click the project node in Solution Explorer and select Add → New Item.
In the invoked Add New Item dialog, select npm Configuration File and click Add to add the package.json file to the project.
Replace the package.json file’s content with the code below:
Right-click the package.json file and select Restore Packages. This command adds a node_modules directory to the application folder.
Allow the application to access files in the node_modules directory. For this purpose, register node_modules files after the default app.UseStaticFiles() method call as follows:
In the _ViewImports.cshtml file, import the DevExpress.AspNetCore namespace:
Open a view and register the following resources in a header section:
Add the Rich Text Editor control to a page. Optionally, customize the control in the following maner:
@(Html.DevExpress().RichEdit("richEdit")
.Width("100%")
.Height(800)
.ExportUrl(Url.Action("Export"))
.AutoCorrect(a => a
.CorrectTwoInitialCapitals(true)
.ReplaceTextAsYouType(true)
.ReplaceInfoCollectionSettings(s => {
s.CaseSensitive(true);
s.ReplaceInfoCollection(c => {
c.Add().What("(c)").With("©");
c.Add().What("wnwd").With("well-nourished, well-developed");
});
})
)
.Bookmarks(b => b
.Visibility(DevExpress.AspNetCore.RichEdit.Visibility.Visible)
.Color(System.Drawing.Color.Blue)
)
.Ribbon(ribbon => ribbon
.ActiveTabIndex(0)
)
.Open("Documents/Example.docx")
)
public IActionResult Export(string base64, string fileName, DevExpress.AspNetCore.RichEdit.DocumentFormat format, string reason) {
byte[] fileContents = System.Convert.FromBase64String(base64);
return Ok();
}
Note
This section lists additional steps you should perform to configure an ASP.NET Core Razor Pages web application. Skip these steps if you add the Rich Text Editor to an ASP.NET Core MVC web application.
To allow the Rich Text Editor to save documents on the server, do the following:
Add an anti‑forgery token to every internal request the Rich Text Editor sends to action handlers. This token prevents Cross-Site Request Forgery (CSRF/XSRF) attacks.
Declare a POST action handler in the page model:
Pass this handler to the ExportUrl(String) method as follows: