如何在博客园博客上显示所有帖子列表?

3

我有一个博客网站,但是对于它的API我还不是很了解。我想知道是否有可能创建一个页面列出我的博客的所有文章。

我在互联网上找到了一些答案,但大部分已经不再适用 :(

另一个问题是:是否可以在不使用JavaScript的情况下使用数据库?我可能错了,但我认为大多数小部件都使用AJAX(调用一些JSON获取所有信息并在JS中显示)。

谢谢!

2个回答

11
要列出所有的博客文章,您不需要访问Blogger API。使用博客的Feed和一小段JavaScript即可完成。 可以在此处查看工作示例: http://codepen.io/yaqoob/pen/GqJDy/ 以下是JavaScript代码:
<script type="text/javascript">
var postTitle=new Array();var postUrl=new Array();var postMp3=new Array();var postDate=new Array();var postYear=new Array();var postMonth=new Array();var postYearMonth=new Array();var postYearMonth2=new Array();var postTanggal=new Array();var postLabels=new Array();var postBaru=new Array();var sortBy="titleasc";var tocLoaded=false;var numChars=250;var postFilter="";var numberfeed=0;var month2=["January","February","March","April","May","June","July","August","September","October","November","December"];function loadtoc(a){function b(){if("entry" in a.feed){var d=a.feed.entry.length;numberfeed=d;ii=0;for(var h=0;h<d;h++){var m=a.feed.entry[h];var e=m.title.$t;var l=m.published.$t.substring(0,10);var p=m.published.$t.substring(5,7);var g=m.published.$t.substring(8,10);var n=month2[parseInt(p,10)-1]+" "+m.published.$t.substring(0,4);var c="/"+m.published.$t.substring(0,4)+"_"+p+"_01_archive.html";var j;for(var f=0;f<m.link.length;f++){if(m.link[f].rel=="alternate"){j=m.link[f].href;break}}var o="";for(var f=0;f<m.link.length;f++){if(m.link[f].rel=="enclosure"){o=m.link[f].href;break}}postTitle.push(e);postDate.push(l);postUrl.push(j);postYearMonth.push(n);postYearMonth2.push(c);postTanggal.push(g)}}}b();displayToc2();document.write('<br/><a href="http://feeds2.feedburner.com/YourFeed" style="font-size: 11px; text-decoration:none; color: #616469;">Subscribe to Our RSS Feed and Get all the updates On the Fly</a></br/>')}function displayToc2(){var a=0;var b=0;while(b<postTitle.length){temp1=postYearMonth[b];document.write("<p/>");document.write('<p><a href="'+postYearMonth2[b]+'">'+temp1+"</a></p><ul>");firsti=a;do{document.write("<li>");document.write("["+postTanggal[a]+'] <a href="'+postUrl[a]+'">'+postTitle[a]+"</a>");document.write("</li>");a=a+1}while(postYearMonth[a]==temp1);b=a;document.write("</ul>");if(b>postTitle.length){break}}};
</script>

以下是JavaScript回调函数。

<script src="http://domain.blogspot.com/feeds/posts/default?max-results=500&alt=json-in-script&callback=loadtoc"></script>

将博客链接替换为自己的链接。


1
谢谢,这正是我所需要的。 但是,这里我们从客户端获取数据。我们不能直接从服务器获取吗? 无论如何,我会使用你的脚本 :) - user3371755
1
@kdamazic 我们受到博客平台的限制。我们没有任何服务器端访问权限,我们唯一可以访问的是Blogger API的XML模板。除此以外没有别的选择,所以JavaScript是唯一的选项。 - yaqoob
1
这将获取整篇文章的内容,而这并不必要。按照另一个答案所指出的,访问“/feeds/posts/summary”。 - Han

10

你好,我找到了最佳解决方案。

制作HTML和JavaScript小部件,并简单地发布代码,它可以很好地工作。

<div><ul id="postList12"></ul></div>

<script type="text/javascript">

var startIndex = 1;
var maxResults = 100;

function sendQuery12()
{
   var scpt = document.createElement("script");
   scpt.src = "/feeds/posts/summary?alt=json&callback=processPostList12&start-index=" + startIndex + "&max-results=" + maxResults;

   document.body.appendChild(scpt);
}

function processPostList12(root)
{
   var elmt = document.getElementById("postList12");
   if (!elmt)
      return;

   var feed = root.feed;

   if (feed.entry.length > 0)
   {
      for (var i = 0; i < feed.entry.length; i++)
      {
         var entry = feed.entry[i];

         var title = entry.title.$t;

         for (var j = 0; j < entry.link.length; j++)
         {
            if (entry.link[j].rel == "alternate")
            {
               var url = entry.link[j].href;

               if (url && url.length > 0 && title && title.length > 0)
               {
                  var liE = document.createElement("li");

                  var a1E = document.createElement("a");
                  a1E.href = url;
                  a1E.textContent = title;

                  liE.appendChild(a1E);

                  elmt.appendChild(liE);
               }

               break;
            }
         }
      }

      if (feed.entry.length >= maxResults)
      {
         startIndex += maxResults;
         sendQuery12();
      }
   }
}

sendQuery12();

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接