如何将 NicEdit 富文本编辑器与 asp.net C# (.aspx) 页面集成

Posted 2023-05-09

【中文标题】如何将 NicEdit 富文本编辑器与 asp.net C# (.aspx) 页面集成

【英文标题】：How to integrate NicEdit rich text editor with asp.net C# (.aspx) pages

【发布时间】：2017-11-19 04:11:47

【问题描述】：

我在网页中找到了许多文本编辑的解决方案，但最方便和轻量级的文本编辑器之一是 NiEditor 。我正忙着通过编辑器将图像上传到我自己的服务器。默认情况下，编辑器会在 [IMGUR] 服务器上上传图像。 我的问题是如何将图像上传到我自己的服务器而不是 IMGUR 服务器？ Image Link

【问题讨论】：

NicEdit 文档页面将是一个很好的地方开始阅读之前提出问题...所以，看看NicEdit wiki

在提问之前我先浏览了 NicEdit wiki。关于 NiceEdit 的配置有很好的描述，但所有描述都是关于 php 的。我在 asp .net 中搜索了一天的解决方案，但没有找到解决方案。

【参考方案1】：

在这里，我找到了在 .net 中上传图片的不错解决方案。通用处理程序是图像上传的最佳选择。 请按照以下步骤使用 C# 将 NicEditor 与 asp.net 集成。

从 nicedit.com 下载最新的 nicEdit.js。

使用以下代码修改第 1888 行

 nicURI: "images.ashx"

创建一个通用处理程序来上传名为 images.ashx 的图像。

在 public void ProcessRequest(HttpContext context) 内的 yourhandler.ashx 文件中编写以下代码。

string baseImageLocation = HttpContext.Current.Server.MapPath("~/Admin/imgs/");

HttpPostedFile Files;
Files = context.Request.Files[0]; // Load File collection into HttpFileCollection variable.
//Files.ContentLength;
//Files.ContentType;
if (Files != null && Files.ContentLength > 0)

    System.IO.Stream fileStream = Files.InputStream;
    fileStream.Position = 0;

    byte[] fileContents = new byte[Files.ContentLength];
    fileStream.Read(fileContents, 0, Files.ContentLength);
    string fileExt = System.IO.Path.GetExtension(Files.FileName).ToLower();
    string fileName = Path.GetFileName(Files.FileName);
    System.Drawing.Image image = null;
    if (fileName != null)
    
        if (fileExt == ".jpg" || fileExt == ".gif" || fileExt == ".jpg" || fileExt == ".png" || fileExt == ".jpeg")
        
            image = System.Drawing.Image.FromStream(new System.IO.MemoryStream(fileContents));
            if (System.IO.File.Exists(baseImageLocation + "/" + fileName))
                fileName = DateTime.Now.ToString("yyyyMMddHHmmss") + fileExt;
            Files.SaveAs(baseImageLocation + fileName);
        
    
    string link = VirtualPathUtility.ToAbsolute("~/Admin/imgs/") + fileName;

    string imageHeight = image.Height.ToString();
    string imageWidth = image.Width.ToString();
    string json = "";


    json += "" +
            "\"links\": \"" + link + "\"," +
            "\"width\": \"" + imageWidth + "\"," +
            "\"height\": \"" + imageHeight + "\"" +
            "";


    context.Response.ContentType = "application/json";
    context.Response.Write(json);

请注意，请将您的nicEdit.js 文件和yourhandler.ashx 文件放在同一个文件夹中，以便可以轻松访问处理程序的路径。

创建图片文件夹以在解决方案目录中上传图片（由编辑器上传）。

【讨论】：

嗨。我使用您的代码将图像保存在本地服务器中。它工作正常。但我无法将上传的图片显示到 textarea 中。你有想法吗？你能帮帮我吗？

嗨..只需将文本区域的所有文本保存在文件或数据库中并显示获取存储的文本到文本框并设置文本区域的文本属性（如果到达文本编辑器设置文本值地区。）