• Downloading from our site will require you to have a paid membership. Upgrade to a Premium Membership from 10$ a month today!

    Dont forget read our Rules! Also anyone caught Sharing this content will be banned. By using this site you are agreeing to our rules so read them. Saying I did not know is simply not an excuse! You have been warned.

Smobi

New Member
Bài viết này mình trình bày một số vấn đề sau:
  1. Tích hợp CKEditor vào CI
  2. Tích hợp CKFinder vào CKEditor
  3. Tích hợp tuỳ biến CKFinder cho việc quản lý file khi không dùng editor
  4. Bảo mật cho CKFinder.
  5. Phân chia thư mục upload trong CKFinder theo từng user, mỗi user có thư mục upload riêng và không can thiệp dữ liệu của người khác

Về vấn đề bảo mật cho CKFinder, nếu website của bạn có nhúng CKFinder và nếu người ta biết điều đó (hiển nhiên) thì họ có thể truy xuất trực tiếp vào ckfinder và upload hay can thiệp lên hệ thống của bạn. Đó đúng là một thảm hoạ thật sự
cuoinhamhiem.gif


Vấn đề chia thư mục upload, ví dụ như trong diễn đàn này, mỗi user được upload file resource của họ lên, nếu không phân chia thư mục cho từng user, mình có thể xoá tất cả file đã upload của người khác
phatsau.gif


Về vấn đề tích hợp CKEditor, mình muốn cung cấp cho các bạn một cách khác để tích hợp vào CI. Theo ý kiến cá nhân thì mình nghĩ cách này sẽ dễ dàng hơn một bài viết khác trong diễn đàn cũng đã hướng dẫn mọi người thực hiện.

Bây giờ bắt tay vào việc nào
mimcuoi.gif


Bước 1: Tải CKEditor về, lưu vào thư mục gốc của project. Hãy kiểm tra lại đường dẫn sao cho nó là: [CI root path]\ckeditor\ckeditor.php

Bước 2: Tải FCKFinder về, lưu vào thư mục application\third_party. Hãy kiểm tra lại đường dẫn sao cho nó là: application\third_party\ckfinder\ckfinder.php

Bước 3: Tạo thư mục media trong thư mục gốc của project. Thư mục này sẽ dùng để chứa tất cả file upload của user, bạn có thể thay đổi lại nếu muốn.

Bước 4: Nếu bạn có rewrite bằng htaccess, hãy cho phép rewrite tất cả các file kể cả file js và images.
Code file htaccess của mình như thế này:

Code:
RewriteEngine On
RewriteBase /

#-------------------------------------------------------------------
#               Rewrite for none www
#-------------------------------------------------------------------

RewriteCond %{HTTPS} off
RewriteCond %{HTTP_HOST} !^localhost
RewriteCond %{HTTP_HOST} !^www\.(.*)$ [NC]
RewriteRule ^(.*)$ http://www.%{HTTP_HOST}/$1 [R=301,L]

RewriteCond %{HTTPS} on
RewriteCond %{HTTP_HOST} !^localhost
RewriteCond %{HTTP_HOST} !^www\.(.*)$ [NC]
RewriteRule ^(.*)$ https://www.%{HTTP_HOST}/$1 [R=301,L]

#-------------------------------------------------------------------
#               End rewrite for none www
#-------------------------------------------------------------------

RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !^/index.php
#phải bỏ dòng dưới đây
#RewriteCond %{REQUEST_URI} (/|\.php|\.html|\.htm|\.feed|\.js|\.css|\.pdf|\.raw|/[^.]*)$  [NC]

RewriteCond $1 !^(index\.php|favicon\.ico|marketing|robots\.txt)
RewriteRule (.*) index.php
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization},L]

RewriteCond %{QUERY_STRING} mosConfig_[a-zA-Z_]{1,21}(=|\%3D) [OR]
RewriteCond %{QUERY_STRING} base64_encode.*\(.*\) [OR]
RewriteCond %{QUERY_STRING} (\<|%3C).*script.*(\>|%3E) [NC,OR]
RewriteCond %{QUERY_STRING} GLOBALS(=|\[|\%[0-9A-Z]{0,2}) [OR]
RewriteCond %{QUERY_STRING} _REQUEST(=|\[|\%[0-9A-Z]{0,2}) RewriteRule ^(.*)$ index.php [F,L]

Bước 5: Tạo controller ckfinder. Code như sau:
Lưu ý:
Từng dòng hướng dẫn mình đánh cụ thể trong code bằng dạng ghi chú luôn. Các bạn đọc code như đọc bài viết thông thường nhé

PHP:
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
/**
 * Định nghĩa các thư mục/tên của từng loại resource
 */
define('NEWS_IMAGE_FOLDER_NAME', 'images');
define('NEWS_FLASH_FOLDER_NAME', 'flashs');
define('NEWS_FILES_FOLDER_NAME', 'files');

/**
 * Thư mục gốc lưu trữ toàn bộ file upload của user
 */
define('ROOT_FILES_FOLDER', 'media/');

/**
 * [USER=20085]Pro[/USER]perty CI_Output $output 
 */
class Ckfinder extends CI_Controller {
    private $userid = 0;
    private $rootCkPath;

    public function __construct() {
        parent::__construct();
        
        /**
         * Gán và xác định userID hoặc username ở đây
         * bạn có thể lấy từ session/db hay bất kỳ đâu tuỳ hệ thống của bạn
         * hoặc bạn có thể định mỗi user/nhóm user có một id riêng => cùng chung thư mục chứa file
         */
        $this->userid = 123;

        
        if (!defined('CKFINDER_ROOT_FOLDER'))
        {
            /*
             * Đánh dấu xác thực cho phép CKFinder được phép chạy.
             * Bạn có thể đưa code kiểm tra phân quyền upload vào đây để xác thực user hiện hành có được phép upload không
             * Nếu user không được quyền upload, bạn define hằng số này = false, thì user có truy cập trực tiếp vào link
             * CFKEditor nó cũng không hoạt động
             */
            define('ALLOW_CKFINDER_FROM_CI', true);
            
            
            /*
             * Không đổi code phần này trừ khi bạn hiểu rõ bạn đang làm gì
             */
            $isQuickUpload = $this->input->get('command') == 'QuickUpload';
            $fileType = $this->input->get('type');
            
            $userPath = ROOT_FILES_FOLDER . $this->userid . '/';
            
            if ($isQuickUpload)
                $userPath .= "$fileType/";
            
            if ($isQuickUpload)
                define ('IS_QUICK_UPLOAD', TRUE);
            else
                define ('IS_QUICK_UPLOAD', FALSE);
            
            define ('CKFINDER_ROOT_FOLDER', $userPath);
        }
        
        $this->rootCkPath = FCPATH . APPPATH . 'third_party/ckfinder/';
    }

    /**
     * Bắt và xử lý các request tới controller ckfinder. 
     * Do link tới resource của ckfinder rất đa dạng nên không thể viết từng action cho từng
     * resource được mà chỉ viết action cho từng loại chung mà thôi
     * do đó code thay vì viết trong từng action sẽ được xử lý chung qua 1 phương thức
     * duy nhất là _remap
     * 
     */
    public function _remap($method, $params = array()) {
        
        $path = implode ("/", $params);
 
        /* Fix lỗi trong trường hợp subfix là .html */
        if ($method == 'index')
            $method = 'ckfinder.html';        
        
        if (file_exists($this->rootCkPath . $method) && is_file($this->rootCkPath . $method))
            $path = $method;
        elseif (!file_exists($this->rootCkPath . $path))
            $path = $method . DIRECTORY_SEPARATOR . $path;
        
        if (file_exists($this->rootCkPath . $path))
        {
            $ext = pathinfo($path, PATHINFO_EXTENSION);
            if ($ext == 'php' || $ext == 'php4' || $ext == 'php5')
            {

                $path = $this->rootCkPath . $path;
                $_SERVER['SCRIPT_FILENAME'] = $path;
                $dirname = dirname($path);
                chdir($dirname);
                require_once $path;
            }
            else//if ($ext == 'html')
            {
                $this->load->helper('file');
                $m = get_mime_by_extension($path);
                
                if (is_array($m))
                    $m = $m[0];
                
                $content = file_get_contents (APPPATH . 'third_party/ckfinder/' . $path);
                $this->output->set_header("Content-type: $m");
                $this->output->append_output($content);
            }
        }
        else
            show_404();
    }    
}
Một lưu ý đối với CI 3.x thì trong controller Ckfinder dòng

$this->rootCkPath = FCPATH . APPPATH . 'third_party/ckfinder/';

phải đổi thành

$this->rootCkPath = APPPATH . 'third_party/ckfinder/';

Hiện ít người làm việc với CI 3.x tuy nhiên trong tương lai có thể sẽ gặp lỗi này :)


Bước 6: Chỉnh sửa config.php của CKFinder
Bạn mở file application\third_party\ckfinder\config.php
Sửa code lại tương tự như sau:
PHP:
<?php  if ( ! defined('BASEPATH')) exit('No direct script access allowed');
/*
 * ### CKFinder : Configuration File - Basic Instructions
 *
 * In a generic usage case, the following tasks must be done to configure
 * CKFinder:
 *     1. Check the $baseUrl and $baseDir variables;
 *     2. If available, paste your license key in the "LicenseKey" setting;
 *     3. Create the CheckAuthentication() function that enables CKFinder for authenticated users;
 *
 * Other settings may be left with their default values, or used to control
 * advanced features of CKFinder.
 */

/**
 * This function must check the user session to be sure that he/she is
 * authorized to upload and access files in the File Browser.
 *
 * @return boolean
 */
function CheckAuthentication()
{
    // WARNING : DO NOT simply return "true". By doing so, you are allowing
    // "anyone" to upload and list the files in your server. You must implement
    // some kind of session validation here. Even something very simple as...

    // return isset($_SESSION['IsAuthorized']) && $_SESSION['IsAuthorized'];

    // ... where $_SESSION['IsAuthorized'] is set to "true" as soon as the
    // user logs in your system. To be able to use session variables don't
    // forget to add session_start() at the top of this file.

        if (defined('ALLOW_CKFINDER_FROM_CI'))            
            return ALLOW_CKFINDER_FROM_CI;
        return false;
}

// LicenseKey : Paste your license key here. If left blank, CKFinder will be
// fully functional, in demo mode.
$config['LicenseName'] = '';
$config['LicenseKey'] = '';

/*
 Uncomment lines below to enable PHP error reporting and displaying PHP errors.
 Do not do this on a production server. Might be helpful when debugging why CKFinder does not work as expected.
*/
// error_reporting(E_ALL);
// ini_set('display_errors', 1);

/*
To make it easy to configure CKFinder, the $baseUrl and $baseDir can be used.
Those are helper variables used later in this config file.
*/

/*
$baseUrl : the base path used to build the final URL for the resources handled
in CKFinder. If empty, the default value (/userfiles/) is used.

Examples:
    $baseUrl = 'http://example.com/ckfinder/files/';
    $baseUrl = '/userfiles/';

ATTENTION: The trailing slash is required.
*/


$baseUrl = '/' . CKFINDER_ROOT_FOLDER;

/*
$baseDir : the path to the local directory (in the server) which points to the
above $baseUrl URL. This is the path used by CKFinder to handle the files in
the server. Full write permissions must be granted to this directory.

Examples:
    // You may point it to a directory directly:
    $baseDir = '/home/login/public_html/ckfinder/files/';
    $baseDir = 'C:/SiteDir/CKFinder/userfiles/';

    // Or you may let CKFinder discover the path, based on $baseUrl.
    // WARNING: resolveUrl() *will not work* if $baseUrl does not start with a slash ("/"),
    // for example if $baseDir is set to  http://example.com/ckfinder/files/
    $baseDir = resolveUrl($baseUrl);

ATTENTION: The trailing slash is required.
*/
$baseDir = FCPATH . CKFINDER_ROOT_FOLDER;//resolveUrl($baseUrl);

/*
 * ### Advanced Settings
 */

/*
Thumbnails : thumbnails settings. All thumbnails will end up in the same
directory, no matter the resource type.
*/
$config['Thumbnails'] = Array(
        'url' => $baseUrl . '_thumbs',
        'directory' => $baseDir . '_thumbs',
        'enabled' => true,
        'directAccess' => false,
        'maxWidth' => 100,
        'maxHeight' => 100,
        'bmpSupported' => false,
        'quality' => 80);

/*
Set the maximum size of uploaded images. If an uploaded image is larger, it
gets scaled down proportionally. Set to 0 to disable this feature.
*/
$config['Images'] = Array(
        'maxWidth' => 1600,
        'maxHeight' => 1200,
        'quality' => 80);

/*
RoleSessionVar : the session variable name that CKFinder must use to retrieve
the "role" of the current user. The "role", can be used in the "AccessControl"
settings (bellow in this page).

To be able to use this feature, you must initialize the session data by
uncommenting the following "session_start()" call.
*/
$config['RoleSessionVar'] = 'CKFinder_UserRole';
//session_start();

/*
AccessControl : used to restrict access or features to specific folders.

Many "AccessControl" entries can be added. All attributes are optional.
Subfolders inherit their default settings from their parents' definitions.

    - The "role" attribute accepts the special '*' value, which means
      "everybody".
    - The "resourceType" attribute accepts the special value '*', which
      means "all resource types".
*/

$config['AccessControl'][] = Array(
        'role' => '*',
        'resourceType' => '*',
        'folder' => '/',

        'folderView' => true,
        'folderCreate' => true,
        'folderRename' => true,
        'folderDelete' => true,

        'fileView' => true,
        'fileUpload' => true,
        'fileRename' => true,
        'fileDelete' => true);

/*
For example, if you want to restrict the upload, rename or delete of files in
the "Logos" folder of the resource type "Images", you may uncomment the
following definition, leaving the above one:

$config['AccessControl'][] = Array(
        'role' => '*',
        'resourceType' => 'Images',
        'folder' => '/Logos',

        'folderView' => true,
        'folderCreate' => true,
        'folderRename' => true,
        'folderDelete' => true,

        'fileView' => true,
        'fileUpload' => false,
        'fileRename' => false,
        'fileDelete' => false);
*/

/*
ResourceType : defines the "resource types" handled in CKFinder. A resource
type is nothing more than a way to group files under different paths, each one
having different configuration settings.

Each resource type name must be unique.

When loading CKFinder, the "type" querystring parameter can be used to display
a specific type only. If "type" is omitted in the URL, the
"DefaultResourceTypes" settings is used (may contain the resource type names
separated by a comma). If left empty, all types are loaded.

maxSize is defined in bytes, but shorthand notation may be also used.
Available options are: G, M, K (case insensitive).
1M equals 1048576 bytes (one Megabyte), 1K equals 1024 bytes (one Kilobyte), 1G equals one Gigabyte.
Example: 'maxSize' => "8M",
*/
$config['DefaultResourceTypes'] = '';

$config['ResourceType'][] = Array(
        'name' => ucfirst(NEWS_FILES_FOLDER_NAME),                // Single quotes not allowed
        'url' => $baseUrl . (IS_QUICK_UPLOAD?'':NEWS_FILES_FOLDER_NAME),
        'directory' => $baseDir . (IS_QUICK_UPLOAD?'':NEWS_FILES_FOLDER_NAME),
        'maxSize' => 0,
        'allowedExtensions' => '7z,aiff,asf,avi,bmp,csv,doc,docx,fla,flv,gif,gz,gzip,jpeg,jpg,mid,mov,mp3,mp4,mpc,mpeg,mpg,ods,odt,pdf,png,ppt,pptx,pxd,qt,ram,rar,rm,rmi,rmvb,rtf,sdc,sitd,swf,sxc,sxw,tar,tgz,tif,tiff,txt,vsd,wav,wma,wmv,xls,xlsx,zip',
        'deniedExtensions' => '');

$config['ResourceType'][] = Array(
        'name' => ucfirst(NEWS_IMAGE_FOLDER_NAME),
        'url' => $baseUrl . (IS_QUICK_UPLOAD?'':NEWS_IMAGE_FOLDER_NAME),
        'directory' => $baseDir . (IS_QUICK_UPLOAD?'':NEWS_IMAGE_FOLDER_NAME),
        'maxSize' => 0,
        'allowedExtensions' => 'bmp,gif,jpeg,jpg,png',
        'deniedExtensions' => '');

$config['ResourceType'][] = Array(
        'name' => ucfirst(NEWS_FLASH_FOLDER_NAME),
        'url' => $baseUrl . (IS_QUICK_UPLOAD?'':NEWS_FLASH_FOLDER_NAME),
        'directory' => $baseDir . (IS_QUICK_UPLOAD?'':NEWS_FLASH_FOLDER_NAME),
        'maxSize' => 0,
        'allowedExtensions' => 'swf,flv',
        'deniedExtensions' => '');

/*
 Due to security issues with Apache modules, it is recommended to leave the
 following setting enabled.

 How does it work? Suppose the following:

    - If "php" is on the denied extensions list, a file named foo.php cannot be
      uploaded.
    - If "rar" (or any other) extension is allowed, one can upload a file named
      foo.rar.
    - The file foo.php.rar has "rar" extension so, in theory, it can be also
      uploaded.

In some conditions Apache can treat the foo.php.rar file just like any PHP
script and execute it.

If CheckDoubleExtension is enabled, each part of the file name after a dot is
checked, not only the last part. In this way, uploading foo.php.rar would be
denied, because "php" is on the denied extensions list.
*/
$config['CheckDoubleExtension'] = true;

/*
Increases the security on an IIS web server.
If enabled, CKFinder will disallow creating folders and uploading files whose names contain characters
that are not safe under an IIS web server.
*/
$config['DisallowUnsafeCharacters'] = false;

/*
If you have iconv enabled (visit http://php.net/iconv for more information),
you can use this directive to specify the encoding of file names in your
system. Acceptable values can be found at:
    http://www.gnu.org/software/libiconv/

Examples:
    $config['FilesystemEncoding'] = 'CP1250';
    $config['FilesystemEncoding'] = 'ISO-8859-2';
*/
$config['FilesystemEncoding'] = 'UTF-8';

/*
Perform additional checks for image files
if set to true, validate image size
*/
$config['SecureImageUploads'] = true;

/*
Indicates that the file size (maxSize) for images must be checked only
after scaling them. Otherwise, it is checked right after uploading.
*/
$config['CheckSizeAfterScaling'] = true;

/*
For security, HTML is allowed in the first Kb of data for files having the
following extensions only.
*/
$config['HtmlExtensions'] = array('html', 'htm', 'xml', 'js');

/*
Folders to not display in CKFinder, no matter their location.
No paths are accepted, only the folder name.
The * and ? wildcards are accepted.
*/
$config['HideFolders'] = Array(".svn", "CVS");

/*
Files to not display in CKFinder, no matter their location.
No paths are accepted, only the file name, including extension.
The * and ? wildcards are accepted.
*/
$config['HideFiles'] = Array(".*");

/*
After file is uploaded, sometimes it is required to change its permissions
so that it was possible to access it at the later time.
If possible, it is recommended to set more restrictive permissions, like 0755.
Set to 0 to disable this feature.
Note: not needed on Windows-based servers.
*/
$config['ChmodFiles'] = 0777 ;

/*
See comments above.
Used when creating folders that does not exist.
*/
$config['ChmodFolders'] = 0755 ;

/*
Force ASCII names for files and folders.
If enabled, characters with diactric marks, like å, ä, ö, ć, č, đ, š
will be automatically converted to ASCII letters.
*/
$config['ForceAscii'] = false;

/*
Send files using X-Sendfile module
Mod X-Sendfile (or similar) is avalible on Apache2, Nginx, Cherokee, Lighttpd

Enabling X-Sendfile option can potentially cause security issue.
 - server path to the file may be send to the browser with X-Sendfile header
 - if server is not configured properly files will be send with 0 length

For more complex configuration options visit our Developer's Guide
  http://docs.cksource.com/CKFinder_2.x/Developers_Guide/PHP
*/
$config['XSendfile'] = false;

$config['plugin_imageresize']['smallThumb'] = '90x90';
$config['plugin_imageresize']['mediumThumb'] = '120x120';
$config['plugin_imageresize']['largeThumb'] = '180x180';


$GLOBALS['config'] = $config;
include_once "plugins/imageresize/plugin.php";
include_once "plugins/fileeditor/plugin.php";
include_once "plugins/zip/plugin.php";
Nếu muốn tuỳ chỉnh các thông số cấu hình thì thay đổi theo yêu cầu của bạn. Tuy nhiên lưu ý các hằng số đường dẫn tốt nhất không nên thay đổi.

Bước 7: Ngắm nhìn thành quả của CKFinder.
Bạn vào link http:// localhost/ci213/index.php/ckfinder/ckfinder.html
ci213 là tên của project của bạn
nếu bạn có rewrite bỏ index.php thì không cần thêm index.php trong link
Nếu mọi việc thuận lợi, CKFinder sẽ hiện lên và bạn có thể thao tác bình thường.

Bước 8: Tạo editor_helper để tích hợp CKEditor. Code của helper như sau:
PHP:
<?php

if (!defined('BASEPATH'))
    exit('No direct script access allowed');

function loadEditer() {
    $obj = & get_instance();

    if (isset($obj->ckeditor))
        return;

    if (!class_exists('CKEditor')) {
        require_once FCPATH . 'ckeditor/ckeditor.php';
    }
    if (!class_exists('CKFinder')) {
        require_once FCPATH . APPPATH . 'third_party/ckfinder/ckfinder.php';
    }
    $obj->ckeditor = new CKeditor(base_url() . "ckeditor/");
    $obj->ckeditor->returnOutput = true;

    $obj->ckfinder = new CKFinder(site_url("/ckfinder/"));
    $obj->ckfinder->SetupCKEditor($obj->ckeditor, site_url("/ckfinder/"));
}

function editerGetDefaultConfig() {

    $config = array(
        "fullPage" => false,
        "extraPlugins" => 'docprops,autogrow,tableresize',
        "enterMode" => "CKEDITOR.ENTER_BR",
        "shiftEnterMode" => "CKEDITOR.ENTER_P",
        "autoGrow_maxHeight" => 800,
        "skin" => 'kama',
        "language" => 'vi',
        "jqueryOverrideVal" => true,
        //"toolbar"=>$toolbar,
        "removePlugins" => 'resize'
    );
    return $config;
}


function editerGetEnConfig() {

    $config = array(
        "fullPage" => false,
        "extraPlugins" => 'docprops,autogrow,tableresize',
        "enterMode" => "CKEDITOR.ENTER_BR",
        "shiftEnterMode" => "CKEDITOR.ENTER_P",
        "autoGrow_maxHeight" => 800,
        "skin" => 'kama',
        "language" => 'en',
        "jqueryOverrideVal" => true,
        //"toolbar"=>$toolbar,
        "removePlugins" => 'resize'
    );
    return $config;
}

loadEditer();
editerGetDefaultConfig và editerGetEnConfig là các function tạo các thông số khác nhau khi tạo editor. Số lượng các function này tuỳ số kiểu hiển thị mà bạn cần. Ở đây mình ví dụ 2 function cho 2 ngôn ngữ khác nhau là VI và EN.

Tiếp theo là các bước tích hợp vào CI
Bước 8: Tạo controller welcome code như sau:

PHP:
<?php

if (!defined('BASEPATH'))
    exit('No direct script access allowed');

class Welcome extends CI_Controller
{

    public function index()
    {
        $data = array();
        $this->load->helper(array('url', 'editor_helper'));
        $data['ckediter'] = $this->ckeditor->replace("demo", editerGetEnConfig());
        $data['ckediter2'] = $this->ckeditor->replace("demo2", editerGetDefaultConfig());
        $this->load->view('welcome_message', $data);
    }

}
Trong đó có 2 lệnh load 2 editor khác nhau, nếu trên view bạn cần hiển thị nhiều hơn nữa các editor thì làm tương tự. Lưu ý đặc biệt ở đây là thứ tự khởi tạo các editor trong controller và thứ tự echo trên view. Editor nào được khởi tạo đầu tiên (ở đây là demo) thì BẮT BUỘC phải echo ra đầu tiên trên view. Các editor tiếp theo không quan trọng thứ tự. Nếu không bạn sẽ gặp lỗi editor không hiển thị.

Bước 9: Code view welcome_message:

PHP:
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Welcome to CodeIgniter</title>

    </head>
    <body>

        <div id="container">

            <div id="body">
                <input type="button" value="Duyệt hình" onclick="BrowseServer()"/> <input type="text" id="image" style="width: 80%"/>

                <textarea id="demo" name="demo"></textarea>

                <textarea id="demo2" name="demo2"></textarea>
            </div>

            <p class="footer">Page rendered in <strong>{elapsed_time}</strong> seconds</p>
        </div>

        <?php echo $ckediter; //bắt buộc phải xuất biến này trước các editor khác do trong controller khởi tạo nó đầu tiên ?>
        <?php echo $ckediter2 ?>

        <script type="text/javascript">

            function BrowseServer()
            {
                var finder = new CKFinder();
                finder.BasePath = '<?php echo site_url() ?>/ckfinder/';
                finder.SelectFunction = SetFileField;
                //finder.SelectFunctionData = 'images' ;
                finder.Popup();
            }

            function SetFileField(fileUrl, data)
            {
                //alert('Bạn đã chọn file: ' + fileUrl);
                    document.getElementById("image").setAttribute("value", fileUrl);
            }

        </script>
        <script type="text/javascript" src="<?php echo site_url() ?>/ckfinder/ckfinder_v1.js"></script>
    </body>
</html>
Bước 10: Vào link http://localhost/ci213/index.php/welcome để tận hưởng thành quả.
Click nút "Duyệt hình" bạn sẽ thấy CKFinder chạy độc lập (không tích hợp vào CKEditor).

Download toàn bộ source ví dụ ở đây:
http://www.chuongduong.net/link/17034
 

Facebook Comments

Similar threads
Thread starter Title Forum Replies Date
cuongpro9x Share Tích hợp toàn bộ sticker xịn của zalo vào xenforo Xenforo 0
F Fshare tích hợp phương thức thanh toán thẻ Gate thay thẻ cào cho người dùng trên website Tin tức CNTT 0
P Thủ thuật Hướng dẫn tích hợp gói cập nhật Convenience Rollup vào ISO cài đặt Windows 7 Thủ thuật máy tính 0
P Phần mềm PC Windows 7 Professional With Sp1 VL x86 - Tích hợp gói cập nhật tháng 5 năm 2016 (Convenience Rollup) Hệ điều hành 0
P Windows 7 Enterprise With Sp1 VL x86 - Tích hợp gói cập nhật tháng 5 năm 2016 (Convenience Rollup) Hệ điều hành 0
P Phần mềm PC Windows 7 Enterprise With Sp1 x64 - Tích hợp gói cập nhật tháng 5 năm 2016 (Convenience Rollup) Hệ điều hành 0
P Phần mềm PC Windows 7 AIO Pro SP1 VL tích hợp gói cập nhật tháng 5 năm 2016 (Convenience Rollup) Hệ điều hành 0
P Windows 7 Professional With Sp1 VL x64 - Tích hợp gói cập nhật tháng 5 năm 2016 (Convenience Rollup) Hệ điều hành 0
V Thảo luận iVne.Net Cổng Tích Hợp Thanh Toán Việt Thảo luận wap việt 0
T Hỏi Cách Tích Hợp Login FB Cho Site PHP 5
Admin Tổng hợp 45 đề tài quản lý phân tích thiết kế hệ thống chi tiết Sách, truyện, tài liệu 0
PushKiss Share Tích hợp Google Webmaster Tools vào trang wap của bạn Thảo luận wap việt 0
Admin Bốn nhà mạng Mỹ xây dựng xong cơ sở dữ liệu về điện thoại bị trộm, có thể tích hợp với quốc tế Tin tức, sự kiện thường ngày 0
Admin Share theme bazar shop bán hàng tuyệt đẹp cho wordpress tích hợp woocomerce Wordpress 1
Admin Google chính thức phân phối Hangouts 2.0 cho Android, tích hợp khả năng gửi nhận SMS/MMS Tin tức CNTT 0
Admin Huawei UltraStick: thẻ nhớ SD tích hợp kết nối 3G bằng Nano SIM, không có bộ nhớ Tin tức CNTT 0
Admin Batthead: pin tích hợp Bluetooth để điều khiển đồ điện tử từ xa bằng smartphone Tin tức CNTT 1
Admin HP Envy 17 Leap Motion SE - máy tính xách tay đầu tiên tích hợp cảm biến cử chỉ 3D Leap Motion Tin tức, giới thiệu về ĐTDĐ 1
I Ứng dụng Messaging bị loại bỏ trên Windows 8.1, được tích hợp vào Skype Tin tức CNTT 0
Admin Hướng dẫn tích hợp công cụ đính kèm miễn phí 300 mb vào bộ soạn thảo xenforo Xenforo 0
blog4me S40 ★ →Ứng Dụng Gửi Và Tự TạoLogo Cực Kì Hay! Tích Hợp Sẵn100 Logo Cho ae Tha Hồ Chọn!← ★ Android, ios, java, windows phone 12
S Tích hợp thanh toán qua SMS và thẻ cào cho các site WAP,web Thảo luận wap việt 0
Admin Seo thanks for post phpBB - Tích hợp mod thanks và phpBB seo Phpbb3x 0
Admin Cài đặt Tích hợp XCache vào PHP5 trên CentOS 5.x 6.x VPS & Dedicated Server 0
1 Share - shop + tích hợp avatar gunny với vbcredits All Shared Scripts 0
Admin Share mod shop tích hợp avatar gunny với vbCredits Vbulletin 1
Admin Share code mạng xã hội đã tích hợp vbb Vbulletin 3
Admin [Xtscript] tích hợp filelist và bộ đếm lượt tải vào 1 file index Wap builder, wapego, xtgem, wen.ru, wapka, wap4 0
S Sony trình làng máy ảnh zoom 30x tích hợp GPS tại VN Mạng internet 0
Admin Share skin mobile cho VBB 3.8.x tích hợp chatbox ở index Style vbb 0
Admin Bangladesh: Chìm phà, hơn 100 người mất tích (Tổng hợp tin HOT 14/3) Tin tức, sự kiện thường ngày 0
Admin [Share] toàn bộ code mxh Thơ Ngây! Me cho các bạn tìm hiểu (đã tích hợp VBB 4.0.x bản quyền) Mã nguồn web 0
katy Android MyPoint: Nạp thẻ mọi nơi - Tích điểm trọn đời Điện thoại di động 14
katy Android Liên kết MyPoint hôm nay - Tích điểm cùng My MobiFone mỗi ngày Điện thoại di động 0
katy Android Đổi điểm tích luỹ "Kết nối dài lâu" MobiFone nhận quà - Tiền, Data, Phút gọi Điện thoại di động 0
katy Android NÓNG! Tích điểm mọi giao dịch đã có trên app My MobiFone Điện thoại di động 27
katy Android Hướng dẫn đổi điểm KNDL và điểm tích lũy MobiFone lấy data Điện thoại di động 0
katy Android Hướng dẫn đổi điểm KNDL và điểm tích lũy MobiFone lấy data Điện thoại di động 0
katy Android Hướng dẫn đổi điểm KNDL và điểm tích lũy MobiFone lấy data Điện thoại di động 0
katy Android My Point: Tích điểm muôn nơi – Nhận ngàn ưu đãi Điện thoại di động 0
katy Android Vào app My MobiFone : Tích điểm ngay – Nhận ngàn quà hay Điện thoại di động 30
katy Android Tích điểm dễ dàng nhận ngàn quà tặng ngay trên app My MobiFone Điện thoại di động 23
katy Android Vào app MyMobiFone tích điểm nhận Tai nghe, Pin sạc dự phòng, Loa Bluetooh Điện thoại di động 0
katy Android Giải trí thỏa thích - Tích chọn MXH100 ngay Điện thoại di động 10
katy Android My MobiFone: Tích điểm liền tay, nhận quà khủng Điện thoại di động 14
katy Android Đổi điểm tích lũy nhận hàng ngàn phần quà hấp dẫn cùng MobiFone Điện thoại di động 8
katy Android Tích điểm nhận quà cùng MobiFone nhân dịp 30 năm thành lập Điện thoại di động 10
katy Android Đổi điểm tích lũy MobiFone lấy Datacode và các sản phẩm dịch vụ Điện thoại di động 13
katy Android Vào app tích điểm - Đổi quà cực to cùng My MobiFone Điện thoại di động 12
katy Android MobiFone tri ân Khách hàng - Đổi điểm tích lũy chọn quà như ý Điện thoại di động 22

Similar threads

New posts New threads New resources

Back
Top