Trang chủ WordpressWordpress Development WordPress JSON API – Giới thiệu

WordPress JSON API – Giới thiệu

bởi Thạch Phạm
1 bình luận 5082 views
Khuyến mãi hosting

Nói một cách đơn giản, là làm thế nào để có thể lấy dữ liệu một website WordPress của bạn và hiển thị nó ra một ứng dụng không phải WordPress? Nếu sử dụng PHP thì chắc chắn bạn sẽ cần phải kết nối vào MySQL, vậy nếu bạn viết ứng dụng cho Android sử dụng XML, Javascript thì sao?

Có một cách đơn giản hơn đó là sử dụng JSON để lưu trữ dữ liệu và bạn có thể dùng bất kỳ ngôn ngữ nào để lấy dữ liệu đó về ứng dụng một cách rất dễ dàng. Mặc định WordPress sẽ không có chức năng lưu trữ dữ liệu theo kiểu JSON nhưng chúng ta sẽ có giải pháp khác đó là sử dụng plugin JSON API. Và trong serie này, mình sẽ hướng dẫn bạn cách sử dụng plugin này cũng như áp dụng vào một vài ví dụ thực tế để xem sức mạnh của nó.

Để đọc hiểu serie này, bạn cần có kiến thức cơ bản về:

  • HTML (sure).
  • JSON.
  • PHP cơ bản, ít nhất là nắm vững Array.
  • Javascript.
  • AJAX thuần Javascript.

Giới thiệu JSON API plugin

JSON API là một plugin cho phép website bạn tự tạo một API server dựa trên website WordPress mà bạn cần lấy dữ liệu về, và các dữ liệu đó sẽ được lưu trữ dưới kiểu JSON.

Đây là ví dụ dữ liệu trả về dữ liệu của các users trong website khi tiến hành thực thi địa chỉ của API:

{"status":"ok","count":1,"authors":[{"id":1,"slug":"admin","name":"admin","first_name":"","last_name":"","nickname":"admin","url":"","description":""}]}

Bạn thấy đó, nó có hầu như tất cả những thông tin của các users. Mình thử bỏ đoạn trên vào http://jsonformatter.curiousconcept.com/ để xem có hệ thống hơn nhé.

Tips: Nên cài extension JSON Formatter để xem dữ liệu JSON trên trình duyệt đẹp hơn.

{
   "status":"ok",
   "count":1,
   "authors":[
      {
         "id":1,
         "slug":"admin",
         "name":"admin",
         "first_name":"",
         "last_name":"",
         "nickname":"admin",
         "url":"",
         "description":""
      }
   ]
}

Vậy công việc của chúng ta bây giờ là sẽ lấy dữ liệu trong JSON đó ra thành từng dữ liệu riêng và dùng vào mục đích gì đó là tùy bạn.

WP JSON API hỗ trợ những gì?

Hiện tại, plugin này có các phương thức lấy dữ liệu và gửi dữ liệu như sau:

Phương thức lấy dữ liệu:

  • info: Thông tin của API.
  • get_recent_posts: Lấy thông tin danh sách các post mới nhất.
  • get_posts: Lấy thông tin nhiều post theo tham số chỉ định.
  • get_post: Lấy thông tin của một post chỉ định.
  • get_page: Lấy thông tin của một page chỉ định.
  • get_date_posts: Lấy thông tin post  dựa vào ngày tháng năm.
  • get_category_posts: Lấy các post trong một category chỉ định.
  • get_tag_posts: Lấy danh sách posts của một tag chỉ định.
  • get_author_posts: Lấy danh sách posts của một thành viên chỉ định.
  • get_search_results: Lấy kết quả của một query tìm kiếm chỉ định.
  • get_date_index: Lấy toàn bộ dữ liệu của ngày tháng trong database.
  • get_category_index: Lấy toàn bộ dữ liệu của category có trong database.
  • get_tag_index: Lấy toàn bộ dữ liệu của tag trong database.
  • get_author_index: Lấy toàn bộ dữ liệu của các users trong database.
  • get_page_index: Lấy toàn bộ dữ liệu của các page trong database.
  • get_nonce: Lấy nonce key của chính mình để thực hiện các phương thức gửi dữ liệu (tạo, update và xóa post).
  • get_sidebar: Lấy dữ liệu của một widget trong database.

Phương thức gửi dữ liệu

  • create_post: Gửi bài mới lên website.
  • update_post: Cập nhật nội dung của post có sẵn trên website.
  • delete_post: Xóa một bài post chỉ định trên website.
  • submit_comment: Gửi bình luận vào một post chỉ định.

Không chỉ lấy theo cách đơn thuần, bạn còn có thể tùy chỉnh thêm kết quả nhận/gửi bằng cách sử dụng thêm các tham số mà họ có hỗ trợ, phần này mình sẽ nói từ từ đến.

Cách sử dụng plugin WP JSON API

Ở serie này mình không thể hướng dẫn hết các phương thức và tham số của plugin này, vì vậy bạn nên truy cập vào đây để xem hướng dẫn đầy đủ.

Để sử dụng, bạn cần cài đặt plugin JSON API vào website. Sau khi cài đặt xong, hãy truy cập vào phần Settings -> JSON API để xem danh sách những phương thức mà nó có hỗ trợ:

json-api-dashboard

Lưu ý, nếu bạn có sử dụng Permalinks thì sau khi cài đặt plugin này thì hãy vào Settings -> Permalinks ấn nút Save Change lại nhé.

Cách xem là bạn nhấp thẳng vào phương thức mà bạn muốn xem kết quả trả về. Một vài phương thức sẽ yêu cầu bạn viết các tham số bắt buộc, mình sẽ hướng dẫn bạn cách viết phương thức phía dưới.

Đường dẫn của API

Hiện tại plugin này hỗ trợ bạn sử dụng API với 3 kiểu đường dẫn như sau:

Kiểu Implicit mode

Kiểu này được áp dụng nếu bạn muốn xem dữ liệu kiểu JSON của một trang nào đó bằng cách thêm tham số ?json=1 vào địa chỉ trình duyệt.

Ví dụ mình đang truy cập trang có địa chỉ là:

http://localhost/markup-html-tags-and-formatting/

Thì nếu mình muốn xem dữ liệu kiểu JSON của trang này thì sửa thành như sau:

http://localhost/markup-html-tags-and-formatting/?json=1

Kiểu Explicit mode

Kiểu này sẽ lấy dữ liệu kiểu JSON nếu bạn không bật tính năng permalink hoặc vì lý do gì đó mà permalink không hoạt động. Ở kiểu này, nó sẽ bắt đầu bằng một tham số là json với giá trị là tên phương thức và tên tham số nếu có.

http://localhost.com/?json=get_recent_posts
http://localhost/?json=get_post?id=15

Kiểu user-friendly permalinks

Nếu bạn có bật chức năng permalink của website lên thì mình khuyến khích bạn nên sử dụng kiểu này, vừa dễ mà lại an toàn hơn. Kiểu này sẽ bắt đầu bằng một lớp tên là api và các lớp sau là tên phương thức cùng tham số.

http://localhost/api/get_recent_posts/
http://localhost/api/get_posts/?id=15

Cách viết tham số

Một vài phương thức sẽ yêu cầu một tham số bắt buộc ( như get_post cần tham số tên là id để nhận biết cần lấy dữ liệu của post nào). Do đó cũng rất quan trọng nếu bạn biết cách điền tham số.

Xem danh sách tham số cho từng phương thức của JSON API

Mọi tham số đều được nối với nhau bằng ký tự dấu chấm hỏi (?) trên địa chỉ API và đặt cuối địa chỉ. Các tham số bắt buộc phải được đặt trước cấc tham số tùy chọn. Ví dụ:

http://localhost/api/get_post/?id=1178
http://localhost/api/get_post/?id=1178?read_more=Xem Thêm

Ứng dụng JSON API

Trong bài này, mình sẽ hướng dẫn bạn ứng dụng JSON PHP để viết một ứng dụng PHP cơ bản để hiển thị thông tin bài viết từ website WordPress.

Đầu tiên bạn tạo một file PHP với tên là showpost.php và bắt đầu viết nội dung như sau:

<?php

$url = file_get_contents('http://localhost/testcode/api/get_posts/');

Dòng trên nghĩa là chúng ta sẽ sử dụng hàm file_get_contents() của PHP để lấy dữ liệu bên trong của một website nào đó, cụ thể ở đây là nội dung dữ liệu kiểu JSON. Nhớ thay link trên thành link API của bạn.

Bây giờ bạn thử var_dump($url) thì sẽ thấy nó hiển thị như sau:

json-api-ungdung1-vardump

Kết quả trả về như trên là dữ liệu thuần text bình thường vì bản thân PHP không hỗ trợ dữ liệu kiểu JSON. Do đó, chúng ta sẽ tiến hành chuyển dữ liệu JSON về dạng Array (mảng) bằng đoạn:

$kq = json_decode($url, true);

Bây giờ thử print_r($kq) nhé.

json-api-ungdung1-printr

Okay, bây giờ code của chúng ta tạm thời có 2 dòng như thế này:

$url = file_get_contents('http://localhost/testcode/api/get_posts/');
$kq = json_decode($url, true);

Bây giờ ta đã có một biến array tên là $kq rồi, vậy thì làm sao để tách từng thành phần trong mảng đó ra để hiển thị? Ai đã học PHP rồi thì chắc cũng biết là chúng ta sẽ sử dụng vòng lặp foreach để tiến hành tách giá trị của array. Ta có thêm:

foreach ( $kq['posts'] as $post ) {

extract($post); // Tách những tên đối tượng mảng ra thành một biến riêng
echo "<a href='".$url."'>".$title."</a></br>";

}

Tại sao chúng ta lại lặp trên $kq['posts'] mà không phải là biến $kq? Bởi vì mảng $kq nó chứa rất nhiều lớp khác nhau để hiển thị thông tin post. Và nếu bạn muốn lấy dữ liệu là nội dung post thì sẽ cần tách từ mảng con post có trong mảng mẹ $kq ra.

Sau khi lặp xong, bạn có thể lấy từng thành phần trong post ra với tên là $post['tên-đối-tượng']. Ví dụ:

  • $post['title'] – Lấy tiêu đề của post
  • $post['id'] – Lấy ID ủa post
  • $post['url'] – Lấy đường link của post.

Xem thêm chi tiết tại Post response object.

Do mình không muốn viết là $post['title'] nên mình đã sử dụng hàm extract() để tách các tên đối tượng mảng thành 1 biến riêng để sử dụng trong vòng lặp đó. Ví dụ: $title, $url, $id,….

Toàn bộ code của chúng ta bây giờ là:

<?php
$url = file_get_contents('http://localhost/testcode/api/get_posts/');
$kq = json_decode($url, true);

foreach ( $kq['posts'] as $post ) {

	extract($post); // Tách những tên đối tượng mảng ra thành một biến riêng
	echo "<a href='".$url."'>".$title."</a></br>";

}

Bây giờ hãy upload file showpost.php này vào localhost hoặc lên host để xem kết quả trả về là như thế này:

json-api-ungdung1-demobasic

Và nếu muốn hiển thị thêm các thông tin như mục category thì làm thế nào?

Như bạn thấy, đối tượng categories trong đây lại là một array nằm lồng trong mảng posts.

json-api-ungdung1-jsoncategories

nên bạn cần chèn thêm một dòng foreach nữa vào bên trong đoạn foreach vừa viết như sau:

	foreach ($post['categories'] as $post_category) {
		echo "Thư mục: ". $post_category['title']. "</br>"; // In tên category, nó sẽ nằm bên dưới tên mỗi post.
	}

Toàn bộ code ta có như sau:

<?php

$url = file_get_contents('http://localhost/testcode/api/get_posts/');
$kq = json_decode($url, true);

foreach ( $kq['posts'] as $post ) {

	extract($post);
	echo "<a href='".$url."'>".$title."</a></br>"; // In tiêu đề và link trỏ tới post

	foreach ($post['categories'] as $post_category) {
		echo "Thư mục: ". $post_category['title']. "</br>"; // In tên category, nó sẽ nằm bên dưới tên mỗi post.
	}

}

Kết quả:

json-api-ungdung1-demobasic-category

Lời kết

Trong bài này mình chỉ muốn giới thiệu đến các bạn về plugin JSON API này và cách ứng dụng đơn giản trong PHP. Bạn có thể sử dụng Javascript hay C# để thực hành thử  nhé, cũng tương tự cả mà thôi.

Ở các bài tiếp theo, mình sẽ hướng dẫn bạn cách áp dụng nâng cao hơn như cho phép tùy chọn tham số, kết hợp kỹ thuật AJAX và cách tạo form đăng bài lên website WordPress thông qua JSON API.

1 bình luận

Có thể bạn quan tâm

0 0 vote
Article Rating
guest
1 Comment
mới nhất
cũ nhất đánh giá nhiều
Inline Feedbacks
View all comments

[…] Download Image More @ thachpham.com […]

1
0
Would love your thoughts, please comment.x
()
x