json to html

Chuyển đổi JSON sang HTML trực tuyến với Node.js.

Hiển thị JSON(JavaScript Object Notation) dữ liệu ở định dạng HTML là rất quan trọng khi xây dựng bảng điều khiển, báo cáo trực quan hoặc nhúng dữ liệu có cấu trúc vào nội dung web. Thay vì định dạng dữ liệu bằng tay, bạn có thể chuyển đổi JSON thành HTML trong Node.js bằng cách sử dụng GroupDocs.Conversion Cloud SDK mạnh mẽ — một REST API giúp đơn giản hóa việc chuyển đổi tài liệu.

Trong hướng dẫn này, chúng tôi sẽ hướng dẫn bạn cách chuyển đổi một tệp JSON thành một tài liệu HTML sạch, sẵn sàng cho trình duyệt bằng Node.js.

📌 Điều Hướng Nhanh

🚀 Tại sao chuyển đổi JSON sang HTML?

HTML là định dạng tiêu chuẩn để hiển thị dữ liệu trên web. Bằng cách chuyển đổi JSON (JavaScript Object Notation) thành HTML, các nhà phát triển có thể:

  • ✅ Hiển thị dữ liệu có cấu trúc trong các định dạng thân thiện với người dùng.
  • ✅ Nhúng JSON vào các trang web hoặc ứng dụng web.
  • ✅ Tạo các bảng hoặc khối dễ đọc từ JSON lồng nhau.
  • ✅ Xuất phản hồi API thành các trang HTML dễ đọc.

⚙️ Cài đặt GroupDocs Node.js SDK

GroupDocs.Conversion Cloud SDK for Node.js cung cấp một cách nhẹ nhàng để tích hợp chuyển đổi định dạng tệp vào các ứng dụng dựa trên JavaScript của bạn. Để bắt đầu:

  1. Cài đặt qua npm:
npm install groupdocs-conversion-cloud --save
  1. Lấy thông tin xác thực API của bạn (Client ID và Client Secret) từ GroupDocs Cloud Dashboard. Để biết thêm thông tin, bạn có thể làm theo hướng dẫn được chỉ định trong tutorial.

🛠️ Chuyển đổi JSON sang HTML trong Node.js

Dưới đây là cách chuyển đổi tệp JSON thành HTML bằng cách sử dụng GroupDocs.Conversion Cloud SDK trong Node.js:

📌 Bước 1: Nhập SDK và cấu hình API

const { Configuration, ConvertApi, FileApi, UploadFileRequest, ConvertSettings, ConvertDocumentRequest } = require("groupdocs-conversion-cloud");
const config = new Configuration("YOUR_CLIENT_ID", "YOUR_CLIENT_SECRET");
const convertApi = new ConvertApi(config);
const fileApi = new FileApi(config);

📌 Bước 2: Tải tệp JSON lên Cloud

const fs = require("fs");
const uploadRequest = new UploadFileRequest("input.json", fs.createReadStream("input.json"));
await fileApi.uploadFile(uploadRequest);

📌 Bước 3: Đặt tùy chọn chuyển đổi (JSON → HTML)

const settings = new ConvertSettings();
settings.filePath = "input.json";
settings.format = "html";
settings.outputPath = "converted/output.html";

const request = new ConvertDocumentRequest(settings);
await convertApi.convertDocument(request);
console.log("✅ JSON converted to HTML successfully.");

// Thêm ví dụ tại https://github.com/groupdocs-conversion-cloud/groupdocs-conversion-cloud-dotnet
// Lấy thông tin xác thực API của bạn 
string clientId = "XXXXXX-XXXXXXXXX-4088-9ca0-55c38f4b7f22";
string clientSecret1 = "XXXXXXXXXXXXXXXXXXXX";

// Tạo một thể hiện của lớp Configuration và khởi tạo nó với Client ID & Client Secret
Configuration configuration = new Configuration(clientId, clientSecret);
// Xác định URL cơ sở của API để thực hiện chuyển đổi JSON sang HTML trực tuyến.
configuration.setApiBaseUrl("https://api.groupdocs.cloud");

// Khởi tạo một thể hiện của ConvertApi với đối tượng Configuration
ConvertApi convertApi = new ConvertApi(configuration);

ConvertSettings settings = new ConvertSettings();
settings.setStorageName("internal");
settings.setFilePath("input.json");
settings.setFormat("HTML");
settings.setOutputPath("myResultant.html");
    
// Sử dụng phương thức ConvertDocument để chuyển đổi JSON thành tệp HTML
ConvertDocumentRequest request = new ConvertDocumentRequest(settings);
List<StoredConvertedResult> response = convertApi.convertDocument(request);
    
// Kiểm tra phản hồi và in thông báo thành công
if (response != null && response.equals("OK")) {
    System.out.println("Conversion successful! Resultant HTML file is saved at: " + response.getFilePath());
}
json to html

Hình ảnh:- Một bản xem trước của việc chuyển đổi JSON sang HTML được thực hiện với Node.js.

  • Đầu vào JSON được sử dụng trong ví dụ trên có thể được tải xuống từ this link.

💻 Chuyển đổi JSON sang HTML qua cURL

Trong khi sử dụng GroupDocs.Conversion Cloud với các lệnh cURL, bạn cũng có thể thực hiện chuyển đổi JSON sang HTML. Cách tiếp cận này không chỉ đơn giản hóa tự động hóa và tích hợp vào các quy trình làm việc khác nhau, mà còn cung cấp khả năng chuyển đổi dữ liệu chất lượng cao, độc lập với nền tảng, dễ viết kịch bản và cho phép thực hiện mượt mà mà không cần mã hóa phức tạp.

Tạo một mã thông báo truy cập JWT dựa trên thông tin xác thực của khách hàng và sau đó thực hiện lệnh sau:

curl -v "https://api.groupdocs.cloud/v2.0/conversion" \
-X POST \
-H "accept: application/json" \
-H "authorization: Bearer {YOUR_ACCESS_TOKEN}" \
-H "Content-Type: application/json" \
-d "{  \"StorageName\": \"internal\",  \"FilePath\": \"{inputFile}\",  \"Format\": \"html\",  \"OutputPath\": \"{myResultant}\"}"

Vui lòng thay thế inputFile bằng tên của tệp JSON đầu vào, myResultant bằng tên của tệp HTML kết quả và accessToken bằng một mã thông báo JWT truy cập cá nhân.

  • Bạn có thể xem xét thực hiện lệnh sau nếu yêu cầu là lưu HTML kết quả vào ổ địa phương:
curl -v "https://api.groupdocs.cloud/v2.0/conversion" \
-X POST \
-H "accept: application/json" \
-H "authorization: Bearer {accessToken}" \
-H "Content-Type: application/json" \
-d "{  \"StorageName\": \"internal\",  \"FilePath\": \"input.json\",  \"Format\": \"html\"}"

✅ Kết luận

Chuyển đổi JSON sang HTML bằng cách sử dụng GroupDocs.Conversion Cloud SDK cho Node.js giúp các nhà phát triển tạo nội dung web động, dễ đọc và có thể trình bày từ dữ liệu cấu trúc. Dù bạn đang xây dựng bảng điều khiển quản trị, tự động hóa báo cáo, hay làm việc với phản hồi từ API JSON, SDK này đơn giản hóa quá trình với đầu ra HTML sạch.

📚 Tài nguyên hữu ích

🌐 Ứng dụng trực tuyến miễn phí JSON sang HTML

Để trải nghiệm những khả năng tuyệt vời của GroupDocs.Conversion Cloud trên trình duyệt web, bạn có thể cân nhắc sử dụng ứng dụng JSON to HTML Conversion App miễn phí và nhẹ nhàng của chúng tôi.

bộ chuyển đổi json sang html

🔗 Bài viết liên quan

Chúng tôi khuyên bạn nên truy cập các liên kết sau để tìm hiểu thêm về: