javascript - bilibili的视频播放如何实现？
问题描述
bilibili的视频播放器除了Vue都用到了什么技术栈或者怎么实现的
问题出现的环境背景及自己尝试过哪些方法
我今天想要模仿bilibili来写一个视频播放器，但是我写到有关播放/暂停功能时候遇到了一些问题：在Vue3里因为setup是在创建虚拟DOM之前执行的，所以我无法在setup中访问相关DOM节点（<video>）的相关属性，以至于我无法通过监听video的属性来实现响应式。后来我去B站的web端看它的代码后我发现好像并不是我想的那样使用v-if或者v-show的方法来动态渲染，当我切换播放和暂停状态时候它的svg是没有发生变化的而是其中一个class类发生了变化，但是我并没有在开发者工具里找到这个类具体是什么，还望有大佬来指点一二。
共有2个答案
bilibili的视频播放器除了Vue都用到了什么技术栈或者怎么实现的---
播放器的水就很深了，视频资源首先得符合video的要求，其他的就是辅助加各种基本控制了，有那个时间，只是看他的页面样式啥的，还不如自己手动实现一个，看自己的demo和他的差距有多大；他的弹幕处理技术，纯前端几乎是无能为力；
<template><video ref="videoRef"></video></template><script setup>import { ref, onMounted } from 'vue'; const videoRef = ref(null); onMounted(() => { // 在这里用 videoRef.value}); </script>动态样式：
<svg :class="isPlaying ? 'play-class' : 'pause-class'"></svg>b站用的技术
-
本文向大家介绍H5播放的video视频，如何实现对视频截图？相关面试题，主要包含被问及H5播放的video视频，如何实现对视频截图？时的应答技巧和注意事项，需要的朋友参考一下
-
我有一个响应站点，包含html5视频。我有一些javascript可以检查视频元素的大小是否低于某个阈值。如果是，它将移除控件，将视频播放按钮覆盖图像放置在视频元素的顶部，然后将click事件添加到保存视频元素的容器中。当点击容器时，它会将视频复制到一个模态对话框中并播放视频。 现在的困境是： webm版本没有任何问题。 modal视图的mp4版本在Safari中没有问题。 如果mp4播放到位（即
-
我正在开发一个音频播放器，它可以在后台播放音频文件。我的问题是，当录像机或视频播放器启动时，我需要暂停音频播放器。 有什么方法可以处理这个任务吗？例如，我有来处理这些调用。当我接到呼叫或wnat呼叫时，我们可以使用呼叫状态暂停播放器。我想为录像机或视频播放器以及相同的场景。当视频/录制开始时，我需要暂停音频播放器。
-
用 AVPlayer 类写的简易视频播放器，可以播放来自互联网的视频，支持手势缩放视频。只能播放iPhone支持的视频格式。 目前有两点不足：一是无法调节音量；二是手势放大缩小之后滑动快进快退也不太正常。希望有其他开发者在此基础上继续改进。 [Code4App.com]
-
问题内容： 我正在使用Videogular来显示视频。当用户点击“播放”按钮以播放新视频时，能否帮助我停止/暂停其他视频？因此，一次只能让用户一次播放一个视频。 系统应自动停止正在后台播放的其他视频并播放新视频 谢谢 问题答案： 您可以分别为每个播放器获取所有API，并监听状态变化： 在您的控制器中：
-
主要内容：HTML视频（Videos）播放,实例,问题以及解决方法,使用 <embed> 标签,实例,使用 <object> 标签,实例,使用 HTML5 <video> 元素,实例,最好的 HTML 解决方法,HTML 5 + <object> + <embed>,使用超链接,实例,关于内联视频的说明,HTML 多媒体标签在 HTML 中播放视频的方法有很多种。 HTML视频（Videos）播放 实例 <video width="320" height="240" controls> <sou