用AJAX技術聚合RSS284278分享

有時候,你的Blog可能需要這樣的功能:

  在自己Blog上聚合並顯示朋友Blog的最新文章,這樣方便自己及時瞭解朋友的消息,另外,也方便訪問者找到和本Blog相關的blog和文章。

這個功能你可以叫它“Blog聚合”或者“Blog聯播”,目前,實現這樣功能的軟件或服務都有限制:比如,Terac Sinfonia、Lilina、MXNA雖然功能都很強大,但是需要安裝,不能自由定制,不能嵌入到Blog側邊欄。另一方面,目前提供這樣服務的BSP隻能聚合本系統內的用戶,限制也很多。

為瞭解決以上問題,我采用AJAX(Asynchronous JavaScript + XML)技術實現瞭在自己Blog上聚合並顯示朋友Blog的最新文章的功能,你可以根據需要,進行自由定制。默認是支持RSS 2.0規范的,Terac Miracle、Movable Type、Word Press、Donews / 博客園 / CSDN采用的.Text系統都能很好的支持,你可以自由修改,來支持RSS 0.92、RSS 1.0、Atom 0.3。

為什麼采用AJAX呢?首先,聚合別人的RSS不能影響自己網站的速度,所以需要異步執行,其次,RSS本身就是一個很規范的XML文檔,另外,由於聚合內容大小不可定,所以必須要局部刷新,最重要的一點,采用AJAX完全把加載解析XML的操作放到客戶端進行處理,節省服務器帶寬和資源,最後,這個功能我完全用JavaScript實現的,這樣,不管你的blog是ASP、.Net、PHP、JSP、Perl,甚至純HTML的都能用。下面說用法:

首先,在你Blog側邊欄合適位置加入這樣一段代碼:

<script src=”ajax_rss.js” type=”text/javascript”></script>

然後將下面的內容保存成“ajax_rss.js”,然後上傳到服務器相應的位置:

  //你可以自由添加符合RSS 2.0規范的 RSS
  processRSS(‘http://www.songlian.cn/blog/feed.php’);
  processRSS(‘http://www.bo-blog.com/weblog/feed.php’);
  function processRSS(url){
    var req = getXMLHttpRequest();
    req.onreadystatechange = function () {
      if (req.readyState == 4 && req.status == 200) {
        var doc=req.responseXML.documentElement;
        parseRSS(doc);
      }
    }
    req.open(“GET”,url, true);
    req.send(null);
  }
  function parseRSS(doc) {
   //如果要用RSS 0.92, RSS 1.0, Atom 0.3,你需要改下面3行
    var blogName=doc.getElementsByTagName(“title”)[0].firstChild.data;
    var entryName=doc.getElementsByTagName(“title”)[1].firstChild.data;
    var entryLink=doc.getElementsByTagName(“link”)[1].firstChild.data;
  document.getElementById(‘ajax_rss’).innerHTML += ‘<a target=”_blank” href=”‘+entryLink+'” title=”‘+blogName+'”>’+entryName+'</a><br/>’; }
  function getXMLHttpRequest() {
      var xmlhttp;
      try {
          xmlhttp = new ActiveXObject(“Msxml2.XMLHTTP”);
      } catch (e) {
          try {
              xmlhttp = new ActiveXObject(“Microsoft.XMLHTTP”);
          } catch (e) {
              xmlhttp = false;
          }
      }
      if (!xmlhttp && typeof XMLHttpRequest != ‘undefined’) {
          xmlhttp = new XMLHttpRequest();
      }
      return xmlhttp;
  }

好瞭,安裝結束,測試一下吧!

推薦閱讀: