Question

我在cakePHP应用程序中使用ckeditor 4.2。我已经将它安装在我的app / webroot / js / ckeditor目录中。

我想在我的ckeditor中有一个图片上传选项，所以我下载了ckeditor图像插件（http://ckeditor.com/addon/image）。我使用以下文档（http://www.paulfp.net/blog/2010/10/how-to-add-and-upload-an-image-using-ckeditor/）

安装它

现在，图片上传界面看起来很好，但是当我点击“发送到服务器”按钮时，它不会调用PHP脚本。我在config.js中设置了“filebrowserUploadUrl”的路径，但它仍然无法正常工作。我已经完成了与上述文档相同的设置，但我无法调用该脚本。

注意：当我点击“将其发送到服务器”按钮时出于某种未知原因，我看到正在调用controller_name / undefined操作。

Answer 1

或者您也可以使用KCFinder。它是免费的开源Web文件管理器。它可以集成到FCKeditor，CKEditor和TinyMCE WYSIWYG Web编辑器（或您的自定义Web应用程序）中，以上载和管理可嵌入编辑器生成的HTML内容中的图像，Flash影片和其他文件。

http://kcfinder.sunhater.com

Answer 2

CKEditor是几乎所有Web开发人员最喜欢的基于Web的文字处理器。但问题是，它没有内置的图像上传功能，即CKEditor不知道如何处理图像上传。因此，我们将指派一位知道如何处理图片上传和文件管理的助理。

我们的助手是KCFinder，一个免费的开源Web文件管理器。它可以集成到FCKeditor，CKEditor和TinyMCE WYSIWYG Web编辑器（或您的自定义Web应用程序）中，以上载和管理可嵌入编辑器生成的HTML内容中的图像，Flash影片和其他文件。

我假设您已将CKEditor设置到您的网页中。如果您还没有这样做，可以按照上一篇文章中的说明进行操作：CKEditor: Web-based Word Processor For Your Web Pages

让我们进入我们的业务。

1）下载KCFinder＆gt; http://kcfinder.sunhater.com/download

2）将.zip文件中的kcfinder目录解压缩到项目的公共目录。

3）打开/public/ckeditor/config.js并添加代码行，如下所示;

CKEDITOR.editorConfig = function( config ) {
// Define changes to default configuration here. For example:
// config.language = 'fr';
// config.uiColor = '#AADC6E';

/* Show these image/flash browsing feature only to Admins */
config.filebrowserBrowseUrl = '/kcfinder/browse.php?opener=ckeditor&type=files';
config.filebrowserImageBrowseUrl = '/kcfinder/browse.php?opener=ckeditor&type=images';
config.filebrowserFlashBrowseUrl = '/kcfinder/browse.php?opener=ckeditor&type=flash';

/* Image/Flash upload feature using kcfinder tool */
config.filebrowserUploadUrl = '/kcfinder/upload.php?opener=ckeditor&type=files';
config.filebrowserImageUploadUrl = '/kcfinder/upload.php?opener=ckeditor&type=images';
config.filebrowserFlashUploadUrl = '/kcfinder/upload.php?opener=ckeditor&type=flash';

};

如果您不想让用户浏览服务器中以前上传的文件，您可以删除/阻止注释前三行，只保留实际上传部分的最后三行，否则您可以根据您的要求为每个功能添加用户级别控件。永远不要让用户查看服务器中的文件。如果他们更改文件，其他文件链接可能会被破坏，这将导致您的应用程序中的大量混乱。

4）激活KCFinder。

默认情况下，KCFinder被禁用。要更改它，请转到kcfinder / conf / config.php，在常规设置下，将“disabled”的值更改为false。现在，用户可以使用CKEditor界面上传和管理Web应用程序上的文件（在我们的示例中是图像文件）。

您可以查看我的博客文章中的详细步骤：https://ashenlive.blogspot.com/2016/09/ckeditor-image-upload-with-kcfinder.html

CKEditor图像上传无法正常工作

2 个答案: