Недавно мне тоже нужен был ответ на этот вопрос, и мне потребовалось несколько часов, чтобы понять его, поэтому я решил воскресить этот вопрос с более актуальной информацией и полным ответом.
В конце концов я наткнулся на этот урок , который объяснил мне это довольно хорошо. Ради стека, я повторю здесь учебник на случай, если он будет удален. Я также включу некоторые изменения, которые я внес в учебник, чтобы сделать это более гибким решением.
Начало работы
Давайте начнем с любого из выпусков ckeditor (базового, стандартного, полного, пользовательского). Единственное требование - наличие дополнения image и filebrowser
(На момент написания этой статьи все пакеты включали эти 2 дополнения, кроме основного, но его можно добавить к основному)
После загрузки необходимых файлов ckeditor убедитесь, что ваша установка работает.
Убедитесь, что вы связали свой файл-скрипт ckeditor.js <script src="ckeditor/ckeditor.js"></script>
, а затем инициализировали его так:
$(document).ready(function() {
CKEDITOR.replace( 'editor1' );
});
<textarea name="editor1"></textarea>
Конфигурация CKEditor
Теперь мы должны сообщить CKEditor, что мы хотим разрешить загрузку. Вы можете сделать это, зайдя в папку ckeditor и отредактировав `config.js '. Нам нужно добавить эту строку:
config.filebrowserUploadUrl = '/uploader/upload.php';
где-то внутри основной функции E.G
CKEDITOR.editorConfig = function( config ) {
// Define changes to default configuration here. For example:
// config.language = 'fr';
// config.uiColor = '#AADC6E';
config.filebrowserUploadUrl = '/uploader/upload.php';
};
ПРИМЕЧАНИЕ. Этот URL-адрес находится в корневом каталоге вашего проекта. Независимо от того, откуда вы загружаете этот файл, он будет начинаться с индекса вашего сайта. Это означает, что если ваш URL-адрес example.com, этот URL ведет к http://example.com/uploader/upload.php
После этого настройка CKEditor завершена! Это было легко, а?
На самом деле, если вы сейчас снова протестируете загрузку своего изображения, вы получите опцию загрузки, хотя она пока не совсем работает.
![enter image description here](https://i.stack.imgur.com/6aV0F.jpg)
Конфигурация сервера
Теперь на шаге перед этим вы заметите, что он заканчивается файлом upload.php
. Это та часть, которая поставила меня в тупик, я подумал, что будет какой-то дефолт, который может пойти с этим, но, насколько я знаю, нет. К счастью, я нашел тот, который работает, и внес в него некоторые изменения, чтобы сделать возможной дополнительную настройку.
Итак, давайте перейдем к пути, который вы указали на последнем шаге, для преемственности в этом уроке я собираюсь использовать /uploader/upload.php
.
В этом месте создайте файл с именем (как вы уже догадались) upload.php
.
Этот файл будет обрабатывать наши загрузки файлов.
Я добавлю свой пользовательский класс загрузки, но он основан на этом github , который я нашел и разветвил.
upload.php:
<?php
// Upload script for CKEditor.
// Use at your own risk, no warranty provided. Be careful about who is able to access this file
// The upload folder shouldn't be able to upload any kind of script, just in case.
// If you're not sure, hire a professional that takes care of adjusting the server configuration as well as this script for you.
// (I am not such professional)
// Configuration Options: Change these to alter the way files being written works
$overwriteFiles = false;
//THESE SETTINGS ONLY MATTER IF $overwriteFiles is FALSE
//Seperator between the name of the file and the generated ending.
$keepFilesSeperator = "-";
//Use "number" or "random". "number" adds a number, "random" adds a randomly generated string.
$keepFilesAddonType = "random";
//Only usable when $keepFilesAddonType is "number", this specifies where the number starts iterating from.
$keepFilesNumberStart = 1;
//Only usable when $keepFilesAddonType is "random", this specifies the length of the string.
$keepFilesRandomLength = 4;
//END FILE OVERWRITE FALSE SETTINGS
// Step 1: change the true for whatever condition you use in your environment to verify that the user
// is logged in and is allowed to use the script
if (true) {
echo("You're not allowed to upload files");
die(0);
}
// Step 2: Put here the full absolute path of the folder where you want to save the files:
// You must set the proper permissions on that folder (I think that it's 644, but don't trust me on this one)
// ALWAYS put the final slash (/)
$basePath = "/home/user/public_html/example/pages/projects/uploader/files/";
// Step 3: Put here the Url that should be used for the upload folder (it the URL to access the folder that you have set in $basePath
// you can use a relative url "/images/", or a path including the host "http://example.com/images/"
// ALWAYS put the final slash (/)
$baseUrl = "http://example.com/pages/projects/uploader/files/";
// Done. Now test it!
// No need to modify anything below this line
//----------------------------------------------------
// ------------------------
// Input parameters: optional means that you can ignore it, and required means that you
// must use it to provide the data back to CKEditor.
// ------------------------
// Optional: instance name (might be used to adjust the server folders for example)
$CKEditor = $_GET['CKEditor'] ;
// Required: Function number as indicated by CKEditor.
$funcNum = $_GET['CKEditorFuncNum'] ;
// Optional: To provide localized messages
$langCode = $_GET['langCode'] ;
// ------------------------
// Data processing
// ------------------------
// The returned url of the uploaded file
$url = '' ;
// Optional message to show to the user (file renamed, invalid file, not authenticated...)
$message = '';
// in CKEditor the file is sent as 'upload'
if (isset($_FILES['upload'])) {
// Be careful about all the data that it's sent!!!
// Check that the user is authenticated, that the file isn't too big,
// that it matches the kind of allowed resources...
$name = $_FILES['upload']['name'];
//If overwriteFiles is true, files will be overwritten automatically.
if(!$overwriteFiles)
{
$ext = ".".pathinfo($name, PATHINFO_EXTENSION);
// Check if file exists, if it does loop through numbers until it doesn't.
// reassign name at the end, if it does exist.
if(file_exists($basePath.$name))
{
if($keepFilesAddonType == "number") {
$operator = $keepFilesNumberStart;
} else if($keepFilesAddonType == "random") {
$operator = bin2hex(openssl_random_pseudo_bytes($keepFilesRandomLength/2));
}
//loop until file does not exist, every loop changes the operator to a different value.
while(file_exists($basePath.$name.$keepFilesSeperator.$operator))
{
if($keepFilesAddonType == "number") {
$operator++;
} else if($keepFilesAddonType == "random") {
$operator = bin2hex(openssl_random_pseudo_bytes($keepFilesRandomLength/2));
}
}
$name = rtrim($name, $ext).$keepFilesSeperator.$operator.$ext;
}
}
move_uploaded_file($_FILES["upload"]["tmp_name"], $basePath . $name);
// Build the url that should be used for this file
$url = $baseUrl . $name ;
// Usually you don't need any message when everything is OK.
// $message = 'new file uploaded';
}
else
{
$message = 'No file has been sent';
}
// ------------------------
// Write output
// ------------------------
// We are in an iframe, so we must talk to the object in window.parent
echo "<script type='text/javascript'> window.parent.CKEDITOR.tools.callFunction($funcNum, '$url', '$message')</script>";
?>
Изменения, которые я внес в этот класс, позволяют вам включать / отключать перезапись файлов и дают вам несколько вариантов, когда вы не хотите перезаписывать файлы. Оригинальный класс всегда перезаписывается без параметров.
По умолчанию этот класс настроен на сохранение всех файлов без перезаписи. Вы можете поиграть с этими настройками, чтобы лучше соответствовать вашим потребностям.
Если вы заметите, есть часть кода, которая является просто оператором if(true)
, что всегда верно, очевидно
if (true) {
echo("You're not allowed to upload files");
die(0);
}
Это для безопасности. Здесь вы должны проверить, вошел ли пользователь, загружающий файл, в систему / разрешено ли загружать. Если вас это не беспокоит, вы можете просто удалить эти строки кода или установить для него if(false)
(НЕ РЕКОМЕНДУЕТСЯ)
Вам также необходимо отредактировать переменные $basePath
и $baseUrl
в соответствии с потребностями ваших серверов, иначе это не будет работать. Все, что ниже, можно оставить в покое, если вы не хотите поиграть.
Этот класс не предлагает защиту файлов, вы можете поработать с ним, чтобы сделать его более безопасным, чтобы люди не могли загружать скрипты или вирусы на ваш сервер.
Я надеюсь, что это небольшое руководство помогло кому-то, так как я слишком долго работал над тем, чтобы заставить его работать на себя, и я надеюсь, что смогу спасти кого-то еще.
В этом учебном пособии, к которому я привел ссылку, есть несколько полезных шагов по устранению неполадок, которые могут помочь вам найти, что идет не так, если что-то происходит.
![enter image description here](https://i.stack.imgur.com/nyLaW.jpg)