如何从 blogspot 的提要中获取数据？

Question

我想获取 post 供稿以放在 HTML 页面上... 要获得 posts，我使用以下 link： 'https://www.blogger.com/feeds/bloggerID/posts/default?max-results=N' 其中 bloggerID 是博主 ID，N 是 post 的数量。当我将 link 放在浏览器上时，我得到：

<?xml version='1.0' encoding='UTF-8'?><?xml-stylesheet href="https://www.blogger.com/styles/atom.css" type="text/css"?><feed xmlns='http://www.w3.org/2005/Atom' xmlns:openSearch='http://a9.com/-/spec/opensearchrss/1.0/' xmlns:gd='http://schemas.google.com/g/2005' xmlns:georss='http://www.georss.org/georss' xmlns:thr='http://purl.org/syndication/thread/1.0' xmlns:blogger='http://schemas.google.com/blogger/2008'><id>tag:blogger.com,1999:blog-614640065733671379</id><updated>2019-12-08T16:30:37.161-08:00</updated><title type='text'>Angélica Abadia Paulista Ribeiro</title><subtitle type='html'></subtitle><link rel='http://schemas.google.com/g/2005#feed' type='application/atom+xml' href='https://www.blogger.com/feeds/614640065733671379/posts/default?max-results=3'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/614640065733671379/posts/default?max-results=3'/><link rel='http://schemas.google.com/g/2005#post' type='application/atom+xml' href='https://www.blogger.com/feeds/614640065733671379/posts/default'/><link rel='alternate' type='text/html' href='http://angelribeirocomp.blogspot.com/'/><link rel='hub' href='http://pubsubhubbub.appspot.com/'/><author><name>AngelRibeiro</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='18' height='32' src='//4.bp.blogspot.com/-HCajnihNU-o/Uzoge8-ME2I/AAAAAAAABdo/x_XEG0duaZQ/s32/*'/></author><generator version='7.00' uri='https://www.blogger.com'>Blogger</generator><openSearch:totalResults>3</openSearch:totalResults><openSearch:startIndex>1</openSearch:startIndex><openSearch:itemsPerPage>3</openSearch:itemsPerPage><entry><id>tag:blogger.com,1999:blog-614640065733671379.post-3449800807582452116</id><published>2019-11-27T09:43:00.003-08:00</published><updated>2019-12-08T16:28:04.059-08:00</updated><title type='text'>teste3</title><content type='html'>&lt;div style="background-color: white; font-family: sans-serif; font-size: 14px; line-height: inherit; margin-bottom: 0.5em; margin-top: 0.5em;"&gt;&lt;div class="separator" style="clear: both; text-align: center;"&gt;&lt;a href="https://www.surveycto.com/wp-content/uploads/2018/04/ai-and-dev.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"&gt;&lt;img border="0" data-original-height="449" data-original-width="800" height="179" src="https://www.surveycto.com/wp-content/uploads/2018/04/ai-and-dev.jpg" width="320" /&gt;&lt;/a&gt;&lt;/div&gt;asdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfaasdfasdfasdfasdfa&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='https://angelribeirocomp.blogspot.com/feeds/3449800807582452116/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='https://angelribeirocomp.blogspot.com/2019/11/teste3.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/614640065733671379/posts/default/3449800807582452116'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/614640065733671379/posts/default/3449800807582452116'/><link rel='alternate' type='text/html' href='https://angelribeirocomp.blogspot.com/2019/11/teste3.html' title='teste3'/><author><name>AngelRibeiro</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='18' height='32' src='//4.bp.blogspot.com/-HCajnihNU-o/Uzoge8-ME2I/AAAAAAAABdo/x_XEG0duaZQ/s32/*'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-614640065733671379.post-4548548846718831705</id><published>2019-11-27T09:43:00.001-08:00</published><updated>2019-11-27T09:43:38.892-08:00</updated><title type='text'>teste 2</title><content type='html'>sdfsdfsdf</content><link rel='replies' type='application/atom+xml' href='https://angelribeirocomp.blogspot.com/feeds/4548548846718831705/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='https://angelribeirocomp.blogspot.com/2019/11/teste-2.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/614640065733671379/posts/default/4548548846718831705'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/614640065733671379/posts/default/4548548846718831705'/><link rel='alternate' type='text/html' href='https://angelribeirocomp.blogspot.com/2019/11/teste-2.html' title='teste 2'/><author><name>AngelRibeiro</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='18' height='32' src='//4.bp.blogspot.com/-HCajnihNU-o/Uzoge8-ME2I/AAAAAAAABdo/x_XEG0duaZQ/s32/*'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-614640065733671379.post-3986601118136760026</id><published>2019-11-27T03:07:00.001-08:00</published><updated>2019-11-27T03:07:02.420-08:00</updated><title type='text'>Teste</title><content type='html'>Teste</content><link rel='replies' type='application/atom+xml' href='https://angelribeirocomp.blogspot.com/feeds/3986601118136760026/comments/default' title='Postar comentários'/><link rel='replies' type='text/html' href='https://angelribeirocomp.blogspot.com/2019/11/teste.html#comment-form' title='0 Comentários'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/614640065733671379/posts/default/3986601118136760026'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/614640065733671379/posts/default/3986601118136760026'/><link rel='alternate' type='text/html' href='https://angelribeirocomp.blogspot.com/2019/11/teste.html' title='Teste'/><author><name>AngelRibeiro</name><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='18' height='32' src='//4.bp.blogspot.com/-HCajnihNU-o/Uzoge8-ME2I/AAAAAAAABdo/x_XEG0duaZQ/s32/*'/></author><thr:total>0</thr:total></entry></feed>

那么如何获取标题和图像、内容以及 post 的 link？我使用的代码如下：

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        myFunction(this);
    }
};
xhttp.open("GET", "https://www.blogger.com/feeds/614640065733671379/posts/default?max-results=3", true);
xhttp.send();

function myFunction(xml) {
    var xmlDoc = xml.responseXML;
    var x = xmlDoc.getElementsByTagName('author')[0];
    var y = x.childNodes[0];
    document.getElementById("gd:image").innerHTML =
    y.nodeValue; 
}
</script>

</body>
</html>

Answer 1

为了在从 Blogger 提要中获取数据时获得最佳性能，我建议您使用 JSON 提要而不是 XML，因为它轻便且速度更快。

要获取 JSON 供稿，请将 alt=json 参数添加到您的 Blogger 供稿 url

https://www.blogger.com/feeds/614640065733671379/posts/default?alt=json&max-results=3

并且您可以获得如下帖子：

<div id="demo"></div>

<script>
function getPosts(json) {
 var list = [];
 var data = json.feed.entry;
 for (var i = 0; i < data.length; i++) {
  var img = data[i].media$thumbnail ? "<img src='" + data[i].media$thumbnail.$t + "'>" : "";
  list.push("<div><a href='"+ data[i].link.pop().href + "'>" + img + data[i].title.$t + "</a></div>");
 }
 document.getElementById('demo').innerHTML = list.join('');
}
</script>

<script src="https://www.blogger.com/feeds/614640065733671379/posts/default?alt=json&max-results=3&callback=getPosts"></script>

如何从 blogspot 的提要中获取数据？

How to get the data from the feed of blogspot?

html

xml

blogger