Hướng dẫn Get Data Blogger JSON Feed API

Hướng dẫn Get Data Blogger JSON Feed API đơn giản ngắn gọn, các bạn có thể áp dụng để lấy dữ liệu từ bài viết blogspot hiển thị ra ngoài trang blog của các bạn.

Các bạn có thể nhìn vô cây JSON bên dưới đó chính là các API để chúng ta có thể sử dụng để Get dữ liệu.

Đoạn code lấy 3 dữ liệu chính là: Tên bài, Link bài, Link hỉnh ảnh, với cách viết này chúng ta không cần sử dụng thư viện jQuery

<script>
//<![CDATA[
function datajson(json) {
for (var n = 0; n < json.feed.entry.length; n++) {
var entry = json.feed.entry[n];
for (var s = 0; s < json.feed.entry[n].link.length; s++) {
if (json.feed.entry[n].link[s].rel === "alternate") {
var link = json.feed.entry[n].link[s].href;
break
}
}
var title = json.feed.entry[n].title.$t;
var thumb = json.feed.entry[n].media$thumbnail.url;
var html = '<a href = "' + link + '">' + title + '</a><a href = "' + link + '"><img src = "' + thumb + '"/></a>';
document.write(html)
}
}
//]]>
</script>

Hoặc gắn cho một ID có tên là result ở một vị trí nào đó

<script>
//<![CDATA[
function datajson(json) {
for (var n = 0; n < json.feed.entry.length; n++) {
var entry = json.feed.entry[n];
for (var s = 0; s < json.feed.entry[n].link.length; s++) {
if (json.feed.entry[n].link[s].rel === "alternate") {
var link = json.feed.entry[n].link[s].href;
break
}
}
var title = json.feed.entry[n].title.$t;
var thumb = json.feed.entry[n].media$thumbnail.url;
var html = '<a href = "' + link + '">' + title + '</a><a href = "' + link + '"><img src = "' + thumb + '"/></a>';
document.getElementById("result").innerHTML += html;
}
}
//]]>
</script>

Sau khi viết xong đoạn Script để xử lý dữ liệu thì chúng ta cần gọi đoạn script trên như sau

1. Lấy toàn bộ bài viết

<script src='/feeds/posts/default?max-results=8&orderby=published&alt=json&callback=datajson'/>

2. Lấy theo Label

<script src='/feeds/posts/default/-/Tên Label?max-results=8&orderby=published&alt=json&callback=datajson'/>

Cũng đoạn script trên và viết theo kiểu Ajax như sau:

Đầu tiên chúng ta cần thêm thư viện jQuery

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js" />

Viết code theo kiểu Ajax chúng ta có thể chọn một trong hai

1. Chia làm hai

<script>
//<![CDATA[
function datajson(json) {
for (var n = 0; n < json.feed.entry.length; n++) {
var entry = json.feed.entry[n];
for (var s = 0; s < json.feed.entry[n].link.length; s++) {
if (json.feed.entry[n].link[s].rel === "alternate") {
var link = json.feed.entry[n].link[s].href;
break
}
}
var title = json.feed.entry[n].title.$t,
thumb = json.feed.entry[n].media$thumbnail.url;
var html = '<a href = "' + link + '">' + title + '</a><a href = "' + link + '"><img src = "' + thumb + '"/></a>';
$('#result').append(html);
}
}
$.ajax({
url: "/feeds/posts/default",
type: "get",
data: {
alt: "json",
"max-results": 5
},
dataType: "jsonp",
jsonpCallback: "datajson"
})
//]]>
</script>

2. Gộp chung

<script>
//<![CDATA[
$.ajax({
url: "/feeds/posts/default",
type: "get",
data: {
alt: "json",
"max-results": 5
},
dataType: "jsonp",
success: function(json) {
for (var n = 0; n < json.feed.entry.length; n++) {
var entry = json.feed.entry[n];
for (var s = 0; s < json.feed.entry[n].link.length; s++) {
if (json.feed.entry[n].link[s].rel === "alternate") {
var link = json.feed.entry[n].link[s].href;
break
}
}
var title = json.feed.entry[n].title.$t,
thumb = json.feed.entry[n].media$thumbnail.url;
var html = '<a href = "' + link + '">' + title + '</a><a href = "' + link + '"><img src = "' + thumb + '"/></a>';
$('#result').append(html);
}
}
})
//]]>
</script>

Trong đó bạn cần có 1 thẻ <div> hoặc <span> có id là result để hiển thị dữ liệu vào vị trí đó

<span id = 'result'/>

Để lấy theo label các bạn sửa chỗ url thành

url: "/feeds/posts/default/-/Tên label"

Cái var entry = json.feed.entry[n]; bạn có thể gọi lại của các thẻ data bên dưới cho ngắn gọn, hoặc có thể xoá đi.

Dựa vào đoạn code trên chúng ta có thể thiết kế các mẫu giao diện blogspot bán hàng, mẫu giao diện blogspot bất động sản...

Trước tiên mình xin cảm ơn tất cả khách hàng đã luôn tin tưởng và ủng hộ mình trong suốt thời gian qua (2016 tới hiện tại).

Nhằm nâng cao chất lượng phục vụ Quý khách hàng và hoàn thiện chất lượng như hỗ trợ, template. Hôm nay ngày 04/2/2021 mình là Hòa Trần admin trang Giaodien.blog sẽ tiến hành mở một trang Feedback để khách hàng đã mua, sử dụng dịch vụ bên mình toàn quyền nhận xét đánh giá công khai ở trang này.

Từ những Feedback này những gì mình làm được và chưa làm được, từ đó mình sẽ rút ra được những kinh nghiệm, và hoàn thiện tốt dịch vụ bên mình.

Quý khách hàng có thể để lại nhận xét reviews tại trang Feedback

Tags: Blog Json

Hướng dẫn Get Data Blogger JSON Feed API

Nhận xét

Đăng nhận xét

Mẫu tiếp thị liên kết