網頁直播/點播播放器EasyPlayer.js截取快照的方法分享

EasyPlayer是一款精煉、高效、穩定的流媒體播放器，分爲RTSP版、RTMP版、Pro版和H5版四個版本，支持各類各樣的流媒體音視頻協議和文件的播放，在安防、互聯網、教育、錄播、IPTV等多個領域大放異彩，普遍應用！

關於EasyPlayer.js

EasyPlayer幾乎涵蓋了開發者所需的所有平臺，尤爲是在web端的EasyPlayer.js，極大地方便了開發者在解決B/S型業務開發時遇到的播放器接入的問題，好比：不懂前端的js代碼、沒有公網服務器放置這些js腳本和網頁、微信對接入IP播放地址有限制等。EasyPlayer.js適時地推出了一款很是優秀的工具頁面，集 rtmp, hls, flv, websocket 於一身的網頁直播/點播播放器, 使用簡單, 功能強大，不管是測試，仍是被集成，都很方便！

EasyPlayer.js如何實現截取快照？

分析問題

如何實現點擊上圖中圈出來的按鈕生成一個快照？

首先在播放器實例化時在控制欄添加一個按鈕並綁定一個點擊事件，此事件的做用是生成此時的快照並下載到本地。此功能最大的難點就在於如何生成將video標籤裏面的內容生成一張圖片。能夠經過canvas來生成圖片。

解決問題

此段代碼就是先獲取video標籤，而後經過canvas來繪製圖片。