summernote 0.8.8 onimageupload 示例答案

【问题标题】：summernote 0.8.8 onimageupload examplesummernote 0.8.8 onimageupload 示例
【发布时间】：2018-02-26 02:10:53
【问题描述】：

有没有人有使用 Summernote 0.8.8 将图像上传到服务器上的目录（而不是 base64）的代码的好例子？我尝试了一些较旧的发布结果（它们可能与旧版本的 Summernote 一起使用），但没有什么适合我的。我不擅长 Java，所以我不知道如何解决这个问题。

Summernote 的 web 示例是

$('#summernote').summernote({
  callbacks: {
    onImageUpload: function(files) {
      $summernote.summernote('insertNode', imgNode);
    }
  }
});

$('#summernote').on('summernote.image.upload', function(we, files) {
$summernote.summernote('insertNode', imgNode);
});

但这不起作用，因为图像没有“上传”它仍然在 Base64 中。这对我有用，因为它加载太慢了。谢谢！

【问题讨论】：

标签： javascript summernote

【解决方案1】：

适用于 SUMMERNOTE 0.88+

我用这些 CDN 测试过

<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.8/summernote.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.8/summernote.min.js"></script>

JAVASCRIPT

<script>
    $(document).ready(function() {
        $('#summernote').summernote({
            height: "300px",
            dialogsInBody: true,
            callbacks: {
                onImageUpload: function(files) {
                    uploadFile(files[0]);
                }
            }
        });
    });

    function uploadFile(file) {
        data = new FormData();
        data.append("file", file);

        $.ajax({
            data: data,
            type: "POST",
            url: "upload_url_path", //replace with your url
            cache: false,
            contentType: false,
            processData: false,
            success: function(url) {
                $('#summernote').summernote("insertImage", url);
            }
        });
    }
</script>

用于上传的 PHP 示例代码

      <?php
      $allowed = array( 'png', 'jpg', 'gif' );
        if( isset($_FILES['file']) && $_FILES['file']['error'] == 0 ) {
            $extension = pathinfo( $_FILES['file']['name'], PATHINFO_EXTENSION );
            if( !in_array( strtolower( $extension ), $allowed ) ) {
                 echo 'AN ERROR OCCURED - INVALID IMAGE';
                exit;
            }
            if( move_uploaded_file( $_FILES['file']['tmp_name'], 'assets/images/'.$_FILES['file']['name'] ) ) {
                echo base_url().'assets/images/'.$_FILES['file']['name']; // echo absolute file_url
                exit;
            }
        }
        echo 'AN ERROR OCCURED';
        exit;
?>

https://summernote.org/deep-dive/#onimageupload

【讨论】：