如何在HTML页面中播放视频

Question

我正在尝试在HTML页面上播放mp4视频，在网上搜索后发现，在HTML5中，可以使用下面的video标签来做到这一点

<video width="320" height="240" autoplay>
  <source src="movie.mp4" type="video/mp4">
</video>

我面临的问题

• 我的主要问题是我的视频存储在本地计算机中的某个位置，那么如何从该路径调用它
• 在我的系统中，它位于D drive中，所以我想从那里调用它
• 我对此并不陌生，所以我不知道自己是否做对了。我的方法正确吗？
• 我的要求是在我的网页上自动播放视频

我这样做

<video width="320" height="240" autoplay>
  <source src="D:\Video\samplevideo.mp4" type="video/mp4">
</video>

D:\Video\samplevideo.mp4是文件的路径，samplevideo.mp4是视频的名称

在Chrome上显示错误Not allowed to load local resource: file:///D:/Video/samplevideo.mp4

在Firefox All candidate resources failed to load. Media load paused.

上

编辑

我的主要重点是在网页上播放视频。

加载页面后，我需要在Web上播放视频（HTML页面），我在系统中的D:\Video\samplevideo.mp4处拥有该视频，该方法如何在加载页面时播放该视频。

Answer 1

您可以尝试吗

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

Answer 2

尝试此代码

 <video muted autoplay loop class="video video js-video" id="hero-vid" poster="video/desktop-screen-banner.png">
    <source src="video/movie.webm" type="video/webm">
    <source src="video/movie.mp4" type="video/mp4">
    <source src="video/movie.ogg" type="video/ogg">
</video>

Answer 3

有关获取此工作的基本信息，请D:/Video/samplevideo.mp4移至与html文件相同的位置。

然后将您的代码更改为：

<video width="320" height="240" autoplay>
  <source src="samplevideo.mp4" type="video/mp4">
</video>

确保已将Tomcat设置为服务器.mp4模仿类型或扩展名。

接下来，您应该阅读路径在HTML中的工作方式。

Answer 4

我可以给您一些建议。首先，您可以使用有关视频的绝对路径，将视频文件放置在服务器上，然后可以获得诸如www.xxx.com/movie.mp4之类的路径，然后可以编写您的HTML page上的代码，例如：

<video width="320" height="240" autoplay>
  <source src="www.xxx.com/movie.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

第二，您可以将视频文件放置在与HTML页面位置相同的目录中。例如，如果您的HTML页面位于名为test的目录中，则可以创建一个名为{{1 }}，您可以在src上编写代码，如下所示：

HTML page

第三，您可以使用<video width="320" height="240" autoplay> <source src="./src/movie.mp4" type="video/mp4"> Your browser does not support the video tag. </video> 标签上传本地视频文件，input代码如下：

HTML

<input type="file" id="myInput"/> <video controls autoplay></video> 代码如下：

js

第四，使用 var input = document.getElementById('myInput'), video = document.getElementById('myVideo'); input.onchange = function () { var file = this.files[0]; var url = URL.createObjectURL(file); video.innerHTML = '<source src="' + url + '" type="video/mp4">'; } 标签。您可以编写代码，如下所示：

object

//the HTML code
<div id="playhere"></div>

但是chrome浏览器不支持这种方式。

对不起，我是新来的英语人。

Answer 5

您需要输入这样的替代文字，以检查您的浏览器或智能手机是否支持视频自动播放。

像这样：

<video width="320" height="240" autoplay>
  <source src="movie.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

```