为啥 chrome 页面中的视频不起作用？
Posted
技术标签:
【中文标题】为啥 chrome 页面中的视频不起作用？【英文标题】：Why the video in the chrome page is not working?为什么 chrome 页面中的视频不起作用？ 【发布时间】：2021-10-30 18:20:45 【问题描述】：所以我是 html 新手，我正在使用 Visual Studio Code。我目前正在尝试制作一个包含视频的页面。我做了一个简单的代码，我认为它可以工作，但它没有。进入页面后，您会看到视频播放器，但视频未播放。视频名称为 bodybuild.mp4，位于视频中。
这是我的代码：
<html>
<head>
<title>Video_page_test</title>
</head>
<body>
<video controls>
<source src = "videos/bodybuild.mp4" type = "video/mp4">
</video>
</body>
</html>
【问题讨论】：
您是否检查了浏览器的控制台？那里有什么错误吗？ 没有错误。 这段代码应该可以正常工作。我们需要更多信息才能为您提供帮助。 “视频未播放”是什么意思？ 正在发生什么？你点击播放按钮了吗？ 这听起来好像文件无法加载，但这也应该给你的控制台添加一个错误。能否截个控制台截图？ 您显示的是 VS Code 的控制台，而不是浏览器的控制台。请参阅developer.chrome.com/docs/devtools/open 您的脚本将在与您的test.html 文件所在的文件夹相同的文件夹中查找/videos 文件夹，并在该/videos 文件夹中查找文件bodybuild.mp4。我假设您的/videos 文件夹和test.html 文件不在同一个文件夹中。
【参考方案1】：
可能的解决方案：
-
尝试使用绝对路径（即：
C:/user/videos/video.mp4）
或者
-
在网络浏览器中测试之前，将
videos 文件夹与您的 HTML 文件放在同一位置（在资源管理器中双击 HTML 文件，而不仅仅是通过调试器/IDE 运行 HTML）。
【讨论】：
@DiligentPD 如果 您的 html 文件从C:/user/ 运行，则视频标签也可以工作，因为 HTML 可以查看其位置（即 C:/user/）并找到有一个 videos 子文件夹... 测试：将您的 HTML 文件放入 c:\user\ 然后在其中添加一个名为 videos 的文件夹（带有 mp4 文件），然后最后像 @ 987654328@ 可以正常播放视频...
@DiligentPD 大概它可以在您的本地计算机上运行。但是，如果您将它托管在另一台机器上，它将无法按预期工作。所以相对路径通常是要走的路。以上是关于为啥 chrome 页面中的视频不起作用？的主要内容，如果未能解决你的问题，请参考以下文章
视频循环自动播放在 Chrome/safari 上不起作用（webkit 错误）