移动 iframe youtube 观看尝试下载而不显示视频

Question

我有以下代码适用于桌面，但不适用于移动设备。该代码显示一个图像，如果单击该图像，它将用一个 iframe 替换它，该 iframe 包含分配给它的 youtube 视频。

<img src="/image/background/ph_shop.jpg" alt="Shop Directions" class="video-placeholder img-force shadow-box pointer" data-video="https://www.youtube.com/v/m8qcEilvdMQ&rel=0&autoplay=1" />
<script>
     $(".video-placeholder").click(function(){
          var video = \'<iframe frameborder="0" class="width-100 shadow-box" height="400" src="\'+ $(this).attr(\'data-video\') +\'" allowfullscreen></iframe>\';
          $(this).replaceWith(video);
     });
</script>

当我尝试在移动设备中单击图像时，它会删除该图像，但不会在其中加载任何内容，然后它会尝试下载一个无法打开的名为“m8qcEilvdMQ&rel=0&autoplay=1”的文件

Answer 1

我遇到了同样的问题并解决了！

解决方案是更改您的 YouTube 视频网址。

将您网址中的/v/ 替换为/embed/。

例如，将您的网址 https://www.youtube.com/v/m8qcEilvdMQ&rel=0&autoplay=1 替换为 https://www.youtube.com/embed/m8qcEilvdMQ&rel=0&autoplay=1

我不知道为什么“v”URL开始下载，我认为是因为它返回了内容类型application/x-shockwave-flash的标头，而embed URL返回了内容类型@987654328 @。