Summernote圖片上傳不起作用

我遇到了問題summernote圖片上傳。Summernote圖片上傳不起作用

我的腳本看起來有些東西是這樣的：

<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'image'，它具有所需的值。

來源

2016-04-22 Subash Ghimire

你可以試試：var IMAGE_PATH ='http://localhost/dist/'; 因爲你的php代碼：$ uploadfile =>'images/xxx.jpg'，html網址使用了兩次圖像，比如../images/images/xxx.jpg。所以summernote圖片上傳不起作用！謝謝！

這是我的代碼

<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>

php的代碼爲你一樣。

和代碼目錄：d：\ WWW \ summernote-開發\例子\ 圖片目錄：d：\ WWW \ summernote-開發\例子\圖像

來源

2016-05-12 16:37:52

好吧，我發現了一個自定義summernote.js具有此功能內置。

而且我的編輯，upload.php的文件看起來有點像這樣：

<?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; 
    } 
?>

來源

2016-05-13 04:53:59

Summernote圖片上傳不起作用

回答

相關問題