表題の処理を行おうとしたところ、詳細な解説つきの「Google Feed API から YQL API へ移行したお話」が非常に参考になったのですが、ブログサービスによって RSS1.0 と 2.0 が混在していたり、サイトによって画像の取得に工夫が必要だったりしたため、そのあたりに手を加えたものです。
FC2、Ameba、livedoor、Seesaa、Hatena、So-net、goo、Yahoo!、excite、JUGEM 各ブログの RSS で確認済みですが、画像取得は色々見落としがありそうなので「reg」を適宜修正してください。
- goo ブログの RSS1.0 は description の文字数が少なく画像を含まない場合がありますので、画像を取得したい場合は RSS2.0 を使用してください
- excite ブログは RSS に画像タグを含まない仕様らしく、画像は取得できません
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>YQL API RSS 表示</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(function() {
$.getJSON("http://query.yahooapis.com/v1/public/yql?callback=?", {
// rss(取得件数):但し1件の場合は for と json.query.results.item[i] の [i] を消す
q: "select * from rss(5) where url in ('フィードのアドレス')",
format: "json"
}, function (json) {
for(var i in json.query.results.item){
var entry = json.query.results.item[i];
var link = entry.link;
var title = entry.title;
if(entry.pubDate) {
var date = new Date(entry.pubDate);
} else {
var date = new Date(entry.date);
}
var yyyy = date.getFullYear();
var mm = ('0' + (date.getMonth() + 1)).slice(-2);
var dd = ('0' + date.getDate()).slice(-2);
var dispDate = yyyy + '/' + mm + '/' + dd;
// newDate:NEW 扱いにする日数
var newDate = 3;
var dateNow = new Date();
var checkDate =(dateNow - date) / (1000 * 24 * 3600);
var dispNew = '';
if(checkDate <= newDate) {
dispNew = '<strong>NEW!!</strong>';
}
// ameba の絵文字除外、Yahoo! の画像 URL への対応など
var reg = 'src="((?!https:\/\/stat100.ameba).)(.*?)(\.jpg|\.jpeg|\.gif|\.png|\/img_)(.*?)"';
if(entry.encoded) {
var imgsrc = entry.encoded.match(reg);
} else {
var imgsrc = entry.description.match(reg);
}
var dispImg = '';
if(imgsrc) {
var dispImg = '<img ' + imgsrc + ' alt="">';
}
var dispElm = '<li><a href="' + link + '" target="_blank">' + dispImg + title + '</a>(' + dispDate + ')' + dispNew + '</li>';
$("#feed ul").append(dispElm);
}
});
});
</script>
<div id="feed">
<ul></ul>
</div>
</body>
</html>
##参考サイト