json to html

Esegui la conversione da JSON a HTML online con Node.js.

Visualizzare JSON(JavaScript Object Notation) i dati in formato HTML è essenziale quando si creano dashboard, report visivi o si incorporano dati strutturati nei contenuti web. Piuttosto che formattare manualmente i dati, ora puoi convertire JSON in HTML in Node.js utilizzando il potente GroupDocs.Conversion Cloud SDK — un’API REST che semplifica la trasformazione dei documenti.

In questo tutorial, ti guideremo attraverso come convertire un file JSON in un documento HTML pulito e pronto per il browser utilizzando Node.js.

📌 Navigazione Veloce

🚀 Perché convertire JSON in HTML?

HTML è il formato standard per visualizzare i dati sul web. Convertendo JSON (JavaScript Object Notation) in HTML, gli sviluppatori possono:

  • ✅ Mostra dati strutturati in layout intuitivi.
  • ✅ Embeddare JSON in siti web o app web.
  • ✅ Crea tabelle o blocchi leggibili a partire da JSON annidati.
  • ✅ Esporta le risposte dell’API in pagine HTML leggibili.

⚙️ Installa il GroupDocs Node.js SDK

GroupDocs.Conversion Cloud SDK for Node.js offre un modo leggero per integrare la conversione dei formati di file nelle tue applicazioni basate su JavaScript. Per iniziare:

  1. Installa tramite npm:
npm install groupdocs-conversion-cloud --save
  1. Ottieni le tue credenziali API (Client ID e Client Secret) dal GroupDocs Cloud Dashboard. Per ulteriori informazioni, puoi seguire le istruzioni specificate in questo tutorial.

🛠️ Convertire JSON in HTML in Node.js

Ecco come convertire un file JSON in HTML utilizzando il GroupDocs.Conversion Cloud SDK in Node.js:

📌 Fase 1: Importa SDK e configura 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);

📌 Passo 2: Carica il file JSON su Cloud

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

📌 Step 3: Imposta le opzioni di conversione (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
// Obtain your API credentials 
string clientId = "XXXXXX-XXXXXXXXX-4088-9ca0-55c38f4b7f22";
string clientSecret1 = "XXXXXXXXXXXXXXXXXXXX";

// Crea un'istanza della classe Configuration e inizializzala con l'ID cliente e il segreto cliente.
Configuration configuration = new Configuration(clientId, clientSecret);
// Definisci l'URL base dell'API per eseguire la conversione da JSON a HTML online.
configuration.setApiBaseUrl("https://api.groupdocs.cloud");

// Inizializza un'istanza di ConvertApi con l'oggetto Configuration
ConvertApi convertApi = new ConvertApi(configuration);

ConvertSettings settings = new ConvertSettings();
settings.setStorageName("internal");
settings.setFilePath("input.json");
settings.setFormat("HTML");
settings.setOutputPath("myResultant.html");
    
// Usa il metodo ConvertDocument per convertire un file JSON in un file HTML
ConvertDocumentRequest request = new ConvertDocumentRequest(settings);
List<StoredConvertedResult> response = convertApi.convertDocument(request);
    
// Check the response and print success message
if (response != null && response.equals("OK")) {
    System.out.println("Conversion successful! Resultant HTML file is saved at: " + response.getFilePath());
}
json to html

Immagine:- Un’anteprima della conversione da JSON a HTML eseguita con Node.js.

  • Il JSON di input utilizzato nell’esempio sopra può essere scaricato da questo link.

💻 Convertire JSON in HTML tramite cURL

Mentre utilizzi GroupDocs.Conversion Cloud con comandi cURL, puoi anche eseguire la conversione da JSON a HTML. Questo approccio non solo semplifica l’automazione e l’integrazione in vari flussi di lavoro, ma offre una trasformazione dei dati indipendente dalla piattaforma, facile da scriptare e consente una trasformazione dei dati fluida e di alta qualità senza richiedere una codifica estesa.

Genera un token di accesso JWT basato sulle credenziali del client e poi esegui il seguente comando:

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

Per favore sostituisci inputFile con il nome del file JSON di input, myResultant con il nome del file HTML risultante e accessToken con un token di accesso JWT personalizzato.

  • Potresti considerare di eseguire il seguente comando se il requisito è salvare l’HTML risultante sul disco locale:
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\"}"

✅ Conclusione

La conversione di JSON in HTML utilizzando il GroupDocs.Conversion Cloud SDK per Node.js aiuta gli sviluppatori a generare contenuti web dinamici, leggibili e presentabili da dati strutturati. Sia che tu stia costruendo dashboard per amministratori, automatizzando report o lavorando con risposte API JSON, questo SDK semplifica il processo con un output HTML pulito.

📚 Risorse Utili

🌐 Applicazione online gratuita da JSON a HTML

Per sperimentare le straordinarie capacità GroupDocs.Conversion Cloud nel browser web, puoi prendere in considerazione l’utilizzo della nostra gratuita e leggera JSON to HTML Conversion App.

json to html converter

🔗 Articoli correlati

Consigliamo di visitare i seguenti link per saperne di più su: