I tested this code and Works

Javascript

<script>$(document).ready(function() {  $('#summernote').summernote({    height: 200,    onImageUpload: function(files, editor, welEditable) {      sendFile(files[0], editor, welEditable);    }  });  function sendFile(file, editor, welEditable) {    data = new FormData();    data.append("file", file);    $.ajax({      data: data,      type: "POST",      url: "Your URL POST (php)",      cache: false,      contentType: false,      processData: false,      success: function(url) {        editor.insertImage(welEditable, url);      }    });  }});</script>

PHP

if ($_FILES['file']['name']) {  if (!$_FILES['file']['error']) {    $name = md5(rand(100, 200));    $ext = pathinfo($_FILES['file']['name'], PATHINFO_EXTENSION);    $filename = $name.    '.'.$ext;    $destination = '/assets/images/'.$filename; //change this directory    $location = $_FILES["file"]["tmp_name"];    move_uploaded_file($location, $destination);    echo 'http://test.yourdomain.al/images/'.$filename; //change this URL  } else {    echo $message = 'Ooops!  Your upload triggered the following error:  '.$_FILES['file']['error'];  }}

Update:

After 0.7.0 onImageUpload should be inside callbacks option as mentioned by @tugberk

$('#summernote').summernote({    height: 200,    callbacks: {        onImageUpload: function(files, editor, welEditable) {            sendFile(files[0], editor, welEditable);        }    }});

Image Upload for Summernote v0.8.1

for large images

$('#summernote').summernote({    height: ($(window).height() - 300),    callbacks: {        onImageUpload: function(image) {            uploadImage(image[0]);        }    }});function uploadImage(image) {    var data = new FormData();    data.append("image", image);    $.ajax({        url: 'Your url to deal with your image',        cache: false,        contentType: false,        processData: false,        data: data,        type: "post",        success: function(url) {            var image = $('<img>').attr('src', 'http://' + url);            $('#summernote').summernote("insertNode", image[0]);        },        error: function(data) {            console.log(data);        }    });}

UPLOAD IMAGES WITH PROGRESS BAR

Thought I'd extend upon user3451783's answer and provide one with an HTML5 progress bar. I found that it was very annoying uploading photos without knowing if anything was happening at all.

HTML

<progress></progress><div id="summernote"></div>

JS

// initialise editor$('#summernote').summernote({        onImageUpload: function(files, editor, welEditable) {            sendFile(files[0], editor, welEditable);        }});// send the filefunction sendFile(file, editor, welEditable) {        data = new FormData();        data.append("file", file);        $.ajax({            data: data,            type: 'POST',            xhr: function() {                var myXhr = $.ajaxSettings.xhr();                if (myXhr.upload) myXhr.upload.addEventListener('progress',progressHandlingFunction, false);                return myXhr;            },            url: root + '/assets/scripts/php/app/uploadEditorImages.php',            cache: false,            contentType: false,            processData: false,            success: function(url) {                editor.insertImage(welEditable, url);            }        });}// update progress barfunction progressHandlingFunction(e){    if(e.lengthComputable){        $('progress').attr({value:e.loaded, max:e.total});        // reset progress on complete        if (e.loaded == e.total) {            $('progress').attr('value','0.0');        }    }}