summernote vue html 编辑器不上传图片到服务器
summernote vue html editor doesn't upload image to server
我在上传 summernote 图片时遇到问题。我知道 summernote 将图像转换为 base64,一旦我提交它,图像就会直接保存在后端数据库服务器上。我有一些代码可以将图片上传到服务器文件夹..但它对我不起作用...帮助我朋友。
我的脚本是:
$(function() {
$('.summernote').summernote({
height: 200,
onImageUpload: function(files, editor, editable) {
sendFile(files[0],editor,editable);
}
});
function sendFile(file,editor,welEditable) {
data = new FormData();
data.append("file", files);
$.ajax({
url: "uploader.php",
data: data,
cache: false,
contentType: false,
processData: false,
type: 'POST',
success: function(data){
alert(data);
$('.summernote').summernote("insertImage", data, 'filename');
},
error: function(jqXHR, textStatus, errorThrown) {
console.log(textStatus+" "+errorThrown);
}
});
}
});
Uploader.php
<?php
if ($_FILES['file']['name']) {
if (!$_FILES['file']['error']) {
$name = md5(rand(100, 200));
$ext = explode('.', $_FILES['file']['name']);
$filename = $name . '.' . $ext[1];
$destination = 'images/content/' . $filename; //change this directory
$location = $_FILES["file"]["tmp_name"];
move_uploaded_file($location, $destination);
echo 'http://localhost/ . $filename;//change this URL
}
else
{
echo $message = 'Your upload triggered the following error: '.$_FILES['file']['error'];
}
}
?>
我终于解决了我的错误..只要在我的脚本中插入一个回调函数就可以正常工作..
callbacks : {
onImageUpload: function(files, editor, $editable) {
sendFile(files[0],editor,$editable);
}
}
我在上传 summernote 图片时遇到问题。我知道 summernote 将图像转换为 base64,一旦我提交它,图像就会直接保存在后端数据库服务器上。我有一些代码可以将图片上传到服务器文件夹..但它对我不起作用...帮助我朋友。
我的脚本是:
$(function() {
$('.summernote').summernote({
height: 200,
onImageUpload: function(files, editor, editable) {
sendFile(files[0],editor,editable);
}
});
function sendFile(file,editor,welEditable) {
data = new FormData();
data.append("file", files);
$.ajax({
url: "uploader.php",
data: data,
cache: false,
contentType: false,
processData: false,
type: 'POST',
success: function(data){
alert(data);
$('.summernote').summernote("insertImage", data, 'filename');
},
error: function(jqXHR, textStatus, errorThrown) {
console.log(textStatus+" "+errorThrown);
}
});
}
});
Uploader.php
<?php
if ($_FILES['file']['name']) {
if (!$_FILES['file']['error']) {
$name = md5(rand(100, 200));
$ext = explode('.', $_FILES['file']['name']);
$filename = $name . '.' . $ext[1];
$destination = 'images/content/' . $filename; //change this directory
$location = $_FILES["file"]["tmp_name"];
move_uploaded_file($location, $destination);
echo 'http://localhost/ . $filename;//change this URL
}
else
{
echo $message = 'Your upload triggered the following error: '.$_FILES['file']['error'];
}
}
?>
我终于解决了我的错误..只要在我的脚本中插入一个回调函数就可以正常工作..
callbacks : {
onImageUpload: function(files, editor, $editable) {
sendFile(files[0],editor,$editable);
}
}