summernote 0.8.8 onimageupload 示例

Posted 2023-03-22

【中文标题】summernote 0.8.8 onimageupload 示例

【英文标题】：summernote 0.8.8 onimageupload example

【发布时间】：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 中。这对我有用，因为它加载太慢了。谢谢！

【参考方案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