H5视频封面截取

部分html

获取视频封面

js

$('#interception').on('click',function(){
       var video = $('#ppVideo').get(0);
       if (video.currentTime <= 0) {
           alert('请播放视频，在合适的位置点击该按钮');
           return;
       }
       var scale = 0.25;//比例
       var canvas = document.createElement("canvas");//创建一个画布对象
       canvas.width = video.videoWidth * scale;//封面图片的宽采用视频宽度的0.25倍
       canvas.height = video.videoHeight * scale;//同上
       canvas.getContext('2d').drawImage(video, 0, 0, canvas.width, canvas.height);//生成图片
       $('#VideoPoster').attr('src', canvas.toDataURL());//设置图片的base64格式数据流
       
})

html的变化

public string SaveBase64ToImage()
{
   string base64 = Context.Request["base64"] ?? "";//前端传过来的base64数据流
   string imgbase64 = base64.Substring(base64.IndexOf(",") + 1);//过滤掉逗号前面的部分，包括逗号
   Guid guid = new Guid();
   guid = Guid.NewGuid();
   var imgName = guid.ToString();//用Guid当做图片文件的名称
   string filename = "";
   Bitmap bitmap = null;
   try
   {
        byte[] arr = Convert.FromBase64String(imgbase64);
        System.IO.MemoryStream ms = new System.IO.MemoryStream(arr);
        Bitmap bmp = new Bitmap(ms);
        ms.Close();//关闭当前流
        bitmap = bmp;
        filename = "Files/video/" + imgName + ".png";//所要保存的相对路径及名字              
        var path =  Context.Server.MapPath("/");//获取项目的完整路径
        string imgUrl = (path + filename).Replace("\\", "/"); //得到最终上传路径 
        bitmap.Save(imgUrl , System.Drawing.Imaging.ImageFormat.Png);//保存到服务器
    }
    catch (Exception e)
    {

    }
    return filename;//返回相对路径
}