Summernote 上传图片：onImageUpload 和 sendFile 功能不起作用
Posted
技术标签:
【中文标题】Summernote 上传图片：onImageUpload 和 sendFile 功能不起作用【英文标题】：summernote upload image: onImageUpload and sendFile function not working 【发布时间】：2020-03-18 20:33:07 【问题描述】：我正在使用 Summernote v 0.8.12
我的 Summernote 页面：
<!DOCTYPE html>
<html lang="en"><head>
<meta charset="UTF-8">
<title>bootstrap4</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-bs4.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-bs4.js"></script>
<script>
$(document).ready(function()
$("#summernote").summernote(
placeholder: 'enter directions here...',
height: 300,
callbacks:
onImageUpload : function(files, editor, welEditable)
for(var i = files.length - 1; i >= 0; i--)
sendFile(files[i], this);
);
);
function sendFile(file, el)
var form_data = new FormData();
form_data.append('file', file);
$.ajax(
data: form_data,
type: "POST",
url: 'editor-upload2.php',
cache: false,
contentType: false,
processData: false,
success: function(url)
$(el).summernote('editor.insertImage', url);
);
</script>
</head>
<body>
<form action="" method="post">
<input name="subject" class="form-control" />
<textarea id="summernote" name="body"></textarea>
<input name="button" type="submit" value="Submit" id="button">
</form>
</body>
</html>
上传图片的php文件editor-upload2.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/' . $filename; //change this directory
$location = $_FILES["file"]["tmp_name"];
move_uploaded_file($location, $destination);
echo 'https://www.mysite.co.uk/folder/emails/' . $filename;//change this URL
else
echo $message = 'Ooops! Your upload triggered the following error: '.$_FILES['file']['error'];
?>
summernote 页面似乎没有将任何信息传递给 editor-upload2.php 文件，因为没有上传任何内容，也没有任何内容出现在 summernote 表单 textarea 中。
任何帮助将不胜感激。
非常感谢您阅读本文。
【问题讨论】：
你能在浏览器上打开一个 web 控制台并描述相关的网络调用吗？有没有网络调用，网络调用失败等？ 这就是我的想法，因为我在另一个页面上创建了一个简单的表单，文件上传到了 editor-upload.php 脚本，但是如果我在与 editor-upload.php 相同的页面它确实有效 我意识到在另一个页面上的简单表单上，我将文件命名为文件上传测试而不是文件，所以现在可以正常工作了。 summernote 仍然不适合我， 我看过了，点击图片上传图片时没有网络调用 【参考方案1】：主页标题中的以下脚本阻止了它的工作：
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
我从 url 中去掉了“slim”，现在它可以正常工作了
【讨论】：
以上是关于Summernote 上传图片：onImageUpload 和 sendFile 功能不起作用的主要内容，如果未能解决你的问题，请参考以下文章