screenshot
播放器内部截图,截图格式可以自定义。源码
pluginName: screenshot
该插件默认隐藏,如需开启如下配置playerConfig
const player = new Player({
...,
screenShot: true, //显示截图按钮
videoAttributes: {
crossOrigin: 'anonymous'
}
})
// OR
const player = new Player({
...,
screenShot: {
disable: false
}, //显示截图按钮
videoAttributes: {
crossOrigin: 'anonymous'
}
})
注意
务必为播放器提前配置好跨域 crossOrigin ,否则 canvas toDataURL 会触发错误:
"Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': tainted canvases may not be exported."
config
position
@type:Stringdefault:controlsRight, 具体枚举值请看plugin-positions
插件DOM挂载位置,默认为player.controls.right
index
@type:Numberdefault:6插件DOM在挂载点内的排序,默认为6,越小越靠前(若index相同,后实例化的插件会被放置在前面)
quality
@type:Numberdefault:0.92- 说明:生成图片质量,默认值0.92
type
@type:Stringdefault:image/png- 图片类型,默认值 image/png
format
@type:Stringdefault:.png- 说明:图片存储格式,默认 .png
width
@type:Numberdefault:600- 说明:图片宽度,默认值 600
height
@type:Numberdefault:337- 说明: 图片高度,默认值 337
disable:
@type:Booleandefault:false- 说明:是否禁用,默认值false
该配置项可通过playerConfig.screenShot控制,默认值是false, 例如:
const playerConfig = {
screenShot: true //显示截图按钮
...
}
API
shot(width, height, option)
@desc: 截图@param:{ Number } width截图宽度@param:{ Number } height截图高度@param:{ {quality: Number, type: String} } option, 默认值{ quality: 0.92, type: 'image/png' }@return:Promise<string>
saveScreenShot(data, filename)
@desc: 下载图片@param:{ String } data图片DataURL@param:{ String } filename图片文件名
events
Events.SCREEN_SHOT
- 值:
screenShot - 触发: 点击截图按钮并截图成功
const player = new Player({
...
})
player.on(Events.SCREEN_SHOT, (url)) => {
console.log('screen shot success')
})