Repository: ckfinder/ckfinder-laravel-package
Branch: master
Commit: 266e31e17496
Files: 30
Total size: 62.2 KB
Directory structure:
gitextract_j_y8v1bc/
├── .gitignore
├── LICENSE.md
├── README.md
├── composer.json
├── src/
│ ├── CKFinderMiddleware.php
│ ├── CKFinderServiceProvider.php
│ ├── Command/
│ │ └── CKFinderDownloadCommand.php
│ ├── Controller/
│ │ └── CKFinderController.php
│ ├── config.php
│ └── routes.php
└── views/
├── browser.blade.php
├── samples/
│ ├── ckeditor.blade.php
│ ├── full-page-open.blade.php
│ ├── full-page.blade.php
│ ├── index.blade.php
│ ├── layout.blade.php
│ ├── localization.blade.php
│ ├── modals.blade.php
│ ├── other-custom-configuration.blade.php
│ ├── other-read-only.blade.php
│ ├── plugin-examples.blade.php
│ ├── popups.blade.php
│ ├── skins-jquery-mobile.blade.php
│ ├── skins-moono.blade.php
│ ├── user-interface-compact.blade.php
│ ├── user-interface-default.blade.php
│ ├── user-interface-listview.blade.php
│ ├── user-interface-mobile.blade.php
│ └── widget.blade.php
└── setup.blade.php
================================================
FILE CONTENTS
================================================
================================================
FILE: .gitignore
================================================
vendor/
_connector/
public/
composer.lock
================================================
FILE: LICENSE.md
================================================
Software License Agreement
==========================
Copyright (c) 2023, CKSource Holding sp. z o.o. All rights reserved.
CKFinder package for Laravel is licensed under the terms of the MIT license (see Appendix A).
Trademarks
----------
CKFinder is a trademark of CKSource Holding sp. z o.o. All other brand
and product names are trademarks, registered trademarks or service
marks of their respective holders.
Sources of Intellectual Property required by package
----------------------------------------------------
The installation instruction requires user to run the following command to download
CKFinder separately (the file manager itself):
```bash
artisan ckfinder:download
```
The downloaded CKFinder distribution is licensed under a separate CKFinder License.
---
Appendix A: The MIT License
---------------------------
The MIT License (MIT)
Copyright (c) 2023, CKSource Holding sp. z o.o. All rights reserved.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
================================================
FILE: README.md
================================================
# CKFinder 3 Package for Laravel 9+ [](https://twitter.com/intent/tweet?text=Check%20out%20CKFinder%20package%20for%20Laravel%20&url=https://github.com/ckfinder/ckfinder-laravel-package)
[]()
[](https://opensource.org/licenses/MIT)
[](https://packagist.org/packages/ckfinder/ckfinder-laravel-package)
[](https://packagist.org/packages/ckfinder/ckfinder-laravel-package)
[](http://eepurl.com/c3zRPr)
[](https://twitter.com/ckeditor)
This repository contains the CKFinder 3 Package for Laravel 9+. If you are looking for a package for older version of Laravel, please use [version 3](https://github.com/ckfinder/ckfinder-laravel-package/tree/v3.x.x).
## Installation
1. Add a Composer dependency and install the package.
```bash
composer require ckfinder/ckfinder-laravel-package
```
2. Run the command to download the CKFinder code.
After installing the Laravel package you need to download CKFinder code. It is not shipped with the package due to different license terms. To install it, run the following `artisan` command:
```bash
php artisan ckfinder:download
```
It will download the required code and place it inside an appropriate directory of the package (`vendor/ckfinder/ckfinder-laravel-package/`).
3. Publish the CKFinder connector configuration and assets.
```bash
php artisan vendor:publish --tag=ckfinder-assets --tag=ckfinder-config
```
This will publish CKFinder assets to `public/js/ckfinder`, and the CKFinder connector configuration to `config/ckfinder.php`.
You can also publish the views used by this package in case you need custom route names, different assets location, file browser customization etc.
```bash
php artisan vendor:publish --tag=ckfinder-views
```
Finally, you can publish package's configuration, assets and views using only one command.
```bash
php artisan vendor:publish --tag=ckfinder
```
4. Create a directory for CKFinder files and allow for write access to it. By default CKFinder expects the files to be placed in `public/userfiles` (this can be altered in the configuration).
```bash
mkdir -m 777 public/userfiles
```
**NOTE:** Since usually setting permissions to `0777` is insecure, it is advisable to change the group ownership of the directory to the same user as Apache and add group write permissions instead. Please contact your system administrator in case of any doubts.
5. CKFinder by default uses a CSRF protection mechanism based on [double submit cookies](https://cheatsheetseries.owasp.org/cheatsheets/Cross-Site_Request_Forgery_Prevention_Cheat_Sheet.html#double-submit-cookie). On some configurations it may be required to configure Laravel not to encrypt the cookie set by CKFinder. To do that:
**For Laravel <= 10:**
Please add the cookie name `ckCsrfToken` to the `$except` property of `EncryptCookies` middleware:
```php
// app/Http/Middleware/EncryptCookies.php
namespace App\Http\Middleware;
use Illuminate\Cookie\Middleware\EncryptCookies as Middleware;
class EncryptCookies extends Middleware
{
/**
* The names of the cookies that should not be encrypted.
*
* @var array
*/
protected $except = [
'ckCsrfToken',
// ...
];
}
```
You should also disable Laravel's CSRF protection for CKFinder's path, as CKFinder uses its own CSRF protection mechanism. This can be done by adding `ckfinder/*` pattern to the `$except` property of `VerifyCsrfToken` middleware:
```php
// app/Http/Middleware/VerifyCsrfToken.php
namespace App\Http\Middleware;
use Illuminate\Foundation\Http\Middleware\VerifyCsrfToken as Middleware;
class VerifyCsrfToken extends Middleware
{
/**
* The URIs that should be excluded from CSRF verification.
*
* @var array
*/
protected $except = [
'ckfinder/*',
// ...
];
}
```
**For Laravel >= 11:**
Two calls must be added, which introduce exceptions in CSRF protection mechanism.
First one configure Laravel not to encrypt the cookie set by CKFinder:
```php
$middleware->encryptCookies(except: [
'ckCsrfToken',
]);
```
Second one disables Laravel's CSRF protection for CKFinder's path:
```php
$middleware->validateCsrfTokens(except: [
'ckfinder/*'
]);
```
File `bootstrap/app.php` should look like this:
```php
// bootstrap/app.php
use Illuminate\Foundation\Application;
use Illuminate\Foundation\Configuration\Exceptions;
use Illuminate\Foundation\Configuration\Middleware;
return Application::configure(basePath: dirname(__DIR__))
->withRouting(
web: __DIR__.'/../routes/web.php',
commands: __DIR__.'/../routes/console.php',
health: '/up',
)
->withMiddleware(function (Middleware $middleware): void {
$middleware->validateCsrfTokens(except: [
'ckfinder/*'
]);
$middleware->encryptCookies(except: [
'ckCsrfToken',
]);
})
->withExceptions(function (Exceptions $exceptions): void {
})->create();
```
At this point you should see the connector JSON response after navigating to the `/ckfinder/connector?command=Init` address.
Authentication for CKFinder is not configured yet, so you will see an error response saying that CKFinder is not enabled.
## Configuring Authentication
CKFinder connector authentication is handled by [middleware](https://laravel.com/docs/5.8/middleware) class or alias. To create the custom middleware class, use the artisan command:
```bash
php artisan make:middleware CustomCKFinderAuth
```
The new middleware class will appear in `app/Http/Middleware/CustomCKFinderAuth.php`. Change the `authentication` option in `config/ckfinder.php`:
```php
$config['authentication'] = '\App\Http\Middleware\CustomCKFinderAuth';
```
The `handle` method in `CustomCKFinderAuth` class allows to authenticate CKFinder users. A basic implementation that returns `true` from the `authentication` callable (which is obviously **not secure**) can look like below:
```php
public function handle($request, Closure $next)
{
config(['ckfinder.authentication' => function() {
return true;
}]);
return $next($request);
}
```
Please have a look at the [CKFinder for PHP connector documentation](https://ckeditor.com/docs/ckfinder/ckfinder3-php/configuration.html#configuration_options_authentication) to find out
more about this option.
**Note**:
Alternatively, you can set the configuration option `$config['loadRoutes'] = false;` in `config/ckfinder.php`. Then you copy the routes from `vendor/ckfinder/ckfinder-laravel-package/src/routes.php` to your application routes such as ```routes/web.php``` to protect them with your Laravel auth middleware.
```php
Route::any('/ckfinder/connector', '\CKSource\CKFinderBridge\Controller\CKFinderController@requestAction')
->name('ckfinder_connector');
Route::any('/ckfinder/browser', '\CKSource\CKFinderBridge\Controller\CKFinderController@browserAction')
->name('ckfinder_browser');
```
## Configuration Options
The CKFinder connector configuration is taken from the `config/ckfinder.php` file.
To find out more about possible connector configuration options please refer to the [CKFinder for PHP connector documentation](https://ckeditor.com/docs/ckfinder/ckfinder3-php/configuration.html).
## Usage
The package code contains a couple of usage examples that you may find useful. To enable them, uncomment the `ckfinder_examples`
route in `vendor/ckfinder/ckfinder-laravel-package/src/routes.php`:
```php
// vendor/ckfinder/ckfinder-laravel-package/src/routes.php
Route::any('/ckfinder/examples/{example?}', 'CKSource\CKFinderBridge\Controller\CKFinderController@examplesAction')
->name('ckfinder_examples');
```
After that you can navigate to the `/ckfinder/examples` path and have a look at the list of available examples.
To find out about the code behind them, check the `views/samples` directory in the package (`vendor/ckfinder/ckfinder-laravel-package/views/samples/`).
### Including the Main CKFinder JavaScript File in Templates
To be able to use CKFinder on a web page you have to include the main CKFinder JavaScript file.
The preferred way to do that is to include the CKFinder setup template, as shown below:
```blade
@include('ckfinder::setup')
```
The included template renders the required `script` tags and configures a valid connector path.
```html
```
---
## Useful Links
* [CKFinder 3 usage examples](https://ckeditor.com/docs/ckfinder/demo/ckfinder3/samples/widget.html)
* [CKFinder 3 for PHP connector documentation](https://ckeditor.com/docs/ckfinder/ckfinder3-php/)
* [CKFinder 3 Developer's Guide](https://ckeditor.com/docs/ckfinder/ckfinder3/)
* [CKFinder 3 issue tracker](https://github.com/ckfinder/ckfinder)
================================================
FILE: composer.json
================================================
{
"name": "ckfinder/ckfinder-laravel-package",
"description": "CKFinder 3 package for Laravel",
"type": "library",
"license": "MIT",
"require": {
"php": ">=8.1.0",
"laravel/framework": "^9.0|^10.0|^11.0|^12.0",
"pimple/pimple": "~3.0",
"league/flysystem": "^3.0",
"league/flysystem-aws-s3-v3": "^3.0",
"league/flysystem-azure-blob-storage": "^3.0",
"league/flysystem-ftp": "^3.0",
"spatie/flysystem-dropbox": "^2.0|^3.0",
"ext-json": "*",
"ext-gd": "*",
"ext-zip": "*"
},
"autoload": {
"psr-4": {
"CKSource\\CKFinderBridge\\": "src/",
"CKSource\\CKFinder\\": "_connector/"
}
},
"extra": {
"laravel": {
"providers": [
"CKSource\\CKFinderBridge\\CKFinderServiceProvider"
]
}
}
}
================================================
FILE: src/CKFinderMiddleware.php
================================================
function() use ($request) {
return false;
}] );
return $next($request);
}
}
================================================
FILE: src/CKFinderServiceProvider.php
================================================
loadRoutesFrom(__DIR__.'/routes.php');
}
$this->loadViewsFrom(__DIR__.'/../views', 'ckfinder');
if ($this->app->runningInConsole()) {
$this->commands([CKFinderDownloadCommand::class]);
$this->publishes([
__DIR__.'/config.php' => config_path('ckfinder.php')
], ['ckfinder-config']);
$this->publishes([
__DIR__.'/../public' => public_path('js')
], ['ckfinder-assets']);
$this->publishes([
__DIR__.'/../views/setup.blade.php' => resource_path('views/vendor/ckfinder/setup.blade.php'),
__DIR__.'/../views/browser.blade.php' => resource_path('views/vendor/ckfinder/browser.blade.php')
], ['ckfinder-views']);
return;
}
$this->app->bind('ckfinder.connector', function() {
if (!class_exists('\CKSource\CKFinder\CKFinder')) {
throw new \Exception(
"Couldn't find CKFinder conector code. ".
"Please run `artisan ckfinder:download` command first."
);
}
$ckfinderConfig = config('ckfinder');
if (is_null($ckfinderConfig)) {
throw new \Exception(
"Couldn't load CKFinder configuration file. ".
"Please run `artisan vendor:publish --tag=ckfinder` command first."
);
}
$ckfinder = new \CKSource\CKFinder\CKFinder($ckfinderConfig);
return $ckfinder;
});
}
}
================================================
FILE: src/Command/CKFinderDownloadCommand.php
================================================
error('The target public directory is not writable (used path: ' . $targetPublicPath . ').');
return;
}
$targetConnectorPath = realpath(__DIR__ . '/../../_connector');
if (!is_writable($targetConnectorPath)) {
$this->error('The the connector directory is not writable (used path: ' . $targetConnectorPath . ').');
return;
}
if (file_exists($targetPublicPath.'/ckfinder/ckfinder.js')) {
$questionText =
'It looks like the CKFinder distribution package has already been installed. ' .
"This command will overwrite the existing files.\nDo you want to proceed? [y/n]: ";
if (!$this->confirm($questionText)) {
return;
}
}
/** @var \Symfony\Component\Console\Helper\ProgressBar $progressBar */
$progressBar = null;
$maxBytes = 0;
$ctx = stream_context_create([], [
'notification' =>
function ($notificationCode, $severity, $message, $messageCode, $bytesTransferred, $bytesMax) use (&$maxBytes, &$progressBar) {
switch ($notificationCode) {
case STREAM_NOTIFY_FILE_SIZE_IS:
$maxBytes = $bytesMax;
$progressBar = $this->output->createProgressBar($bytesMax);
break;
case STREAM_NOTIFY_PROGRESS:
$progressBar->setProgress($bytesTransferred);
break;
}
}
]);
$this->info('Downloading the CKFinder 3 distribution package.');
$zipContents = @file_get_contents($this->buildPackageUrl(), false, $ctx);
if ($zipContents === false) {
$this->error('Could not download the distribution package of CKFinder.');
return;
}
if ($progressBar) {
$progressBar->finish();
}
$this->line("\n" . 'Extracting CKFinder to the ' . $targetPublicPath . ' directory.');
$tempZipFile = tempnam(sys_get_temp_dir(), 'tmp');
file_put_contents($tempZipFile, $zipContents);
$zip = new \ZipArchive();
$zip->open($tempZipFile);
$zipEntries = [];
// These files won't be overwritten if already exists
$filesToKeep = [
'ckfinder/config.js',
'ckfinder/ckfinder.html'
];
for ($i = 0; $i < $zip->numFiles; $i++) {
$entry = $zip->getNameIndex($i);
if (in_array($entry, $filesToKeep) && file_exists($targetPublicPath . '/' . $entry)) {
continue;
}
$zipEntries[] = $entry;
}
$zip->extractTo($targetPublicPath, $zipEntries);
$fs = new Filesystem();
$this->line('Moving the CKFinder connector to the ' . $targetConnectorPath . ' directory.');
$fs->moveDirectory(
$targetPublicPath . '/ckfinder/core/connector/php/vendor/cksource/ckfinder/src/CKSource/CKFinder',
$targetConnectorPath,
true
);
$this->line('Cleaning up.');
$fs->delete([
$tempZipFile,
$targetPublicPath . '/ckfinder/config.php',
$targetPublicPath . '/ckfinder/README.md',
$targetConnectorPath . '/README.md'
]);
$fs->deleteDirectory($targetPublicPath . '/ckfinder/core');
$fs->deleteDirectory($targetPublicPath . '/ckfinder/userfiles');
$this->info('Done. Happy coding!');
}
}
================================================
FILE: src/Controller/CKFinderController.php
================================================
middleware($authenticationMiddleware);
} else {
$this->middleware(\CKSource\CKFinderBridge\CKFinderMiddleware::class);
}
}
}
/**
* Action that handles all CKFinder requests.
*
* @param ContainerInterface $container
* @param Request $request
*
* @return \Symfony\Component\HttpFoundation\Response
*/
public function requestAction(ContainerInterface $container, Request $request)
{
/** @var CKFinder $connector */
$connector = $container->get('ckfinder.connector');
// If debug mode is enabled then do not catch exceptions and pass them directly to Laravel.
$enableDebugMode = config('ckfinder.debug');
return $connector->handle($request, HttpKernelInterface::MAIN_REQUEST, !$enableDebugMode);
}
/**
* Action that displays CKFinder browser.
*
* @return string
*/
public function browserAction(ContainerInterface $container, Request $request)
{
return view('ckfinder::browser');
}
/**
* Action for CKFinder usage examples.
*
* To browse examples, please uncomment ckfinder_examples route in
* vendor/ckfinder/ckfinder-laravel-package/src/routes.php
*
* @param string|null $example
*/
public function examplesAction($example = null)
{
$example = strtolower($example);
$knownExamples = [
'integration' => ['widget', 'popups', 'modals', 'full-page', 'full-page-open'],
'ckeditor' => ['ckeditor'],
'skins' => ['skins-moono', 'skins-jquery-mobile'],
'user-interface' => ['user-interface-default', 'user-interface-compact', 'user-interface-mobile', 'user-interface-listview'],
'localization' => ['localization'],
'other' => ['other-read-only', 'other-custom-configuration'],
'plugin-examples' => ['plugin-examples'],
];
$navInfo = ['section' => null, 'sample' => null];
foreach ($knownExamples as $section => $examples) {
if (in_array($example, $examples)) {
$navInfo['section'] = $section;
$navInfo['sample'] = $example;
return view('ckfinder::samples/'.$example, $navInfo);
}
}
return view('ckfinder::samples/index', $navInfo);
}
}
================================================
FILE: src/config.php
================================================
'laravel_cache',
'tags' => 'ckfinder/tags',
'cache' => 'ckfinder/cache',
'thumbs' => 'ckfinder/cache/thumbs',
'logs' => array(
'backend' => 'laravel_logs',
'path' => 'ckfinder/logs'
)
);
/*============================ Images and Thumbnails ==================================*/
// http://docs.cksource.com/ckfinder3-php/configuration.html#configuration_options_images
$config['images'] = array(
'maxWidth' => 1600,
'maxHeight' => 1200,
'quality' => 80,
'sizes' => array(
'small' => array('width' => 480, 'height' => 320, 'quality' => 80),
'medium' => array('width' => 600, 'height' => 480, 'quality' => 80),
'large' => array('width' => 800, 'height' => 600, 'quality' => 80)
)
);
/*=================================== Backends ========================================*/
// http://docs.cksource.com/ckfinder3-php/configuration.html#configuration_options_backends
// The two backends defined below are internal CKFinder backends for cache and logs.
// Plase do not change these, unless you really want it.
$config['backends']['laravel_cache'] = array(
'name' => 'laravel_cache',
'adapter' => 'local',
'root' => storage_path('framework/cache')
);
$config['backends']['laravel_logs'] = array(
'name' => 'laravel_logs',
'adapter' => 'local',
'root' => storage_path('logs')
);
// Backends
$config['backends']['default'] = array(
'name' => 'default',
'adapter' => 'local',
'baseUrl' => config('app.url').'/userfiles/',
'root' => public_path('/userfiles/'),
'chmodFiles' => 0777,
'chmodFolders' => 0755,
'filesystemEncoding' => 'UTF-8'
);
/*================================ Resource Types =====================================*/
// http://docs.cksource.com/ckfinder3-php/configuration.html#configuration_options_resourceTypes
$config['defaultResourceTypes'] = '';
$config['resourceTypes'][] = array(
'name' => 'Files', // Single quotes not allowed.
'directory' => 'files',
'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,webp,wma,wmv,xls,xlsx,zip',
'deniedExtensions' => '',
'backend' => 'default'
);
$config['resourceTypes'][] = array(
'name' => 'Images',
'directory' => 'images',
'maxSize' => 0,
'allowedExtensions' => 'bmp,gif,jpeg,jpg,png,webp',
'deniedExtensions' => '',
'backend' => 'default'
);
/*================================ Access Control =====================================*/
// http://docs.cksource.com/ckfinder3-php/configuration.html#configuration_options_roleSessionVar
$config['roleSessionVar'] = 'CKFinder_UserRole';
// http://docs.cksource.com/ckfinder3-php/configuration.html#configuration_options_accessControl
$config['accessControl'][] = array(
'role' => '*',
'resourceType' => '*',
'folder' => '/',
'FOLDER_VIEW' => true,
'FOLDER_CREATE' => true,
'FOLDER_RENAME' => true,
'FOLDER_DELETE' => true,
'FILE_VIEW' => true,
'FILE_UPLOAD' => true,
'FILE_RENAME' => true,
'FILE_DELETE' => true,
'IMAGE_RESIZE' => true,
'IMAGE_RESIZE_CUSTOM' => true
);
/*================================ Other Settings =====================================*/
// http://docs.cksource.com/ckfinder3-php/configuration.html
$config['overwriteOnUpload'] = false;
$config['checkDoubleExtension'] = true;
$config['disallowUnsafeCharacters'] = false;
$config['secureImageUploads'] = true;
$config['checkSizeAfterScaling'] = true;
$config['htmlExtensions'] = array('html', 'htm', 'xml', 'js');
$config['hideFolders'] = array('.*', 'CVS', '__thumbs');
$config['hideFiles'] = array('.*');
$config['forceAscii'] = false;
$config['xSendfile'] = false;
// http://docs.cksource.com/ckfinder3-php/configuration.html#configuration_options_debug
$config['debug'] = false;
/*==================================== Plugins ========================================*/
// http://docs.cksource.com/ckfinder3-php/configuration.html#configuration_options_plugins
$config['plugins'] = array();
/*================================ Cache settings =====================================*/
// http://docs.cksource.com/ckfinder3-php/configuration.html#configuration_options_cache
$config['cache'] = array(
'imagePreview' => 24 * 3600,
'thumbnails' => 24 * 3600 * 365
);
/*============================ Temp Directory settings ================================*/
// http://docs.cksource.com/ckfinder3-php/configuration.html#configuration_options_tempDirectory
$config['tempDirectory'] = sys_get_temp_dir();
/*============================ Session Cause Performance Issues =======================*/
// http://docs.cksource.com/ckfinder3-php/configuration.html#configuration_options_sessionWriteClose
$config['sessionWriteClose'] = true;
/*================================= CSRF protection ===================================*/
// http://docs.cksource.com/ckfinder3-php/configuration.html#configuration_options_csrfProtection
$config['csrfProtection'] = true;
/*============================== End of Configuration =================================*/
/**
* Config must be returned - do not change it.
*/
return $config;
================================================
FILE: src/routes.php
================================================
name('ckfinder_connector');
Route::any('/ckfinder/browser', '\CKSource\CKFinderBridge\Controller\CKFinderController@browserAction')
->name('ckfinder_browser');
//Route::any('/ckfinder/examples/{example?}', '\CKSource\CKFinderBridge\Controller\CKFinderController@examplesAction')
// ->name('ckfinder_examples');
================================================
FILE: views/browser.blade.php
================================================
CKFinder 3 - File Browser
@include('ckfinder::setup')
================================================
FILE: views/samples/ckeditor.blade.php
================================================
@extends('ckfinder::samples/layout')
@section('content')
CKEditor Integration
CKEditor 5
To integrate CKFinder with CKEditor 5
all you have to do is pass some additional configuration options to CKEditor:
ClassicEditor
.create( document.querySelector( '#editor2' ), {
ckfinder: {
// Use named route for CKFinder connector entry point
uploadUrl: '@{{ route('ckfinder_connector') }}?command=QuickUpload&type=Files'
}
} )
.catch( error => {
console.error( error );
} );
The sample below presents the result of the integration. Try pasting images from clipboard directly into the editing area as well as dropping images — the files will be saved on the fly by CKFinder.
CKEDITOR.replace( 'editor1', {
// Use named CKFinder browser route
filebrowserBrowseUrl: '@{{ route('ckfinder_browser') }}',
// Use named CKFinder connector route
filebrowserUploadUrl: '@{{ route('ckfinder_connector') }}?command=QuickUpload&type=Files'
} );
It is also possible to use CKFinder.setupCKEditor() as shown below, to automatically setup integration between CKEditor and CKFinder:
var editor = CKEDITOR.replace( 'ckfinder' );
CKFinder.setupCKEditor( editor );
The sample below presents the result of the integration. You can manage and select files from your server when creating links or embedding images in CKEditor 4 content. In modern browsers you may also try pasting images from clipboard directly into the editing area as well as dropping images — the files will be saved on the fly by CKFinder.
The modal mode is similar to popup. The difference is that popups are opened using a separate browser window while in modal mode CKFinder is opened inside a modal container that is appended to current page document.
Multiple Modals
In some cases you may need more than one modal to handle multiple places that require selecting a file.
Below you can find an example that fills each of the inputs with the URL of the selected file.
Read-only mode can be enabled in CKFinder with the readOnly
configuration option. The user will be able to browse the files but will not be able to introduce any changes. Thanks to this setting you will be able to use
CKFinder as an online gallery.
Note: This will only disable certain UI elements. In order to successfully block file uploads and modifications, or to set read-only permissions for particular
folders, you will need to adjust ACL settings
accordingly in the server-side configuration file.
With a little bit of imagination it is possible to turn CKFinder into a very simple gallery. Here CKFinder is configured to
open a file on double click, run without a toolbar and without the folders panel.
The example below shows the StatusBarInfo plugin that displays basic information about the selected file in the application status bar.
You can find more plugin examples in the CKFinder sample plugins repository.
Please have a look at plugin documentation, too.
CKFinder.widget( 'ckfinder-widget', {
width: '100%',
height: 500,
plugins: [
// The path must be relative to the location of the ckfinder.js file.
'../samples/plugins/StatusBarInfo/StatusBarInfo'
]
} );
The popup mode is most suitable for selecting files that are stored on a server.
Click the button below to open the popup and choose any file. After that you will see basic information
about the file that was selected, including the URL.
Additionally, CKFinder supports a special file selection mode for images called Choose Resized. This feature
allows you to resize the selected image to any size that is suitable for you. The CKFinder connector will automatically create
a resized version of the image and return its URL.
Multiple Popups
In some cases you may need more than one popup to handle multiple places that require selecting a file.
Below you can find an example that fills each of the inputs with the URL of the selected file.
It is possible to disable the folders panel and have folders displayed as icons in the main area of the application.
In the example below this mode is initialized inside a widget, but it also works in all standalone modes.
By default files are displayed in CKFinder as thumbnails. With list view enabled all files will be displayed as a list, one bellow the other. No image previews are available in this mode.
The list view can be enabled regardless of the selected user interface (Default/Compact/Mobile).
Mobile user interface is enabled automatically when the width of the working area of the application gets below the value
defined in the uiModeThreshold
configuration option.
Note: This mode works best on mobile devices, as touch and swipe events are not enabled for desktop browsers.
 }}){kind=logo}