javascript - 检测 "Missing Video"YouTube 图片

Question

来自 future 穴居人的问候，

我在我的页面上加载了很多 YouTube 缩略图。它们从我数据库中的缩略图网址加载。

作者有时会在 YouTube 上更改或删除相关视频。这给我留下了两个问题:

1. 我正在从 YouTube 加载空白图片

在我的数据库中，我仍然列出了该图像网址。

找出“丢失的视频”缩略图、不显示它并更新我的数据库的解决方案是什么？我需要通过识别该图像来触发事件。请注意，这是默认的“缺失”图像，可能会出现在不同的网址中。所以这不是查看特定网址那么简单的事情。

我也想过使用 youtube api，但每次页面加载时都会进行大量调用，这对我来说似乎违反直觉。

我需要检测图像并触发，所以有些甚至需要 JS/jquery 用于通过 ajax 更新我的数据库。

也许我想得太多了，所以如果有人对我的问题有其他解决方案，我会开放。

我读过这个:Javascript - Detect Youtube Default-Thumbnail

但是上面的解决方案似乎不合适。答案中的第一个选项是我现在正在做的事情，但它不起作用 - 因为即使您使用 1.jpg 或 2 等(这就是我使用的)，youtube 也会提供默认图像。基本上视频已经消失了。

第二个选项(base 64 编码、创建 Canvas 元素等)并未真正扩展，看起来更像是使用电锯代替手术刀。

谢谢

Answer 1

我发现如果我使用

http://img.youtube.com/vi/<video_id>/mqdefault.jpg,

它将显示 trim 后的 YouTube 缩略图(顶部和底部没有黑色边框)。其尺寸为 320 x 180像素。

如果没有可用的缩略图，您将获得 YouTube 的后备缩略图，但实际上是 120 x 90像素。

因此，这里有一种更简单的方法来确定您是否获得了无效的缩略图(与从 <img> 标记读取 base64 数据相比)。

希望这有帮助。