Javascript 如何更改 KCFinder 中图像的默认浏览目录？

How to change the default browse directory for images in KCFinder?

提问by Cris

I'm using CKEditor with KCFinder. Everything works great except one thing.

我在 KCFinder 中使用 CKEditor。除了一件事，一切都很好。

My default upload URL is:

我的默认上传网址是：

'uploadURL' => "/userfiles"

Let's say I want to upload an image. I click on Upload image in CKEditor, then I click on Browse the Server to select one already uploaded. Problem is that CKEditor is browsing /userfiles/imagesinstead of just /userfileslike I would like to.

假设我想上传一张图片。我在 CKEditor 中单击上传图像，然后单击浏览服务器以选择已上传的图像。问题是，CKEditor的是浏览/ userfiles /图像，而不是仅仅/ userfiles像我想。

I understand that this is not a bug and just a way it was set up but how do I change it?

我知道这不是一个错误，只是它的一种设置方式，但我该如何更改它？

I didn't find anything on http://kcfinder.sunhater.com

我在http://kcfinder.sunhater.com上没有找到任何内容

回答by German

I found an even better workaround.

我找到了一个更好的解决方法。

The magic occurs when, in your config.php file, you define:

当您在 config.php 文件中定义：

'types' => array(
        // CKEditor & FCKEditor types
        'files'   =>  "disabled",
        'flash'   =>  "disabled",
        'images'  =>  "*img",

        // TinyMCE types
        'file'    =>  "disabled",
        'media'   =>  "disabled",
        'image'   =>  "*img",
    ),

This says that KCfinder will create an "images" directory and store images. I have a "files" directory disabled, since I don't allow my users to upload files.

这表示 KCfinder 将创建一个“图像”目录并存储图像。我禁用了“文件”目录，因为我不允许我的用户上传文件。

What you do if you want them at the root directory is add a '' entry (blank), and assign what they can upload. In my server I have:

如果您希望它们在根目录中，您要做的是添加一个 '' 条目（空白），并分配它们可以上传的内容。在我的服务器中，我有：

'types' => array(
        '' => "*img",
        // CKEditor & FCKEditor types
        'files'   =>  "disabled",
        'flash'   =>  "disabled"
    ),

Which lets me upload image files directly to the root folder.

这让我可以将图像文件直接上传到根文件夹。

回答by Sudhir Bastakoti

I had the same problem, until I tried the following with session parameters (dynamic settings; http://kcfinder.sunhater.com/docs/install#dynamic):

我遇到了同样的问题，直到我尝试了以下会话参数（动态设置；http: //kcfinder.sunhater.com/docs/install#dynamic）：

$_SESSION['KCFINDER']['uploadURL'] = '/some_directory/some_subdir';
$_SESSION['KCFINDER']['uploadDir'] = '../some_directory/some_subdir';

The "uploadURL" must refer to the "html" path, i.e. the absolute path from your server root that your html tags will recognize. As an example, if your files are located under a directory named "images" at the root of your web server, you will have:

“uploadURL”必须指向“html”路径，即您的 html 标签将识别的服务器根目录的绝对路径。例如，如果您的文件位于 Web 服务器根目录下名为“images”的目录下，您将拥有：

$_SESSION['KCFINDER']['uploadURL'] = '/images';

The "uploadDir" must refer to the relative path of the directory containing the files you wish to access to OR the absolute path from your DISK root (example: /var/www/html/.....). I think it is better to use a relative path from the location of your KCFinder installation path, since this way it will be portable. Continuing with the same example as above, and considering that KCFinder is installed in /web_apps/kcfinder, then you will have this:

“uploadDir”必须指包含您希望访问的文件的目录的相对路径或来自您的磁盘根目录的绝对路径（例如：/var/www/html/.....）。我认为最好使用来自 KCFinder 安装路径位置的相对路径，因为这样它将是可移植的。继续与上面相同的示例，并考虑到 KCFinder 安装在 /web_apps/kcfinder 中，那么您将拥有以下内容：

$_SESSION['KCFINDER']['uploadDir'] = '../../images';

Hope this helps!

希望这可以帮助！

回答by Thomas Reichelt

Own Folders for Files Types in CKEDITOR/FCKEDITOR:If you want to use your OWN FOLDERS for Images, Files just config in CKEDITOR/FCKEDITOR config.js

CKEDITOR/FCKEDITOR 中文件类型的自己的文件夹：如果您想将自己的文件夹用于图像，文件只需在 CKEDITOR/FCKEDITOR config.js 中配置

this lines:

这行：

    //KCFINDER
CKEDITOR.editorConfig = function( config ) {
   config.filebrowserBrowseUrl = '/kcfinder-2.51/browse.php?type=file';
   config.filebrowserImageBrowseUrl = '/kcfinder-2.51/browse.php?type=image';
   config.filebrowserFlashBrowseUrl = '/kcfinder-2.51/browse.php?type=flash';
   config.filebrowserUploadUrl = '/kcfinder-2.51/upload.php?type=file';
   config.filebrowserImageUploadUrl = '/kcfinder-2.51/upload.php?type=image';
   config.filebrowserFlashUploadUrl = '/kcfinder-2.51/upload.php?type=flash';
};

For Example if you want to use for you Images a folder "ImagesMyOwnFolder" ==> change line to config.filebrowserImageBrowseUrl = /kcfinder-2.51/browse.php?type=ImagesMyOwnFolder';

例如，如果您想为您的图像使用文件夹“ImagesMyOwnFolder”==> 将行更改为 config.filebrowserImageBrowseUrl = /kcfinder-2.51/browse.php?type=ImagesMyOwnFolder';

Hopefully this help others who want to use there own folders or existing folder from a other filemanager which already there and cant be moved.

希望这可以帮助那些想要使用自己的文件夹或来自其他文件管理器的现有文件夹的其他人，这些文件夹已经存在并且无法移动。

回答by user2827246

It can be done in many ways. I am explaining a process, which I applied as per my php applications' code structure. The same code structure/framework I followed for different applications, with each application as a sub-folder in my server. So, there is a logical need to use one single CKeditor with KCfinder and configure it in some way, so that it work properly for all the applications. The content part of CKeditor is ok. It can easily be reused by different applications or projects from a single CKeditor component. But the problem arises with file upload, like image, video or any other document. To make it applicable for different project, the files must be uploaded in separe folders for different projects. And for that $_CONFIG['uploadURL'] must by configured with dynamic folder path, means different folder path for each project, but calling the the same CKeditor KCfinder component in the same location. I am explaning some differnt process together in a step-by-step way. Those worked for me fine with KCfinder version 2.51 and I hope they will work for others as well. If it does not work for other developrs, then may be they need to make some tweaks in those process as per their project code structure and folder write permission as well as per the CKeditor and KCfinder version.

它可以通过多种方式完成。我正在解释一个过程，我根据我的 php 应用程序的代码结构应用了该过程。我为不同的应用程序遵循相同的代码结构/框架，每个应用程序作为我服务器中的一个子文件夹。因此，合乎逻辑地需要将一个 CKeditor 与 KCfinder 一起使用并以某种方式对其进行配置，以使其适用于所有应用程序。CKeditor的内容部分还可以。它可以很容易地被来自单个 CKeditor 组件的不同应用程序或项目重用。但问题出现在文件上传时，如图像、视频或任何其他文档。为了使其适用于不同的项目，文件必须上传到不同项目的单独文件夹中。对于 $_CONFIG['uploadURL'] 必须配置动态文件夹路径，这意味着每个项目的文件夹路径不同，但在同一位置调用相同的 CKeditor KCfinder 组件。我正在一步一步地解释一些不同的过程。这些在 KCfinder 2.51 版中对我很好，我希望它们也适用于其他人。如果它不适用于其他开发人员，那么他们可能需要根据他们的项目代码结构和文件夹写入权限以及 CKeditor 和 KCfinder 版本在这些过程中进行一些调整。

1) In CKeditor\filemanagers\kcfinder_2_51\config.php file

1) 在 CKeditor\filemanagers\kcfinder_2_51\config.php 文件中

a) In $_CONFIG array definition, search for this line 'disabled' => false, and if you find any replace it with 'disabled' => true, At the end of that file put the following code. The code is self explaining with the logic and details commented out within it. The code is:

a) 在 $_CONFIG 数组定义中，搜索这一行 'disabled' => false，如果找到任何替换为 'disabled' => true，在该文件的末尾放置以下代码。代码是自我解释的，其中的逻辑和细节被注释掉了。代码是：

//Code to assign $_CONFIG['uploadURL'] dynamic value: different for different projects or sites: added by Mrinal Nandi on 5 oct, 2013: start
//session dependent dynamic $_CONFIG['uploadURL'] setting :start 

////session dependent secure method: only for single site setting: i.e. one CKeditor KCfinder for each one project domain or subdomain, not one CKeditor KCfinder for multiple project:start    
//  session_start();
//if(isset($_SESSION['KCFINDER']['uploadURL']) && $_SESSION['KCFINDER']['uploadURL']!="") { //$_SESSION['SESSION_SERVER_RELATIVEPATH']: relative folder path of the project corresponding to the webroot; should be like "/project/folder/path/"  //set this session variable in a common file in your project where the session started 
//  $file_upload_relative_path=$_SESSION['KCFINDER']['uploadURL'];  
//}
////session dependent secure method: only for single site setting: i.e. one CKeditor KCfinder for each one project domain or subdomain, not one CKeditor KCfinder for multiple project:start


//Using a single CKeditor KCfinder component for different projects or sites (multisite): start

//session dependent settings a single CKeditor KCfinder component for different projects or sites (multisite): start 
//Assuming different session_name for different projects, if represented as different sub-folders, but not work if represented as sub-domains or different domains 
//Secure and deny access for unauthorized users without any session, thus restrict access via direct link  
//but not work if projects represented as sub-domains or different domains, then have to use the session independent way provided bellow (though it is insecure), or have to implement some session related way as per the project flow and structure   

session_name(base64_decode($_REQUEST['param_project'])); 
session_start();    

if(isset($_SESSION['KCFINDER']['uploadURL']) && $_SESSION['KCFINDER']['uploadURL']!="") { //$_SESSION['SESSION_SERVER_RELATIVEPATH']: relative folder path of the project corresponding to the webroot; should be like "/project/folder/path/"  //set this session variable in a common file in your project where the session started 
    $file_upload_relative_path=$_SESSION['KCFINDER']['uploadURL'];  

}
//session dependent settings a single CKeditor KCfinder component for different projects or sites (multisite): end 



//session dependent dynamic $_CONFIG['uploadURL'] setting :end 

////session independent dynamic $_CONFIG['uploadURL'] setting: without using session :start
//if(isset($_REQUEST['param_project']) && $_REQUEST['param_project']!=""){ //base64 encoded relative folder path for file upload in the project,  corresponding to the webroot; should be like "/project/folder/file/upload/path/" before encoding 
//  $file_upload_relative_path=base64_decode($_REQUEST['param_project']);
//  
//}
////session independent dynamic $_CONFIG['uploadURL'] setting: without using session :end 


if(isset($file_upload_relative_path) && trim($file_upload_relative_path)!="" ){
    if(isset($_SESSION['KCFINDER']['uploadURL'])){
        $_CONFIG['disabled']=false;
    } else if(is_dir($file_upload_relative_path)) { //to make it relatively secure so that hackers can not create any upload folder automatcally in the server, using a direct link and can not upload files there 
        $_CONFIG['disabled']=false;
    }
}
// Path to user files relative to the document root.
$_CONFIG['uploadURL']= $file_upload_relative_path;
$_CONFIG['param_project'] = $_REQUEST['param_project'];
//Using a single CKeditor KCfinder component for different projects or sites (multisite): end 

//Code to assign $_CONFIG['uploadURL'] dynamic value: different for different projects or sites: added by Mrinal Nandi on 5 oct, 2013: end 

2) In ckeditor\filemanagers\kcfinder_2_51\js\browser\misc.js

2) 在 ckeditor\filemanagers\kcfinder_2_51\js\browser\misc.js

Search for this line: var data = 'browse.php?type=' + encodeURIComponent(this.type) + '&lng=' + this.lang;

搜索这一行： var data = 'browse.php?type=' + encodeURIComponent(this.type) + '&lng=' + this.lang;

Replace it with that line:

用该行替换它：

var data = 'browse.php?type=' + encodeURIComponent(this.type) + '&lng=' + this.lang + '&param_project=' + this.param_project;

3) In ckeditor\filemanagers\kcfinder_2_51\tpl\tpl_javascript.php

3) 在 ckeditor\filemanagers\kcfinder_2_51\tpl\tpl_javascript.php

Search for this line: browser.type = "type) ?>";

搜索这一行： browser.type = "type) ?>";

Put these commands after that line:

将这些命令放在该行之后：

browser.param_project = "<?php echo text::jsValue($this->config['param_project']) ?>";

4) In ckeditor\filemanagers\kcfinder_2_51\core\uploader.php Search for this lines in __construct() function :

4) 在 ckeditor\filemanagers\kcfinder_2_51\core\uploader.php 在 __construct() 函数中搜索这行：

if (isset($this->config['_check4htaccess']) &&
    $this->config['_check4htaccess']
) {
    $htaccess = "{$this->config['uploadDir']}/.htaccess";
    if (!file_exists($htaccess)) {
        if (!@file_put_contents($htaccess, $this->get_htaccess()))
            $this->backMsg("Cannot write to upload folder. {$this->config['uploadDir']}");
    } else {
        if (false === ($data = @file_get_contents($htaccess)))
            $this->backMsg("Cannot read .htaccess");
        if (($data != $this->get_htaccess()) && !@file_put_contents($htaccess, $data))
            $this->backMsg("Incorrect .htaccess file. Cannot rewrite it!");
    }
}

And comment out that full section

并注释掉整个部分

4) Now where you want to show the CKeditor in your project, you have to put those lines in the corresponding php file/page, obviously with changed values of variables corresponding to your project/app. But please read the comments first to decide what lines you should keep and what should be commented out as per your flow:

4）现在你想在你的项目中显示CKeditor的地方，你必须将这些行放在相应的php文件/页面中，显然与你的项目/应用程序相对应的变量值发生了变化。但是请先阅读评论以决定您应该保留哪些行以及应该根据您的流程注释掉哪些行：

include_once(Absolute/Folder/path/for/CKeditor/."ckeditor/ckeditor.php") ; 

//If you did not want a session oriented way, cooment out the session related lines
$_SESSION['KCFINDER'] = array();                                    
$_SESSION['KCFINDER']['uploadURL']=$SERVER_RELATIVEPATH."userfiles/"; 

$CKEditor = new CKEditor();
$CKEditor->basePath = HTTP_COMPONENTPATH."ckeditor_3.6.2/ckeditor/";

//$_SESSION['KCFINDER']['uploadURL']="/userfiles/fashion_qr/";

$CKEditor->config["filebrowserBrowseUrl"] = ($CKEditor->basePath)."filemanagers/kcfinder_2_51/browse.php?type=files&param_project=".base64_encode(session_name());
$CKEditor->config["filebrowserImageBrowseUrl"] = ($CKEditor->basePath)."filemanagers/kcfinder_2_51/browse.php?type=images&param_project=".base64_encode(session_name());
$CKEditor->config["filebrowserFlashBrowseUrl"] = ($CKEditor->basePath)."filemanagers/kcfinder_2_51/browse.php?type=flash&param_project=".base64_encode(session_name());

$CKEditor->editor("Content", getIfSet($data['Content']));
//if you did not want a session oriented way, then in the above code code segment, just replace all the texts: base64_encode(session_name()) with this one: base64_encode(session_name($SERVER_RELATIVEPATH."userfiles/"))  

And you are done.

你已经完成了。

回答by Darkhan ZD

Here is my solution. CKEditor config:

这是我的解决方案。CKEditor 配置：

<?php $filesFolder = "topic123"; ?>
CKEDITOR.replace('contentEditor', {
   filebrowserBrowseUrl: '/public/plugins/ckfinder/ckfinder.html?type=<?=$filesFolder?>'
});

I've specified only one parameter filebrowserBrowseUrland passed the type. Now when you open whatever, url, images or flash dialogs, it will show only one directory.

我只指定了一个参数filebrowserBrowseUrl并传递了type。现在，当您打开 url、图像或 Flash 对话框时，它只会显示一个目录。

Then in CKFinders config.php file:

然后在 CKFinders config.php 文件中：

$config['backends'][] = array(
    'name'         => 'topic_files',
    'adapter'      => 'local',
    'baseUrl'      => '/data/topics/',
   //'root'         => '', // Can be used to explicitly set the CKFinder user files directory.
    'chmodFiles'   => 0777,
    'chmodFolders' => 0755,
    'filesystemEncoding' => 'UTF-8',
);

if (!empty($_GET['type'])) {
    //Folder for topics
    if (preg_match("/^topic\d+$/", $_GET['type'])) {
        $config['resourceTypes'][] = [
            'name'              => $_GET['type'],
            'directory'         => $_GET['type'],
            'maxSize'           => 0,
            'allowedExtensions' => $allowedExtensions,
            'deniedExtensions'  => '',
            'backend'           => 'topic_files'
        ];
    }
}

If the folder (topic123) doesn't exists, it will create it when you upload a file.

如果文件夹 (topic123) 不存在，它会在您上传文件时创建它。