Я пытаюсь установить summernote на свой веб-сайт, построенный на Laravel 5. Однако, независимо от того, что я делаю, я не могу сделать, чтобы загруженный файл изображения отображался в редакторе.
$(document).ready(function() {
$.ajaxSetup({
headers: { 'X-CSRF-Token' : $('meta[name=_token]').attr('content') }
});
$('#summernote').summernote({
height: 400,
onImageUpload: function(files) {
data = new FormData();
data.append("image", files[0]);
$.ajax({
data: data,
type: "POST",
url: "/image/upload",
cache: false,
contentType: false,
processData: false,
success: function(url) {
console.log(url);
// trying to make the image show up here...
}
});
}
});
И это PHP-код, и это работает.
public function upload_image(ImageRequest $request)
{
if($request->hasFile('image')){
$filename = str_random(20).'_'.$request->file('image')->getClientOriginalName();
$image_path = base_path() . '/public/images/thread/';
$request->file('image')->move(
$image_path, $filename
);
echo $filename;
}
else{
echo 'Oh No! Uploading your image has failed.';
}
}
Я использую самую последнюю версию Summernote, и вот список того, что я пробовал до сих пор:
Попробовал следующие коды на основе # 2. По сути, я пытаюсь определить, можно ли добавить изображения с других веб-сайтов, если предположить, что мой путь к изображению неверен. Но не работает.
//Полный путь?
$ (‘# summernote’). summernote («insertImage», ‘http://animalia-life.com/data_images/fish/fish1.jpg«);
// Если нет, полный путь с опцией ‘filename’?
$ (‘# summernote’). summernote («insertImage», ‘http://animalia-life.com/data_images/fish/fish1.jpg‘,’имя файла’);
// Если нет, путь + имя файла?
$ (‘# summernote’). summernote («insertImage», ‘http://animalia-life.com/data_images/fish», ‘Fish1.jpg’);
// Если нет, путь + /?
$ (‘# summernote’). summernote («insertImage», ‘http://animalia-life.com/data_images/fish/», ‘Fish1.jpg’);
Пробовал, можно ли добавить изображение данных, и ОНО РАБОТАЕТ. НО ПОЧЕМУ.
// изображение данных?
$ (‘# summernote’). summernote («insertImage», ‘data: image / jpeg; base64, / 9j / 4AAQSkZ … blahblah ….’);
В этот момент я узнал, что $ (‘# summernote’). summernote («insertImage», …) на самом деле работает, но параметр URL изображения, возможно, нет. Кто-нибудь успешно реализовал эту функцию с последней версией Summernote? или … я что-то здесь упускаю?
Догадаться.
base_path () дает мне физический локальный путь к загруженному файлу на моем ПК. Тем не менее, все это работает на MAMP. Таким образом, URL должен быть что-то вродеHTTP: // локальный: 8888 / изображение /……’
$(document).ready(function() {
var IMAGE_PATH = 'http://localhost:8000/images/thread/';
$.ajaxSetup({
headers: { 'X-CSRF-Token' : $('meta[name=_token]').attr('content') }
});
$('#summernote').summernote({
height: 400,
onImageUpload: function(files) {
data = new FormData();
data.append("image", files[0]);
$.ajax({
data: data,
type: "POST",
url: "/image/upload",
cache: false,
contentType: false,
processData: false,
success: function(filename) {
var file_path = IMAGE_PATH + filename;
console.log(file_path);
$('#summernote').summernote("insertImage", file_path);
}
});
}
});
});
Других решений пока нет …