summernote網頁編輯器嵌入視頻

summernote是一個比較好用的html網頁編輯器,開源,所以我們可以用與正當的商業用途.今天我有一項工作是在這個編輯器中插入視頻.


新版的summernote是可以插入視頻的.但是默認的情況下,我們是隻能插入四個網站的視頻.

分別是:YouTube, Vimeo, Vine, Instagram, or DailyMotion.

祕密就在於summernote.js這個文件裏.在這個文件對插入視頻的url進行了正則匹配.


所以啊,我們就不能夠插入 諸如 youku 等網站視頻.

但是我們可以通過修改summernote.js的源代碼,增加對 國內有些網站的支持匹配.就拿youku來講.

需要修改兩個地方:

1\


2\


爲什麼這個修改, 該怎麼修改, ?

這個過程的分析很重要, 首先你的去youku網站, 點開一個視頻網址. 但是記住,這個不是我們能夠嵌入視頻的地址.但是和我們嵌入視頻有關係.

有什麼關係,有某種映射關係.

首先, 點開一個視頻.


打開chrom調試器 ctrl+shift+c


找到你的視頻地址, 注意到了嗎,有一段字符串就代表了你的唯一視頻.

XNzA5NDI2ODcy這個字符串就是了,我們的視頻id,然後你配置正則表達式,寫道summernote.js裏面就行了.


發佈了40 篇原創文章 · 獲贊 1 · 訪問量 5萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章