在 asp.net 上为 CKEditor 启用图像上传答案

【问题标题】：Enable image upload for CKEditor at asp.net在 asp.net 上为 CKEditor 启用图像上传
【发布时间】：2013-04-28 21:35:10
【问题描述】：

我将 CKEditor 用于我的 asp.net C# 项目。如何为编辑器启用图像上传选项卡。我阅读了一些文章，但没有一篇有用。其中一些用于 php。我想要asp.net。谢谢你的帮助。

【问题讨论】：

已经回答：stackoverflow.com/questions/2115302/…

标签： asp.net image upload ckeditor

【解决方案1】：

如果您只想启用隐藏选项卡，请仅在脚本文件夹下添加

CKEDITOR.config.extraPlugins = 'imageuploader';

但是控制台会有错误，因为你必须定义链接，这将是上传文件/图像的动作，比如

filebrowserImageBrowseUrl: 'YourController/YourAction',            
filebrowserImageUploadUrl: 'YourController/YourAction'

【讨论】：

【解决方案2】：

我终于找到了解决办法。

我做了两件事来解决我的问题。

首先我编辑了 config.ascx 文件并将基本 url 设置为 images 文件夹。如下：

公共覆盖无效 SetConfig() {

    // The base URL used to reach files in CKFinder through the browser.
    BaseUrl = "~/images/";
    // The phisical directory in the server where the file will end up. If
    // blank, CKFinder attempts to resolve BaseUrl.
    BaseDir = "";
}

我犯的错误是，我的页面位于 admin 文件夹中，而我将 ckeditor 和 ckfinder 文件夹放在了我网站的根目录中。

通过将这些文件放在管理文件夹中，问题解决了。

谢谢。

【讨论】：

【解决方案3】：

我确实喜欢 http://www.codedigest.com/Articles/ASPNET/423_Upload_Images_and_Integrate_with_CKeditor_in_AspNet.aspx letutorial 用于将 filebrowserImageUploadUrl 属性与我们自己的文件上传器实现一起使用。但是没有出现上传按钮，也没有发生任何事情。我的代码在这里：

<head runat="server">

    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script src="ckeditor/ckeditor.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            CKEDITOR.replace('<%=CKEditor1.ClientID %>', { filebrowserImageUploadUrl: '/Upload.ashx' });
        });
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <CKEditor:CKEditorControl ID="CKEditor1" BasePath="~/ckeditor/" runat="server" Width="600px" Height="200px"></CKEditor:CKEditorControl>
    </div>
    </form>
</body>
</html>

还有 ashx 文件：

<%@ WebHandler Language="C#" Class="Upload" %>

using System;
using System.Web;

public class Upload : IHttpHandler {

    public void ProcessRequest (HttpContext context) {
        HttpPostedFile uploads = context.Request.Files["upload"];
        string CKEditorFuncNum = context.Request["CKEditorFuncNum"];
        string file = System.IO.Path.GetFileName(uploads.FileName);
        uploads.SaveAs(context.Server.MapPath(".") + "\\Images\\" + file);
        string url = "/Images/" + file;
        context.Response.Write("<script>window.parent.CKEDITOR.tools.callFunction(" + CKEditorFuncNum + ", \"" + url + "\");</script>");
        context.Response.End();            
    }

    public bool IsReusable {
        get {
            return false;
        }
    }

}

【讨论】：