视频截图
各位读者大人们好，不知道各位读者大人们近来如何。
由于前段时间事情比较多，文章的更新就给耽误了，项目需要上线经常加班，再加上自己的一些学习计划，一晃就是一个多月，没有更新文章。
有人会问，登哥你怎么不搬运和转载别人的文章呢？，这样公众号就不会断更了，这个问题问的好，熟悉我的读者应该会发现，我的文章全都是原创文章。
刚开始运行公众号时，可能转载过一两篇文章，从那以后我就坚持原创了。不在进行转载，这其实和我公众号的定位有关系。
我写文章的目的很简单，不是为了涨粉，更多的是为了个人成长，因为你在写文章的同时其实就是在自我学习的过程，这个过程要比你单纯的看知识点要吸收的更有效率。
当然了，在这个过程中如果能收获认可自己的读者，那是一件很开心的事情。如果没有，我也没有损失什么。一直按照我的节凑进行就好。
所以从这个角度来说，转载可能对我的意义就不大了。
最近在自学 Python 后面除了给大家分享前端的相关知识以外，还会给大家分享更多有意思东西。大家以后可以多关注关注。
今天给大家分享一个实战技巧，最近在项目中使用到的，需求是在播放视频的时候可以进行截图。
我们都知道，网页中大多都是用 <video>标签进行视频的播放。那如何才能实现视频的截图呢？
这里我们用到了 canvas 的相关功能。我们都知道，canvas 是伴随着 HTML5 出现的，它具有强大的绘图能力。很多可视化库都是利用到了 canvas。
因为 canvas 具有对图像的操作能力，今天我们就用它来实现视频的截图操作，之前对 canvas 有过一段时间的学习，如果想学习 canvas 的同学，这里推荐慕课网上的入门课程。
这里主要用到两个方法：
drawImage
drawImage 方法是在画布上绘制图像、画布或视频。
语法：
ctx.drawImage(image, dx, dy);
ctx.drawImage(image, dx, dy, dWidth, dHeight);
ctx.drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight);
三种用法，本文不做过多描述，有兴趣的可以查看相关文档。其中的参数 image：允许任何的图像源，所以我们就可以利用这个特性，对 video 进行操作。更多可查看相关文档
toDataURL
toDataURL 方法可以返回 Canvas 图像对应的 data URI，也就是平常我们所说的base64地址。
格式如下：
data:[][;base64],
实现
利用上述方法我们很容易就能实现视频的截图，主要分为三步：
使用 drawImage 方法在画布上绘制图像。
使用 toDataURL 方法获取图像的地址。
创建一个img标签，赋值给 src。
<video id="video" src="./flower.webm" width="300" controls></video>
<button alt="">最后，如果觉得文章不错，对你有所启发，点赞是一种态度也是一种认可。
微信公众号：六小登登，更多干货文章，这里有我的很多故事，欢迎一起交流。
相关阅读
1.环境搭建
环境那个建
2.了解MVC模型
model–view–controller
3.搭建登陆页面
Axure RP 6.5 正式版和中文汉化包&视频教程下载
Axure介绍:Axure RP是美国Axure Software Solution公司旗舰产品，是一个专业的快速原型设计工具，让负责定义需求和规格、设计功能和
最近朋友告诉我某视频发新视频能褥羊毛，而且多个账号可以绑定同一个支付宝，于是准备抓包做一个批量自动上传小视频的工具。
0x00
第七讲javascript
html是线性加载，当遇到JavaScript加载完成时才往下加载
defer属性 延迟，只能用于外部脚本，当整个html加载完再加载
http://blog.csdn.net/scalerzhangjie/article/details/8273410项目要用到视频编解码，最近半个月都在搞，说实话真是走了很多弯路，浪