Summernote 上传不工作

Question

我的 onImageUpload in summer note jquery 插件不工作。用于在某些文件夹中上传图像，然后是 summernote 默认位置我该如何处理？！

index.php

<textarea id="summernote" name="contents"></textarea>

<script>
    $('#summernote').summernote({
        tabsize: 2,
        height: 200,
        focus: true,
        callbacks: {
            onChange: function(contents, $editable) {
                console.log('onChange:', contents, $editable);
            }
        }
    });

    $('#summernote').on('summernote.image.upload', function(we, contents, $editable) {
        data = new FormData ();

        data.append("file",file);

        $.ajax({
            url: "summernote_upload.php",
            type: "POST",
            data: data,
            cache: false,
            contentType: false,
            processData: false,
        });

        $summernote.summernote('insertNode', imgNode);
    });
</script>

summernote_upload.php

require_once ('./../../lib/curl_setup.php'); // curl json&token

$data_array = array(
    "request" => array(
        "image" => "this upload file/base64"
    ),
);
$make_call = callAPI('POST', '/api/v2/admin/products/images', json_encode($data_array));

$response = json_decode($make_call, true);

//$errors   = $response['response']['errors'];
//$data     = $response['response']['data'][0];

print_r($response);exit;

但是，summernote_upload.php 效果很好。响应是：

{
    "image": {
        "shop_no": 1,
        "path": "/web/upload/NNEditor/20180408/b69c819e36b4abc3f393b731829ab747.gif"
    }
}

我需要解决index.php。

Answer 1

首先你必须赶上上传图片事件并且不允许 summernote 自动添加它

        callbacks: {
               onImageUpload: function(files, editor, $editable) {
                   console.log('onImageUpload');
                   sendFile(files[0],editor,$editable);
        }},

那么你必须自己处理 json 图片上传。有一个功能：

   function sendFile(file,editor,welEditable) {
      data = new FormData();
      data.append("file", file);
       $.ajax({
       url: "uploader.php",
       data: data,
       cache: false,
       contentType: false,
       processData: false,
       type: 'POST',
       success: function(data){
      // alert(data);
        $('#summernote10').summernote("insertImage", data, 'filename');
    },
       error: function(jqXHR, textStatus, errorThrown) {
       console.log(textStatus+" "+errorThrown);
      }
    });
   }

在服务器端你可以保存文件

$allowed = array('png', 'jpg', 'gif','jpeg');
if(isset($_FILES['file']) && $_FILES['file']['error'] == 0){
    $extension = pathinfo($_FILES['file']['name'], PATHINFO_EXTENSION);
    if(!in_array(strtolower($extension), $allowed)){
        echo '{"status":"error"}';
        exit;
    }
    $newFileAddress = '../files/-'.rand(1000).'.'.$extension;
    if(move_uploaded_file($_FILES['file']['tmp_name'],$newFileAddress)){
     echo $newFileAddress;
     exit;
    }
}

通过return服务器上的文件路径可以轻松插入到夏日笔记中

Summernote 上传不工作

Summernote upload not working

javascript

php

upload

jquery

summernote