Я проверил множество вопросов и ответов Summernote о теме SummerNote onImageUpload, но не повезло; поэтому я пытаюсь новый ответ здесь.
Краткий обзор: я могу заставить Summernote показывать загруженное изображение в текстовой области , только если изображение загружено в ту же папку, что и index.php (то есть страница с формой и ajax запрос).
N.B. jQuery - 3.3.1.мин; Bootstrap - 4.1.3; Summernote - 0,8,9; все они включены через CDN в указанном порядке в разделе HEAD HTML.
Мой HTML / JS (index.php) :
<form name="myEditor" id="myEditor" method="post" action="show.php" enctype="multipart/form-data">
<textarea id="summernote" name="summernote"></textarea>
<input type="submit" />
</form>
<script type="text/javascript">
$(function() {
$('#summernote').summernote({
placeholder: 'Write something...',
lang: 'it-IT',
height: 500,
minHeight: null,
maxHeight: null,
focus: true,
callbacks: {
onImageUpload: function(files) {
editor = $(this);
doTheUpload(files[0], editor);
}
}
});
function doTheUpload(uploadedImage, myEditor) {
var myForm = new FormData();
myForm.append("imageField", uploadedImage);
$.ajax({
url: "upload.php",
cache: false,
contentType: false,
processData: false,
data: myForm,
type: "post",
success: function(imageUrl) {
var image = $('<img>').attr('src', imageUrl);
$(myEditor).summernote("insertNode", image[0]);
},
error: function(myForm) {
console.log(myForm);
}
});
}
});
</script>
МОЙ PHP (upload.php) :
$path = "";
$return_value = "";
$path = 'img/';
if ($_FILES['imageField']['name']) {
if (!$_FILES['imageField']['error']) {
$filename = $_FILES['imageField']['name'];
$temp_location = $_FILES['imageField']['tmp_name'];
$final_destination = $path . $filename;
if (!move_uploaded_file($temp_location, $final_destination)) {
$return_value = $path . 'badimage.png';
} else {
$return_value = $final_destination;
}
} else {
$return_value = "You triggered this error: " . $_FILES['imageField']['error'];
}
}
echo $return_value;
И что?
Итак, файл изображения, по-видимому, правильно загружен на сервер, по какому бы «пути» я ни указывал $path; в примере это $path = 'img/', но это может быть что-то еще, и это работает независимо.
В конце концов, здесь работает простая * PHP-функция move_uploaded_file, говорю я себе. Кроме того, папка img/ имеет те же разрешения, что и база.
Проблема щелкает, когда мяч возвращается к index.php.
Если изображение было загружено в ту же папку, что и index.php, скажем, $path = '', все в порядке; изображение отображается в редакторе.
Но если $path отличается от '' (так же, как в примере выше, где 'img/'), то изображение не отображается в редакторе, и я получаю хороший 404.
Как я уже говорил, файл на самом деле загружается в правильную папку на сервере, я даже могу переместить его в другую папку или загрузить обратно и отредактировать ... Я имею в виду ... он там (не так ли?).
Но не для браузера и не для Summernote. Однако я указываю браузеру на изображение, если оно находится в подпапке, я получаю 404.
Со всеми испытаниями, которые я проделал до сих пор, я нашел только подсказку, которую я вижу в Chrome "Проверка -> Сеть": если изображение находится в той же папке, что и index.php, сервер ... служит мне PNG (или любой другой тип изображения я загружаю) в то время как в URL-адресе есть путь до имени файла, файл будет представлен как text / html.
Но у меня есть другие move_uploades_files в других местах, где Summernote не участвует, и они работают как шарм ...
Я не знаю, ребята, я здесь в тупике ...
Спасибо за любой совет.