Html5 video 标签 src 用数据流方式播放视频 - 网站

Html5 video 标签 src 用数据流方式播放视频

分类:HTML_HTML5答疑 - 常见问题 · 发布时间:2023-10-01 04:58 · 阅读:8101

HTML5中的video标签用于播放视频文件的,本文介绍了Html5 video 标签 src 用数据流方式播放视频,具有一定的参考价值,感兴趣的可以了解一下

前言

当视频播放过大,边看边加载时可以用数据流方式播放视频

可以使用 Blob 和 URL.createObjectURL() 方法来实现使用数据流播放视频。具体实现步骤如下:

一、获取视频数据流 从服务器获取视频数据流,可以使用 XMLHttpRequest 或 fetch 方法请求数据流并以 Blob 对象形式返回。

二、创建 URL 对象 使用 URL.createObjectURL() 方法创建一个 URL 对象,将 Blob 对象作为参数传入该方法。

三、将 URL 对象赋值给 video 标签的 src 属性 将创建的 URL 对象赋值给 video 标签的 src 属性即可实现使用数据流播放视频。 下面是一个使用数据流播放视频的示例代码:

总结

在上面的代码中,首先使用 fetch 方法获取视频数据流并以 Blob 对象形式返回,然后使用 URL.createObjectURL() 方法创建一个 URL 对象,将 Blob 对象作为参数传入该方法。最后将创建的 URL 对象赋值给 video 标签的 src 属性即可实现使用数据流播放视频。

到此这篇关于Html5 video 标签 src 用数据流方式播放视频的文章就介绍到这了,更多相关Html5 video src播放视频内容请搜索0133技术站以前的文章或继续浏览下面的相关文章,希望大家以后多多支持0133技术站!

标签:
HTML5 Video src 播放视频

相关文章

HTML5标签正确的使用方式

HTML5标签是HTML语言的最新版本引入的一些新的标签,这些标签用于定义网页内容的结构和语义,相比于以前的HTML版本,HTML5标签提供了更加语义化的元素,本文就给大家介绍HTML5标签正确的使用方式,需要的朋友可以参考下

meta标签name="referrer"属性简介和用法小结

HTML标签name="referrer"属性主要用于控制网页发送给服务器的referrer信息,可以告诉服务器端用户是从哪个页面来到当前网页的,本篇文章给大家介绍meta标签name="referrer"属性简介和用法小结,感兴趣的朋友跟随小编一起看看吧

elementUI中el-date-picker如何禁用指定日期之前或之后的日期

这篇文章介绍elementUI中el-date-picker禁用指定日期之前或之后的日期,通过配置picker-options配置指定禁用日期(pickerOptions写到data里面),感兴趣的朋友跟随小编一起看看吧

基于MUI框架使用HTML5实现的二维码扫描功能

这篇文章主要介绍了基于MUI框架使用HTML5实现的二维码扫描功能,需要的朋友可以参考下

html5项目实现扫描二维码功能

扫描二维码是很常见的一种功能,本文就来介绍一下html5项目实现扫描二维码功能,具有一定的参考价值,感兴趣的可以了解一下

返回分类 返回首页