json to html

Lakukan konversi JSON ke HTML secara online dengan Node.js.

Menampilkan JSON(JavaScript Object Notation) data dalam format HTML adalah hal yang penting saat membangun dasbor, laporan visual, atau menyematkan data terstruktur ke dalam konten web. Alih-alih memformat data secara manual, Anda sekarang dapat mengonversi JSON ke HTML di Node.js menggunakan GroupDocs.Conversion Cloud SDK yang kuat — sebuah REST API yang menyederhanakan transformasi dokumen.

Dalam tutorial ini, kami akan memandu Anda tentang cara mengonversi file JSON menjadi dokumen HTML yang bersih dan siap browser menggunakan Node.js.

📌 Navigasi Cepat

🚀 Mengapa Mengonversi JSON ke HTML?

HTML adalah format standar untuk menampilkan data di web. Dengan mengonversi JSON (JavaScript Object Notation) ke HTML, pengembang dapat:

  • ✅ Renders data terstruktur dalam tata letak yang ramah pengguna.
  • ✅ Sematkan JSON di situs web atau aplikasi web.
  • ✅ Buat tabel atau blok yang dapat dibaca dari JSON bersarang.
  • ✅ Ekspor respons API ke dalam halaman HTML yang dapat dibaca.

⚙️ Instal GroupDocs Node.js SDK

GroupDocs.Conversion Cloud SDK for Node.js menawarkan cara ringan untuk mengintegrasikan konversi format file ke dalam aplikasi berbasis JavaScript Anda. Untuk memulai:

  1. Instal melalui npm:
npm install groupdocs-conversion-cloud --save
  1. Dapatkan kredensial API Anda (Client ID dan Client Secret) dari GroupDocs Cloud Dashboard. Untuk informasi lebih lanjut, Anda dapat mengikuti petunjuk yang ditentukan dalam tutorial.

🛠️ Konversi JSON ke HTML di Node.js

Ini cara mengonversi file JSON menjadi HTML menggunakan GroupDocs.Conversion Cloud SDK di Node.js:

📌 Langkah 1: Impor SDK dan konfigurasi 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);

📌 Langkah 2: Unggah file JSON ke Cloud

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

📌 Step 3: Atur opsi konversi (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.");

// More examples over https://github.com/groupdocs-conversion-cloud/groupdocs-conversion-cloud-dotnet
// Dapatkan kredensial API Anda 
string clientId = "XXXXXX-XXXXXXXXX-4088-9ca0-55c38f4b7f22";
string clientSecret1 = "XXXXXXXXXXXXXXXXXXXX";

// Buat sebuah instance dari kelas Configuration dan inisialisasi dengan Client ID & Client Secret
Configuration configuration = new Configuration(clientId, clientSecret);
// Tentukan URL dasar API untuk melakukan konversi JSON ke HTML secara online
configuration.setApiBaseUrl("https://api.groupdocs.cloud");

// Inisialisasi sebuah instance dari ConvertApi dengan objek Configuration
ConvertApi convertApi = new ConvertApi(configuration);

ConvertSettings settings = new ConvertSettings();
settings.setStorageName("internal");
settings.setFilePath("input.json");
settings.setFormat("HTML");
settings.setOutputPath("myResultant.html");
    
// Gunakan metode ConvertDocument untuk mengonversi JSON ke file HTML.
ConvertDocumentRequest request = new ConvertDocumentRequest(settings);
List<StoredConvertedResult> response = convertApi.convertDocument(request);
    
// Periksa respons dan cetak pesan sukses.
if (response != null && response.equals("OK")) {
    System.out.println("Conversion successful! Resultant HTML file is saved at: " + response.getFilePath());
}
json to html

Image:- A preview of JSON to HTML conversion performed with Node.js.

  • JSON input yang digunakan dalam contoh di atas dapat diunduh dari tautan ini.

💻 Konversi JSON ke HTML melalui cURL

Saat menggunakan GroupDocs.Conversion Cloud dengan perintah cURL, Anda juga dapat melakukan konversi JSON ke HTML. Pendekatan ini tidak hanya menyederhanakan otomatisasi dan integrasi ke berbagai alur kerja, tetapi juga memberikan transformasi data yang independen dari platform, mudah untuk diskrip, dan memungkinkan transformasi data yang mulus dan berkualitas tinggi tanpa memerlukan kode yang ekstensif.

Hasilkan token akses JWT berdasarkan kredensial klien dan kemudian jalankan perintah berikut:

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}\"}"

Silakan ganti inputFile dengan nama file JSON input, myResultant dengan nama file HTML hasil, dan accessToken dengan token akses JWT yang dipersonalisasi.

  • Anda dapat mempertimbangkan untuk menjalankan perintah berikut jika kebutuhan adalah untuk menyimpan HTML hasil ke drive lokal:
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\"}"

✅ Kesimpulan

Mengonversi JSON ke HTML menggunakan GroupDocs.Conversion Cloud SDK untuk Node.js membantu pengembang menghasilkan konten web yang dinamis, dapat dibaca, dan dapat dipresentasikan dari data terstruktur. Apakah Anda sedang membangun dasbor admin, mengotomatiskan laporan, atau bekerja dengan respons API JSON, SDK ini menyederhanakan prosesnya dengan keluaran HTML yang bersih.

📚 Sumber Daya Berguna

🌐 Aplikasi Online JSON ke HTML Gratis

Untuk mengalami kemampuan luar biasa GroupDocs.Conversion Cloud di browser web, Anda mungkin ingin mempertimbangkan untuk menggunakan Aplikasi Konversi JSON ke HTML kami yang gratis dan ringan.

json to html converter

🔗 Artikel Terkait

Kami menyarankan untuk mengunjungi tautan berikut untuk mempelajari lebih lanjut tentang: