寻找与网页内容相关的图片(三)网易新闻与qq空间的做法

时间:2023-03-09 05:16:40
寻找与网页内容相关的图片(三)网易新闻与qq空间的做法

寻找与网页相关的图片现在看来无非有两种方式,第一种是网页自己指定,第二种是通过算法推断。

对于网站的内容提供者来说,他自己知道相关的图片在哪,正如前文所述可以在HTML的头部加上META标签,也可以像网易新闻和qq空间一样,作为一个参数写在javascript脚本里。

qq空间分享代码

<script type="text/javascript">
(function(){
var p = {
url:location.href,
showcount:'1',/*是否显示分享总数,显示:'1',不显示:'0' */
desc:'',/*默认分享理由(可选)*/
summary:'',/*分享摘要(可选)*/
title:'',/*分享标题(可选)*/
site:'',/*分享来源 如:腾讯网(可选)*/
pics:'', /*分享图片的路径(可选)*/
style:'203',
width:98,
height:22
};
var s = [];
for(var i in p){
s.push(i + '=' + encodeURIComponent(p[i]||''));
}
document.write(['<a version="1.0" class="qzOpenerDiv" href="http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?',s.join('&'),'" target="_blank">分享</a>'].join(''));
})();
</script>

这是qq空间分享所需要插入的代码,可以看到网站可以自己指定网站的摘要、标题、图片的路径等信息。所有的这些信息都是可选的,如果不填写这些信息呢,那就无从知晓了,背后的某个算法会找到合适的图片。

网易新闻分享代码

//顶部分享 底部分享
(function() {
NTES.ready(function() {
if(window.article_share14){
article_share14.setAttribute('data-url', window.location.href);
article_share14.setAttribute('data-title', document.title);
article_share14.setAttribute('data-pic', "http://img3.cache.netease.com/tech/2015/4/28/2015042812043170750_550.jpg");
article_share14.setAttribute('data-digest', "");
article_share14.setAttribute('data-source', "网易科技");
} if(NTES("#article_share13")){
article_share13.setAttribute('data-url', window.location.href);
article_share13.setAttribute('data-title', document.title);
article_share13.setAttribute('data-pic', "http://img3.cache.netease.com/tech/2015/4/28/2015042812043170750_550.jpg");
article_share13.setAttribute('data-digest', "");
article_share13.setAttribute('data-source', "网易科技");
} WbApi.initShareTipsSm({ sourceUrl: "http://tech.163.com/",
source: encodeURIComponent("网易科技"),
title: encodeURIComponent(document.title),
link: encodeURIComponent(window.location.href + '#sns_163') }, "wb-article-share-end"); });
})();

网易新闻的做法也以类似的方式自己指定相关图片的url。这对于网站发布内容的人来说着实是一个不错的方式,因为他们自己知道相关图片的url。但这有点像作弊,只会对一种网站有效,而不具有普遍性的规律。