Chuyển đến nội dung chính

Lấy các trang gốc

Trong ví dụ này, chúng tôi sẽ trình bày cách lấy tất cả các trang cấp cao nhất (gốc) từ CMS bằng cách sử dụng API OneEntry.

✅ Mục đích của kịch bản:

  • Kết nối với API OneEntry
  • Lấy tất cả các trang cấp gốc trong một lần gọi
  • Truy cập siêu dữ liệu trang như loại, tiêu đề và số lượng sản phẩm

✅ Những gì bạn cần:

  • Một PROJECT_URL và APP_TOKEN hợp lệ để xác thực với API OneEntry.
  • Ít nhất một trang cấp gốc được cấu hình trong OneEntry.

📌 Quan trọng:

  • Những ví dụ này không bao gồm xử lý lỗi.
  • Bạn có thể quản lý lỗi bằng cách sử dụng khối try-catch hoặc bằng cách sử dụng cấu trúc như await Promise.catch((error) => error).
  • getRootPages() trả về một mảng đơn giản, KHÔNG phải là { items, total }.
  • Trường loại là "common_page" cho các trang nội dung và "catalog_page" cho các trang có sản phẩm.
  • Trường sản phẩm trên mỗi đối tượng trang cho thấy số lượng sản phẩm được gán cho trang đó.

📚 Xem trong tài liệu:

📦 Tham khảo SDK:

Thử nghiệm trực tiếp​

Chạy phương thức này một cách tương tác trong JS SDK sandbox — kết nối URL Dự án và Mã thông báo Ứng dụng của bạn khi lần đầu truy cập, sau đó mở:

  • Lấy các trang gốc — Trong ví dụ này, chúng tôi sẽ trình bày cách lấy tất cả các trang cấp cao nhất (gốc) từ CMS bằng cách sử dụng API OneEntry.

Kịch bản​

1. Nhập defineOneEntry từ SDK và định nghĩa PROJECT_URL và APP_TOKEN​

Ví dụ:

import { defineOneEntry } from 'oneentry';
import { IPagesEntity } from 'oneentry/dist/pages/pagesInterfaces';

const PROJECT_URL = 'your-project-url';
const APP_TOKEN = 'your-app-token';

2. Tạo một khách hàng API với defineOneEntry()​

Ví dụ:

const { Pages } = defineOneEntry(PROJECT_URL, {
  token: APP_TOKEN,
});

3. Lấy tất cả các trang gốc với Pages.getRootPages()​

Ví dụ:

// Returns a plain array (NOT `{ items, total }`)
const pages = await Pages.getRootPages('en_US');

if ('statusCode' in pages) {
  throw new Error(pages.message);
}
console.log('Pages: ', pages);
Kết quả:
[
  {
    "id": 49,
    "config": {},
    "depth": 0,
    "parentId": null,
    "pageUrl": "products",
    "attributeSetIdentifier": null,
    "total": "9",
    "localizeInfos": {
      "title": "Products",
      "menuTitle": "Products",
      "htmlContent": "",
      "plainContent": ""
    },
    "isVisible": true,
    "products": 3,
    "childrenCount": "0",
    "type": "catalog_page",
    "position": 9,
    "templateIdentifier": null,
    "isSync": false,
    "categoryPath": "products",
    "rating": {},
    "attributeValues": {},
    "moduleFormConfigs": []
  },
  {
    "id": 35,
    "config": {},
    "depth": 0,
    "parentId": null,
    "pageUrl": "get-all-pages",
    "attributeSetIdentifier": null,
    "total": "9",
    "localizeInfos": {
      "title": "Get all pages",
      "mdContent": "",
      "menuTitle": "Get all pages",
      "htmlContent": "<p>In this example, we demonstrate how to retrieve all pages of all depths using the OneEntry API.</p>",
      "plainContent": ""
    },
    "isVisible": true,
    "products": 0,
    "childrenCount": "0",
    "type": "common_page",
    "position": 8,
    "templateIdentifier": null,
    "isSync": false,
    "categoryPath": "get-all-pages",
    "rating": {},
    "attributeValues": {},
    "moduleFormConfigs": []
  },
  {
    "id": 10,
    "config": {},
    "depth": 0,
    "parentId": null,
    "pageUrl": "blocks",
    "attributeSetIdentifier": null,
    "total": "9",
    "localizeInfos": {
      "title": "Blocks",
      "menuTitle": "Blocks",
      "htmlContent": "",
      "plainContent": ""
    },
    "isVisible": true,
    "products": 0,
    "childrenCount": "0",
    "type": "common_page",
    "position": 7,
    "templateIdentifier": null,
    "isSync": false,
    "categoryPath": "blocks",
    "rating": {},
    "attributeValues": {},
    "moduleFormConfigs": []
  },
  {
    "id": 9,
    "config": {},
    "depth": 0,
    "parentId": null,
    "pageUrl": "home_web",
    "attributeSetIdentifier": null,
    "total": "9",
    "localizeInfos": {
      "title": "Home web",
      "menuTitle": "Home web",
      "htmlContent": "",
      "plainContent": ""
    },
    "isVisible": true,
    "products": 0,
    "childrenCount": "0",
    "type": "common_page",
    "position": 6,
    "templateIdentifier": null,
    "isSync": false,
    "categoryPath": "home_web",
    "rating": {},
    "attributeValues": {},
    "moduleFormConfigs": []
  },
  {
    "id": 7,
    "config": {},
    "depth": 0,
    "parentId": null,
    "pageUrl": "premium_page",
    "attributeSetIdentifier": null,
    "total": "9",
    "localizeInfos": {
      "title": "Premium page",
      "menuTitle": "Premium page",
      "htmlContent": "",
      "plainContent": ""
    },
    "isVisible": true,
    "products": 0,
    "childrenCount": "0",
    "type": "common_page",
    "position": 5,
    "templateIdentifier": null,
    "isSync": false,
    "categoryPath": "premium_page",
    "rating": {},
    "attributeValues": {},
    "moduleFormConfigs": []
  },
  {
    "id": 6,
    "config": {},
    "depth": 0,
    "parentId": null,
    "pageUrl": "subscriptions",
    "attributeSetIdentifier": null,
    "total": "9",
    "localizeInfos": {
      "title": "Subscriptions",
      "menuTitle": "Subscriptions",
      "htmlContent": "",
      "plainContent": ""
    },
    "isVisible": true,
    "products": 3,
    "childrenCount": "0",
    "type": "catalog_page",
    "position": 4,
    "templateIdentifier": null,
    "isSync": false,
    "categoryPath": "subscriptions",
    "rating": {},
    "attributeValues": {},
    "moduleFormConfigs": []
  },
  {
    "id": 8,
    "config": {},
    "depth": 0,
    "parentId": null,
    "pageUrl": "tickets",
    "attributeSetIdentifier": null,
    "total": "9",
    "localizeInfos": {
      "title": "Tickets",
      "menuTitle": "Tickets",
      "htmlContent": "",
      "plainContent": ""
    },
    "isVisible": true,
    "products": 3,
    "childrenCount": "0",
    "type": "catalog_page",
    "position": 3,
    "templateIdentifier": null,
    "isSync": false,
    "categoryPath": "tickets",
    "rating": {},
    "attributeValues": {},
    "moduleFormConfigs": [
      {
        "id": 5,
        "formIdentifier": "spam_form",
        "moduleIdentifier": "content",
        "isGlobal": false,
        "isClosed": false,
        "isModerate": true,
        "viewOnlyMyData": false,
        "commentOnlyMyData": false,
        "entityIdentifiers": [
          {
            "id": "tickets",
            "isNested": false
          }
        ],
        "formDataCount": 0,
        "ratingCalculation": "average",
        "allowHalfRatings": null,
        "maxRatingScale": null,
        "isAnonymous": null,
        "allowRerating": null,
        "isRating": null,
        "entityFormDataCount": {},
        "nestedEntityIdentifiers": [],
        "exceptionIds": []
      }
    ]
  },
  {
    "id": 11,
    "config": {},
    "depth": 0,
    "parentId": null,
    "pageUrl": "schedule",
    "attributeSetIdentifier": null,
    "total": "9",
    "localizeInfos": {
      "title": "Schedule form",
      "mdContent": "",
      "menuTitle": "Schedule form",
      "htmlContent": "<p>In this example, we demonstrate how to get a form with a timeInterval field and submit a selected time slot using the OneEntry API.</p>",
      "plainContent": ""
    },
    "isVisible": true,
    "products": 0,
    "childrenCount": "0",
    "type": "common_page",
    "position": 2,
    "templateIdentifier": null,
    "isSync": false,
    "categoryPath": "schedule",
    "rating": {},
    "attributeValues": {},
    "moduleFormConfigs": [
      {
        "id": 7,
        "formIdentifier": "schedule",
        "moduleIdentifier": "content",
        "isGlobal": false,
        "isClosed": false,
        "isModerate": true,
        "viewOnlyMyData": false,
        "commentOnlyMyData": false,
        "entityIdentifiers": [
          {
            "id": "schedule",
            "isNested": false
          }
        ],
        "formDataCount": 1,
        "ratingCalculation": "average",
        "allowHalfRatings": null,
        "maxRatingScale": null,
        "isAnonymous": null,
        "allowRerating": null,
        "isRating": null,
        "entityFormDataCount": {
          "schedule": 1
        },
        "nestedEntityIdentifiers": [],
        "exceptionIds": []
      }
    ]
  },
  {
    "id": 2,
    "config": {},
    "depth": 0,
    "parentId": null,
    "pageUrl": "services",
    "attributeSetIdentifier": null,
    "total": "9",
    "localizeInfos": {
      "title": "Services",
      "menuTitle": "Services",
      "htmlContent": "",
      "plainContent": ""
    },
    "isVisible": true,
    "products": 3,
    "childrenCount": "0",
    "type": "catalog_page",
    "position": 1,
    "templateIdentifier": null,
    "isSync": false,
    "categoryPath": "services",
    "rating": {},
    "attributeValues": {},
    "moduleFormConfigs": [
      {
        "id": 3,
        "formIdentifier": "file",
        "moduleIdentifier": "content",
        "isGlobal": false,
        "isClosed": false,
        "isModerate": false,
        "viewOnlyMyData": false,
        "commentOnlyMyData": false,
        "entityIdentifiers": [
          {
            "id": "services",
            "isNested": false
          }
        ],
        "formDataCount": 14,
        "ratingCalculation": "average",
        "allowHalfRatings": null,
        "maxRatingScale": null,
        "isAnonymous": null,
        "allowRerating": null,
        "isRating": null,
        "entityFormDataCount": {
          "services": 14
        },
        "nestedEntityIdentifiers": [],
        "exceptionIds": []
      },
      {
        "id": 2,
        "formIdentifier": "contact_us",
        "moduleIdentifier": "content",
        "isGlobal": false,
        "isClosed": false,
        "isModerate": false,
        "viewOnlyMyData": false,
        "commentOnlyMyData": false,
        "entityIdentifiers": [
          {
            "id": "services",
            "isNested": false
          }
        ],
        "formDataCount": 60,
        "ratingCalculation": "average",
        "allowHalfRatings": null,
        "maxRatingScale": null,
        "isAnonymous": null,
        "allowRerating": null,
        "isRating": null,
        "entityFormDataCount": {
          "services": 60
        },
        "nestedEntityIdentifiers": [],
        "exceptionIds": []
      },
      {
        "id": 1,
        "formIdentifier": "entity",
        "moduleIdentifier": "content",
        "isGlobal": false,
        "isClosed": false,
        "isModerate": false,
        "viewOnlyMyData": false,
        "commentOnlyMyData": false,
        "entityIdentifiers": [
          {
            "id": "services",
            "isNested": false
          }
        ],
        "formDataCount": 31,
        "ratingCalculation": "average",
        "allowHalfRatings": null,
        "maxRatingScale": null,
        "isAnonymous": null,
        "allowRerating": null,
        "isRating": null,
        "entityFormDataCount": {
          "services": 31
        },
        "nestedEntityIdentifiers": [],
        "exceptionIds": []
      }
    ]
  }
]

4. Truy cập các trường trang​

Ví dụ:

pages.forEach((page: IPagesEntity) => {
  const title = page.localizeInfos?.title;
  const type = page.type; // "common_page" | "catalog_page"
  const pageUrl = page.pageUrl;
  const depth = page.depth; // 0 for root pages
  const childrenCount = page.childrenCount;
  const productsCount = page.products; // number of products on this page
  console.log(title, type, pageUrl, depth, childrenCount, productsCount);
});
Kết quả:
{
  "title": "Services",
  "type": "catalog_page",
  "pageUrl": "services",
  "depth": 0,
  "childrenCount": "0",
  "productsCount": 3
}

Ví dụ cuối cùng​

// 1. Import defineOneEntry from SDK and define PROJECT_URL and APP_TOKEN
import { defineOneEntry } from 'oneentry';
import { IPagesEntity } from 'oneentry/dist/pages/pagesInterfaces';

const PROJECT_URL = 'your-project-url';
const APP_TOKEN = 'your-app-token';

// 2. Creating an API client with [defineOneEntry()](/docs/index/#Installation)
const { Pages } = defineOneEntry(PROJECT_URL, {
  token: APP_TOKEN,
});

// 3. Get all root pages with [Pages.getRootPages()](/docs/pages/getRootPages)
// Returns a plain array (NOT `{ items, total }`)
const pages = await Pages.getRootPages('en_US');

if ('statusCode' in pages) {
  throw new Error(pages.message);
}
console.log('Pages: ', pages);

// 4. Access page fields
pages.forEach((page: IPagesEntity) => {
  const title = page.localizeInfos?.title;
  const type = page.type; // "common_page" | "catalog_page"
  const pageUrl = page.pageUrl;
  const depth = page.depth; // 0 for root pages
  const childrenCount = page.childrenCount;
  const productsCount = page.products; // number of products on this page
  console.log(title, type, pageUrl, depth, childrenCount, productsCount);
});