Skip to main content

Webservice với Drupal và Json API

Hướng dẫn làm việc với module Json API trong Drupal, để tạo webservices API với các ứng dụng như React, Angular, Vue....

Bước 1: Cài đặt Web services với Drupal và Json API

JSON: API là module có sẵn trong core của Drupal, do đó chỉ cần install luôn trong extend

Image
Cài đặt JSON API

Sau khi cài xong vào configuration –>Web services->Json API

http://loc.api/admin/config/services/jsonapi

Image
 Json API

Tại đây mặc định chỉ có quyền đọc, nếu bạn muốn tạo, xoá và cập nhập thông qua JSON API cần cài thêm module HTTP basic Authentication, đây cũng là module có sẵn của Drupal

Image
HTTP basic Authentication

Sau khi enable module HTTP basic Authentication, bạn vào tạo thêm một role và assign user với role này.

1. Vào People > Roles ( /admin/people/roles), tạo một JsonAPI Role

Image
Tạo JsonAPI Role

2. Assign role mới tạo cho user bạn muốn sử dụng

Image
Assign User Vào Role Json API

3. Vào Permission (/admin/people/permissions) để cập nhập quyền đọc, sửa , tạo mới cho role của mình

Bước 2: Sử dụng Postman để test Web services với Drupal và Json API

2.1. Login với Json API

Để login bạn sử dụng path: http://loc.api/user/login?_format=json

var myHeaders = new Headers();
myHeaders.append("Content-type", "application/json");
myHeaders.append("Cookie", "SESS4c57cb59befbfdd90b59c038f71a434c=-Z9boKPh2gB3bviUoyGpFUcBR3rl0qiTqwjylJ7e1012GFPK");
var raw = JSON.stringify({
  "name": "apiuser",
  "pass": "EfdUjJrQ"
});
var requestOptions = {
  method: 'POST',
  headers: myHeaders,
  body: raw,
  redirect: 'follow'
};
fetch("http://loc.api/user/login?_format=json", requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));

Kết qủa bạn nhận được là 

{
    "current_user": {
        "uid": "3",
        "name": "apiuser"
    },
    "csrf_token": "xY9PqS48ZVV0nYelCUBJRXIBcUOks4kxahlcG7Ns2qg",
    "logout_token": "SUR0zuM4QORvJ-5uYNDGHVSY-kRAPD0t5eNWX91PL0E"
}

Lúc này bạn đã có csrf_token để dùng tạo hay update bất kỳ node nào.

2.2. Logout với Json API

Để login bạn dùng GET với path: /user/logout?_format=json&token=logout_token

var requestOptions = {
  method: 'GET',
  redirect: 'follow'
};

fetch("http://loc.api/user/logout?_format=json&token=xY9PqS48ZVV0nYelCUBJRXIBcUOks4kxahlcG7Ns2qg", requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));

Bạn dùng logout_token từ lết quả login để logout, khi thực request GET kết quả return là chuyển đến trang login, Drupal sẽ xoá session của user, bạn cần login để tạo hoặc update node.

2.3. Dùng GET để lấy node

Chúng ta có thể dùng GET để lấy nhiều bài viết, ví dụ: /jsonapi/node/article

Kết quả là 50 node với type là article và link để get 50 node tiếp theo

Bạn có thể thêm tham số sorted, filter, field related .... Bạn có thể xem thêm tại GET JSON API

Ví dụ: lấy Article có UUID "aa7b7965-0af7-4238-862e-c27a2167a5c8" và field_media_image

var requestOptions = {
  method: 'GET',
  redirect: 'follow'
};

fetch("http://loc.api/jsonapi/node/article/aa7b7965-0af7-4238-862e-c27a2167a5c8?include=field_media_image&fields[file--file]=uri,url", requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));

2.4. Dùng PATCH để update một node đã tồn tại

Dùng PATCH request để update một node đang tồn tại thông qua UUID. Đọc thêm document

X-CSRF-Token lấy từ bước login

Example:

var myHeaders = new Headers();
myHeaders.append("X-CSRF-Token", "TMqsmA2AMluxQxnkX0Jhlr16GwstzUvMsM4S_PrDeGk");
myHeaders.append("Content-Type", "application/vnd.api+json");
myHeaders.append("Accept", "application/json");
myHeaders.append("Cookie", "SESS70c42760b1454d0289f9204baa64ca74=8zVIY0EO1H0uG2ugyAxAernZxyr1MXQVIM3TMg4qU6JLfItf");

var raw = JSON.stringify({
  "data": {
    "type": "node--article",
    "id": "aa7b7965-0af7-4238-862e-c27a2167a5c8",
    "attributes": {
      "title": "My updated title",
      "body": {
        "value": "Updated body text",
        "format": "plain_text",
        "summary": "Updated summary"
      }
    },
    "relationships": {
      "uid": {
        "data": {
          "type": "user--user",
          "id": "a762c97f-c57a-460c-97ba-84f23dbe74bd"
        }
      }
    }
  }
});

var requestOptions = {
  method: 'PATCH',
  headers: myHeaders,
  body: raw,
  redirect: 'follow'
};

fetch("http://loc.umami/jsonapi/node/article/aa7b7965-0af7-4238-862e-c27a2167a5c8", requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error)); 

Ngoài ra bạn có thể tạo và xoá node bất kỳ thông qua jsonapi. Bạn có thể tham khảo thêm trên drupal.org