飞利浦电视浏览器如何获取页面的预览图像？

Question

我想在飞利浦电视(NETTV模型)浏览器中为页面提供我自己的预览图像.它显示在历史记录的页面地址附近.

我该怎么做？

(来自avforum的图片,来自谷歌搜索)

飞利浦电视使用Opera 11.6作为浏览器.userAgent字符串是:

Opera/9.80 (Linux mips; U; HbbTV/1.1.1 (; Philips; ; ; ; ) CE-HTML/1.0 NETTV/4.0.2; en) Presto/2.10.250 Version/11.60

Answer 1

我不确切知道飞利浦电视浏览器是如何工作的,但首先尝试的最合乎逻辑的事情就是og:image标签,看看电视是否可以选择它.

<meta property="og:image" content="http://example.com/image.png"/>

如果没有,那么电视可能正在使用一些屏幕捕获库.您可以尝试此解决方法以获得所需的行为:

首先,找出您电视的用户代理.例如,从电视浏览到http://whatsmyuseragent.com/.

然后在您的页面上,创建一个检查用户代理的小脚本,如果是电视,则将您的预览图片显示为叠加几秒钟.

希望电视将截取页面的初始渲染截图,然后显示您的电视画面.

function hideSplash() {
  document.getElementById("tv-splash").style.display = "none";
}

// Remove '|Mozilla' when development is ready 
if (/Philips|Mozilla/.test(navigator.userAgent)) {
  setTimeout(hideSplash, 2000);
} else {
  hideSplash();
}

#tv-splash {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #f00 url(http://i.imgur.com/IonCAf7.jpg) center center no-repeat;
  background-size: 50%;
  z-index: 1;
}

<div id="tv-splash"></div>
<h1>My website</h1>