summernote vue html编辑器不会将图像上传到服务器

Posted

技术标签:

【中文标题】summernote vue html编辑器不会将图像上传到服务器【英文标题】:summernote vue html editor doesn't upload image to server 【发布时间】:2016-11-14 12:49:43 【问题描述】:

我在使用 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);
          
        );
       
);

上传者.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'];
            
        

        ?>

【问题讨论】:

【参考方案1】:

最后我解决了我的错误..只需在我的脚本中插入一个回调函数就可以正常工作..

callbacks : 
      onImageUpload: function(files, editor, $editable) 
      sendFile(files[0],editor,$editable);
        
      

【讨论】:

以上是关于summernote vue html编辑器不会将图像上传到服务器的主要内容,如果未能解决你的问题,请参考以下文章

Summernote 不会编辑其内容

Summernote 将光标指向插入的 HTML 末尾

将 Summernote 编辑器与 Meteor 一起使用

在mvc中,使用summernote编辑器,我想将内容字符串和html的数据发送到控制器

从 Mysql DB 检索后,summernote 显示 html 代码

通过 Ajax 将 Summernote 代码发布到 PHP,然后插入数据库