New to Telerik UI for ASP.NET Core? Download free 30-day trial

Razor Page

This article describes how to configure the Telerik UI ImageEditor for ASP.NET Core in a RazorPage scenario.

The example below demonstrates how to configure the ImageEditor to forward the content to a proxyURL in a RazorPage scenario even if the browser supports saving files locally. See the implementation details in the example below, and for the full project with RazorPages examples, visit our GitHub repository.


    @inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
    @Html.AntiForgeryToken()

    @(Html.Kendo().ImageEditor()
        .Name("imageEditor")
        .Height(900)
        .SaveAs(s => {
            s.FileName("image_edited.png");
            s.ForceProxy(true);
            s.ProxyURL(Url.Page("ImageEditorIndex", "Save"));
        })
        .ImageUrl(@Url.Content("~/images/2.jpg"))
    )

    @inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
    @Html.AntiForgeryToken()

    <kendo-imageeditor name="imageEditor" height="900" image-url="@Url.Content("~/image/2.jpg")">
        <save-as file-name="image.png" 
                 force-proxy="true"
                 proxy-url="@Url.Action("ImageEditorIndex","Save")"/>
    </kendo-imageeditor>

    public IActionResult OnPostSave(string contentType, string base64, string fileName)
    {
        var fileContents = Convert.FromBase64String(base64);

        return File(fileContents, contentType, fileName);
    }

See Also

In this article