百度編輯器UEditor上傳視頻的功能Bug

☁ 背景介紹

• 今天在網站後臺的文章列表進行添加視頻的測試操作時，發現上傳後頁面顯示空白
  然後通過網上資源查詢和測試，在此做一下筆記，希望能幫到各位…

♘ 解決方案、分析

> 注意：
	測試的視頻格式爲 .mp4
	鄙人使用的 UEditor 版本爲 【1.4.3.3 PHP版本（UTF-8版）】

☞ 第一種方案

• 修改文件 ueditor.config.js，找到大概 365行 ，將 whitList 更改爲 whiteList
  
• 最後效果如下：
  

方案解釋：
	鄙人認爲，官方源碼發佈審覈時，將單詞 whiteList 誤刪了一個字母
	優點 —— 可解決上傳資源爲空和無法正常播放的問題
	缺點 —— 編輯器中無法預覽播放（即時修改確定後也是可以哦），但是可以進行佈局的修改

☞ 第二種方案

• 修改文件 ueditor.all.js

①. 找到大概 17769行 將

	html.push(creatInsertStr( vi.url, vi.width || 420,  vi.height || 280, id + i, null, cl, 'image'));

更改爲：

	html.push(creatInsertStr( vi.url, vi.width || 420,  vi.height || 280, id + i, null, cl, 'video'));

②. 找到大概 7343行，註釋掉以下三行代碼

	var root = UE.htmlparser(html);
    me.filterInputRule(root);
    html = root.toHtml();

③. 記得需要 更新緩存 纔可生效

• 最終效果如下：
  

方案解釋：
	直接更改了部分第三方控件源碼，網友經驗就是豐富
	優點 —— 可解決上傳資源爲空和無法正常播放的問題，並且提供了預覽功能
	缺點 —— 改動的代碼多，在編輯器中操作時只能切換到左上角源碼進行修改（調整寬高或者刪除操作）
			如果是懂html的人操作還好，不適用於普通後臺操作用戶！

☞ 附錄

• 個人習慣，選取的是第一種解決方案
• 其他建議：
  當前兩種操作方式，支持瀏覽器訪問的正常顯示，但是手機端未必成功，同時測試發現不支持 rich-text的解析使用
  可推薦文章: 【富文本/渲染/顯示/圖文混排方案 rich-text和uparse的區別】
• 參考文章：

1. 百度編輯器UEditor不能插入視頻的解決方法
2. 修復百度編輯器插入視頻的bug，可實時預覽視頻，可修改到支持手機查看視頻