字幕标签＜track存在跨域问题

墨衍会员 · AI 创作全网分发 墨衍智能分发 本文由作者通过墨衍一键同步至各平台 1分发平台 200+累计阅读 286平均单平台已同步平台优快云微信公众号微博知乎掘金百家号博客园抖音小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年，写一次发全网我也要 → 码龄7年

关注

原创最新推荐文章于 2026-05-25 07:01:26 发布 286 阅读 AI 写同款· GEO 优化 ›

video 播放字幕，解决hls导致的字幕播放问题 hls 是1.4.0版本，阻止了原生的video 字幕播放导致播不出来，看了下hls的代码，他内部也有subtitle字幕的播放，由于video的textTrack 的mode 没有设置当前播放的导致被hls内部的subtitle给覆盖了，所以只要设置当前的。我这边用的是metadata，原因是需要统一字幕的样式，位置，大小等，用到的方法是获取textTrack，trak的oncuechange 方法。video 播放字幕的方法是播放字幕webvtt文件，video 原生自带播放功能, 只需要加。阅读详情

增加参数crossorigin=“anonymous”

![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/e332e2d35e444abbad530fada7f32ffc.png)

收录于

当前文章被以下社区和专栏收录：

标签

#vue.js

Author:baiyun ,Email:mitbaiyun@163.com

HTML ＜track＞标签 track> 标签为诸如 video 元素之类的媒介规定外部文本轨道。用于规定字幕文件或其他包含文本的文件，当媒介播放时，这些文件是可见的。阅读详情

相关推荐

videojs-playlist, 用于播放多个音频音轨或者多个视频的插件.zip

videojs-playlist, 用于播放多个音频音轨或者多个视频的插件 Video.js-播放列表用于播放多个视频或者多个音频音轨的视频js插件。它是中越来越多的插件之一，用于出色的视频库库( ) 。的基本原理：开发这个插件的主要目标是播放的音频文件。可以以通过将 <video> 交换为

【浏览器】同源策略及跨域问题

实际工作场合并不会用。JSONP 是⼀种跨域请求数据的⽅式，它利⽤了<script>标签不受同源策略限制的特性，可以从不同的域名请求数据。实现原理是在服务端⽣成⼀个 JavaScript 函数，客户端使⽤<script>标签请求该函数，服务端返回该函数的调⽤，并将需要传输的数据作为函数参数传⼊。所以jsonp解决的跨域问题具有很明显的不⾜，它只能实现get⽅法的请求。对于post put delete 等其它请求⽆法实现。// 前端// 后端这⾥⽤ express 来模拟})})

小秀的博客 1720

共享单车需求预测问题：建模篇

机器学习训练营——机器学习爱好者的自由交流空间（qq群号：696721295）在上一篇里，我们使用可视化的方法分析了“共享单车”的数据集，理解了特征(变量)之间的关系。我们将在本篇建立几个模型预测单车的需求量，并比较它们的预测效果。随机森林填充法首先，导入必需的库、训练集和检验集。 import pylab import calendar import numpy as np impor...

wong2016的博客 1万+

解决 Video 中设置字幕出现的跨域问题

最近在写一个视频播放器，但是当我给视频添加字幕之后，出现了跨域问题，这里记录一下。以下是用于测试的视频和字幕的链接视频：https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-576p.mp4字幕：https://cdn.plyr.io/static/demo/thumbs/240p.vtt。

旧梦 729

【SABRE 3D, SABRE 3DxT,LAM设备】2025年9月12日-生产期间维护用的双重隔离

生产期间维护用的双重隔离。该程序用于准备将一个或多个双工位设置为维护状态，同时SABRE 3D/3DxT/3D Scimitar保持生产运行。其目的是在不中断生产的情况下将双工位与运行中的设备隔离。

weixin_46735260的博客 573

《AI大模型评测与智能测试》

第三篇“实践蓝图”（第6-7章）着眼于测试领域AI应用，重点介绍了RAG、AI Agent开发及构建端到端智能测试系统的方法。本书聚焦AI时代的“质量”核心，以“AI赋能测试”（AI For Testing）与“AI模型评测”（Testing For AI）为双轮驱动。内容不仅深入剖析如何科学度量AI大模型的内在质量，还系统讲解如何利用AI赋能传统软件测试，帮助读者贯通从模型原理、评测到应用开发的全链路知识。

酌沧 1138

video js Tracks

文本轨道提供时间功能的HTML5视频触发文本查看器。video.js轨道在所有浏览器上工作。目前有五种类型的轨道：字幕：在视频中的对话，当音频是可用，但不理解。字幕在视频上显示。字幕：标题：转录的对话，音效，音乐和其他音频信息为线索，当观众是聋子或重听，或视频静音。字幕也显示在视频。章节：章节标题，用于在视频中创建导航。通常他们是在一个列表的形式，观众可以点击进入一个特定的章节。描述（不支持

隔壁老王 3466

桁架拓扑优化 matlab程序_拓扑优化在结构轻量化及板壳加筋肋最优布置的应用...

1 拓扑优化简介材料的有效利用一直都是人类追求的目标，也是许多研究领域不变的话题，并伴随着结构优化理论和方法的产生而发展。结构优化设计通常分为三个层次:（1）拓扑优化：在一个确定的连续区域内寻求结构内部非实体区域位置和数量的最佳配置，寻求结构中的构件布局及节点联结方式最优化，使结构能在满足应力、位移等约束条件下，将外载荷传递到结构支撑位置，同时使结构的某种性态指标达到最优；（2）形状优化：指在保持...

weixin_39525355的博客 1876

视频直播m3u8协议以及跨域问题和Videojs加载m3u8视频汇总

video.js支持m3u8格式直播 https://www.cnblogs.com/saysmy/p/6429835.html 为什么要使用video.js？ 1. PC端浏览器并不支持video直接播放m3u8格式的视频 2. 手机端各式各样的浏览器定制的video界面风格不统一，直接写原生的js控制视频兼容性较差 3. video.js解决以上两个问题，还可以有各种视频状态接口...

似水流年 2万+

基于MATLAB的逐次变分模态分解（SVMD）算法详解

本文详细介绍了基于MATLAB的逐次变分模态分解（SVMD）算法。SVMD是一种改进的变分模态分解方法，通过逐次分解机制克服传统VMD算法需要预设模态数量的缺陷。文章从信号分解方法的发展历程入手，阐述了SVMD的核心优势与创新点，包括参数敏感性降低、自适应分解能力和更好的频率分离性能。详细解析了SVMD的数学模型和优化求解过程，重点讨论了变分问题构建、ADMM优化方法和停止准则设计。通过MATLAB代码实现展示了SVMD的具体应用，包括参数初始化、信号预处理、模态提取和残余信号更新等关键步骤。

qq_42212808的博客 129

AI Agent在医疗诊断中的智能应用研究

本文探讨了AIAgent在医疗诊断中的智能应用，分析了其技术原理、实际案例及发展挑战。AIAgent通过机器学习算法处理医疗数据，提升诊断准确性和效率，市场规模预计2025年达200亿美元。核心技术包括数据预处理、深度学习模型和隐私保护方法。应用案例涵盖肺癌筛查、阿尔茨海默病预测等，但面临数据偏差、伦理责任等挑战。未来趋势包括多模态学习、个性化医疗和量子计算融合。随着技术优化和伦理完善，AIAgent将成为医疗体系的重要组成部分。

郑伟强dev的专栏 96

一款开源免费跨浏览器的视频播放器--videojs使用介绍

最近项目中的视频功能，需要做到浏览器全兼容，所以之前用html5实现的视频功能就需要进行改造了。在网上翻了个遍，试来试去，在所有的视频播放器中，就数它最实际了。首先我们来看看它的优点： 1.它是开源免费的，你可以在github很容易的获取它的最新代码。 2.使用它非常的容易，只要花几秒钟就可以架起一个视频播放页面。 3.它几乎兼容所有的浏览器，并且...

weixin_30896763的博客 1511

把 Custom Business Configurations 变成你的定制化维护台：Business Configuration Maintenance Object 设置全解

摘要：SAP BTP的Business Configuration（BCMO）为ABAP环境提供标准化的配置维护方案，通过RAP对象暴露为OData V4服务，自动生成Fiori elements维护界面，省去单独开发应用的成本。关键配置包括：Service Configuration定义业务名称和分组；List Report控制初始加载和视图变体；Object Page配置布局（Tabs/Page）和编辑权限；Table Settings选择表格类型（Grid/Responsive）和创建模式（Inlin

2007 年 ~ 2025 年，深耕 SAP 技术 18 年 166

＜track＞标签在＜video＞或＜audio＞元素中的作用，如何利用它实现字幕功能？

字幕条目是 WebVTT 文件的核心部分，每个字幕条目包含时间范围和对应的文本内容，一个文件中可以有多个字幕条目，它们之间用空行分隔。在网页里播放视频或者音频时，有时候我们会希望能有字幕显示出来，这样可以让大家更好地理解内容。通过以上这些方法，就能确保字幕文件与视频或音频正确匹配，为用户提供更好的观看或收听体验。通过上面这些步骤，你就能在视频或者音频里实现字幕功能啦，是不是很简单呀！在字幕文本中，可以使用一些 HTML 标签来设置文本的样式，如。时间范围后面紧跟字幕的文本内容，文本可以是多行的。

前端大白话 1269

【CANoe示例分析】SOMEIPWithvCDL_16

本示例来源于官方提供的示例工程：0004_基于vCDL实现SOMEIP通信_Demo\0004_基于vCDL实现SOMEIP通信_Demo\SOMEIPWithvCDL。

jasonj333 567

TMS_WebGMaps_1.9.8.0_Full_Source

TMS_WebGMaps_1.9.8.0_Full_Source 全源码 delphi cbuilder

track 字幕 html5,html5 track标签是什么意思？html5 track标签的使用方法介绍

本篇文章为大家介绍了关于html5 track标签的定义及其使用方法，还有关于html5 track标签的可选属性的一些描述，希望大家能都认真读完这篇文章。html5 track标签的定义和用法：标签为诸如 video 元素之类的媒介规定外部文本轨道。用于规定字幕文件或其他包含文本的文件，当媒介播放时，这些文件是可见的。html5标签可选的属性：default：默认轨道。(值：default)。...

weixin_35935264的博客 757

android 蓝牙通讯demo

android 下蓝牙通讯demo，实现了发现蓝牙，使能蓝牙，通过蓝牙发送消息。

【音频、视频标签：audio、video、source、track（含属性详解）】

摘要 HTML 提供了<audio>和<video>标签用于在网页中嵌入音频和视频内容。<audio>标签支持controls属性显示默认播放控件，可通过src属性或子标签<source>指定音频源文件。常用音频格式包括Opus（高效）、OGG（开源）、MP3（兼容性强）和AAC（苹果生态）。<video>标签功能类似，支持播放视频文件。<track>标签可为音视频添加字幕等文本轨道。开发者可通过属性控制自动播放、循环、静音等播放行为。

Hey_Coder 8475

win10 跳过U8环境检测的IE WebControls.rar

win10 安装u8的时候提示IE WebControls 不通过，这个工具可以欺骗u8的检查。跳过U8环境检测的IE WebControls。提示导入失败后，重新检测通过。

VC中sqlite的使用

在VC中对sqlite的使用，实现数据库大批数据的快速插入，读取数据库中的数据在ListCtrl中显示

零基础学习HTML(26)——audio标签、track标签

注：学习笔记基于小甲鱼学习视频，官方论坛：https://fishc.com.cn/forum.php 官方资料鱼C课程案例库：https://ilovefishc.com/html5/ html5速查手册：https://man.ilovefishc.com/html5/ css速查手册：https://man.ilovefishc.com/css3/ 学习正文 audio标签：https://man.ilovefishc.com/pageHTML5/audio.html track标签：https:/

qq_43650934的博客 663

HTML5 ＜track＞给视音频添加字幕

灵感来源：https://www.zhangxinxu.com/wordpress/2018/03/html5-video-webvtt-subtitle/ HTML5 可以用 <track> 标签给 <video> 或 <audio> 添加字幕，字幕格式有 WebVTT(.vtt)，TTML(.xml)格式，WebVTT语法简单，推荐使用 <video controls src="https://interactive-examples.mdn.

weixin_44240581的博客 2465

html video 增加字幕文件 track

这是最近再使用 video 时想看下字幕功能发现的。他需要在 video 标签下添加 track 标签，需要引入一个 vtt 文件。

LRF200307的博客 983

html中video标签使用几常见问题

媒体正在播放的情况下，如果媒体缓冲区的数据已经过期（视频已经播放完），则 user agent 有可能无法正常拿到数据。有些媒体可能有一个不以0秒开始的媒体时间线（不是从头开始播放的），因此应该将currentTime的时间设置在其数据失效之前。一个双精度浮点值，它指示媒体的持续时间(总长度)，以秒为单位，在媒体的时间线上。当浏览器显示自己的控件集(例如，当指定了 Controls 属性时)，Controlslist 属性将帮助浏览器选择在媒体元素上显示的控件。布尔属性，指明了视频里的音频的默认设置。

weixin_39105981的博客 8812

track 字幕 html5,HTML5标签：track元素的使用方法及作用

html元素标签是html5新增的标签，用于定义媒体资源有关的文本信息，有关标签的使用方法及作用详细介绍如下：标签的定义标签可以把外部文本文件链接到或定义的媒体资源上；标签为或提供不同语言的字幕或不同的外部文本文件；标签是空元素，也是单标签，即只有开始标签，没有结束标签；标签必须作为子元素写在或元素的内部；标签可以在或元素内部定义多个元素：标签是 HTML 5 中的新标...

weixin_36176386的博客 789

搞懂前端流媒体字幕

但仔细看上面的字幕，可以发现字幕有一个半透明的黑色背景，我尝试了很多方法都无法将这个背景去掉，查阅资料也是说这是由于不同浏览器对于流媒体的字幕编码导致的，我们已经完全控制了字幕的时机，但是没有完完全全控制字幕的样式。我们可以将track标签的kind属性赋值为metadata，当字幕变更时会触发一个cueChange事件，通过这个事件拿到字幕，然后塞进某个dom中来完全控制字幕的样式。

weixin_42684490的博客 2584

HTML5 video视频字幕的使用和制作

一、video支持视频格式：以下是三种最常用的格式 1、 ogg格式：带有Theora视频编码（免费）+Vorbis音频编码的Ogg文件（免费）支持的浏览器：firefox、chrome、opera 2、 MPEG4格式：带有H.264视频编码（收费）+AAC音频编码的MPEG4文件（收费）支持的浏览器：safari、chrome 3、 Webm格式：带有VP...

weixin_30836759的博客 1048

html5媒体标签track,HTML: <track> 标签

HTML: 标签HTML 元素被当作媒体元素— 和的子元素来使用。它允许指定时序文本字幕(或者基于时间的数据)，例如自动处理字幕。字幕格式有 WebVTT 格式(.vtt格式文件)— Web 视频文本字幕格式，以及指时序文本标签语言(TTML)格式。track 给媒体元素添加的数据的类型在 kind 属性中设置，属性值可以是 subtitles, captions, de...