Summernote image upload not working

Question

私はで問題が発生しています。了解写真アップロード。

私のスクリプトは、どのようなこのようないくつかになります。

<script> 
$(document).ready(function() { 

var IMAGE_PATH = 'http://localhost/dist/images/'; 

$('.summernote').summernote({ 
    height: 300, 
    callbacks : { 
     onImageUpload: function(image) { 
      uploadImage(image[0]); 
     } 
    } 
}); 

function uploadImage(image) { 
    var data = new FormData(); 
    data.append("image",image); 
    $.ajax ({ 
     data: data, 
     type: "POST", 
     url: "uploader.php", 
     cache: false, 
     contentType: false, 
     processData: false, 
     success: function(url) { 
      var image = IMAGE_PATH + url; 
      $('.summernote').summernote('insertImage', image); 
      }, 
      error: function(data) { 
       console.log(data); 
       } 
     }); 
    } 

}); 
</script> 

をしてuploader.phpは、以下のコードを持っています

<?php 
$image = $_FILES['image']['name']; 
$uploaddir = 'images/'; 
$uploadfile = $uploaddir . basename($image); 
if(move_uploaded_file($_FILES['image']['tmp_name'],$uploadfile)) { 
    echo $uploadfile; 
} else { 
    echo "Unable to Upload"; 
} 
?> 

イメージファイルはディレクトリ「画像」に成功したアップロードされています。

しかし、$（ '。summernote'）。summernote（ 'insertImage'、image）;アップロードされた画像リンクはエディタに追加されません。

何が欠けていますか？そして、はい、私はvar 'イメージ'を警告しようとし、それは必要な値を持っています。

Answer 1

お試しください：var IMAGE_PATH = 'http://localhost/dist/'; あなたのPHPコードは$ uploadfile => 'images/xxx.jpg'であるため、html urlは../images/images/xxx.jpgのように2つのイメージを使用します。 so summernote image upload not working！感謝！ ありがとう！

それはあなたと同じPHPコードの私のコード

<script> 
 
$(document).ready(function() { 
 

 
var IMAGE_PATH = 'http://localhost:81/summernote-develop/examples/'; 
 

 
$('.summernote').summernote({ 
 
    height: 300, 
 
    callbacks : { 
 
     onImageUpload: function(image) { 
 
      uploadImage(image[0]); 
 
     } 
 
    } 
 
}); 
 

 
function uploadImage(image) { 
 
    var data = new FormData(); 
 
    data.append("image",image); 
 
    $.ajax ({ 
 
     data: data, 
 
     type: "POST", 
 
     url: "uploader.php", 
 
     cache: false, 
 
     contentType: false, 
 
     processData: false, 
 
     success: function(url) { 
 
      var image = IMAGE_PATH + url; 
 
      $('.summernote').summernote('insertImage', image); 
 
\t \t \t //console.log(image); 
 
      }, 
 
      error: function(data) { 
 
       console.log(data); 
 
       } 
 
     }); 
 
    } 
 

 
}); 
 
</script>

です。

とコードのdirは：D：\ WWW \の 画像でdir \ \例をsummernote-開発：D：画像\ \ WWW \のsummernote-開発\例は

Answer 2

まあ、私はこれを持つカスタムsummernote.jsを見つけました組み込み機能

<?php 
## This file is being used by 
##summer note for image upload call back. 

include_once("classes/class.connection.php"); 
include_once("classes/class.config.php"); 
include_once("classes/class.query.php"); 
include_once("classes/class.common.php"); 

$comObj = new common; 


if(empty($_FILES['file'])){ exit(); } 

$errorImgFile = $comObj->sObj->config['site_url']."/admin/img-uploads/img_upload_error.png"; 

    if (getimagesize($_FILES["file"]["tmp_name"]) !== false) 
    { 
     #Rename 
     $randomName = $comObj->randomkeys(20); 

     $thumbExt = $comObj->getExtension($_FILES['file']['name']); 

     $newName = $randomName.".".$thumbExt; 

     $destinationFilePath = './img-uploads/'.$newName; 

     $rawlocation = '/img-uploads/'.$newName; 



     if(!move_uploaded_file($_FILES['file']['tmp_name'], $destinationFilePath)){ 
      echo $errorImgFile; 
     } 
     else{ 
      echo $comObj->sObj->config['site_url']."/admin".$rawlocation; 
     } 


    }else{ 
     echo $errorImgFile; 
    } 
?> 

：

そして、私のエディタ-upload.phpファイルには、多少のようになります