summernote富文本的改寫onImageUpload在服務器上傳圖片，並利用MutationObserver實時監測進行圖片在服務器刪除

首先，聲明，先去自行了解什麼是summernote富文本編輯器：https://summernote.org/
個人看法：主要是爲了後臺可以進行編輯，就好比你在公衆號寫文章，也是基於富文本編輯器來寫的。
爲什麼選用summernote？原因有幾點
（2.1）summernote支持bootstrap前端框架：http://www.bootcss.com/，現在bootstrap使用非常普遍了，最主要的亮點就是響應式佈局，而且手機（移動設備）優先。非常適合現在龐大的手機用戶瀏覽。所以summernote也非常適合在手機進行文本編輯

（2.2）bootstrap也有自帶的富文本編輯器：bootstrap-wysiwyg，但是爲什麼不用這個呢？原因是summernote可以插入視頻。但是其他很多富文本編輯器也可以插入視頻啊？我說的是國內的視頻，其他國外富文本編輯器大多數只能插入YouTube了，而summernote很神奇，可以插入騰訊視頻，優酷的也行，所以非常推薦編輯文本時候需要插入視頻的小編使用summernote。

（2.3）summernote真的非常簡潔，但是功能卻很完善，還可以自定義工具欄，emoji也不例外，但是由於關於summernote插入emoji的文章用法大部分都是在本地加載emoji，可以參考一下：https://github.com/summernote/awesome-summernote和https://github.com/nilobarp/summernote-ext-emoji，但是對於在本地加載emoji，會跟我刪除圖片發生衝突了，所以我就沒有加上emoji功能，還有一種方法是通過ajax獲取api.github.emoji服務器的鏈接，再通過鏈接添加，不過這個啊Jun真不會用了。

（2.4）summernote可以直接通過summernote('code')獲取文本框的值，即是html的body代碼，可以直接上傳到數據庫或者提交給後臺。
爲什麼要改寫onImageUpload呢？
（3.1）因爲summernote自帶的函數只會將圖片轉爲base64格式保存起來，所以如果保存在數據庫裏，將會非常吃力，一張隨隨便便的圖片都要幾個M，吃不消啊，所以改寫成保存在服務器上，再上傳圖片在服務器上的地址給數據庫就好多了

（3.2）在很多其他博客都看到有summernote的圖片上傳的改寫保存到服務器中，但是很可惜，都是貼上代碼就不管了，而且，基本都是隻保存，沒有刪除的，我想假如插入圖片錯誤，但是又不能刪除，那就太遺憾了，所以我就打算寫一個即可上傳也可刪除圖片的summernote版本。其實跟我上一篇的思路一樣，只是有些地方注意一下就行：jQuery的$.ajax()與php後臺交互，利用MutationObserver進行圖片刪除

（3.3）會用ajax的應該都沒有問題了，所以改寫onImageUpload也是利用了jQuery的ajax()來與後臺交互的，因爲ajax()也支持File類型，所以就用FormData類型進行交互。

（3.4）會改寫的就沒問題，我只是爲了方便不會改寫的，後臺我是用php寫的，但是其他類型的後臺寫起來也比較簡單，代碼就10來行。
代碼我就不貼了，直接上github拿吧，覺得還行的或需要改進的記得star一個https://github.com/JunStitch/summernote
PS：插入圖片經常出現的問題
（5.1）插入一張比較大的圖可能會有報錯，原因在於php.ini文件，第一個原因主要是圖片大小超出允許的範圍，這個問題可以通過修改php.ini的max_execution_time或者post_max_size又或者upload_max_filesize可以解決，我就不多說了，參考一下別人的經驗：http://blog.csdn.net/anan890624/article/details/51859863

（5.2）第二個原因也是在php.ini文件，不過不是大小限制，而是文件的臨時存儲文件找不到，在php.ini的upload_tmp_dir裏可能原本沒有定義，所以需要修改，下面就是我在此基礎上作的修改。
```
; Temporary directory for HTTP uploaded files (will use system default if not
; specified).
; http://php.net/upload-tmp-dir
; upload_tmp_dir = //一開始他是沒有定義的
upload_tmp_dir = "D:\phpStudy\tmp\tmp" //所以需要在這裏修改了
```
（5.3）修改完php.ini後一定要重啓服務器，否則即使改了也會出錯
效果圖
---- wysiwyg ( what you see is what you get ) -----