Tutorial: Integrare in modo sicuro il visualizzatore Doconut con React – End to End
← Back to Blog7 min read

Tutorial: Integrare in modo sicuro il visualizzatore Doconut con React – End to End

Integrare in modo sicuro un visualizzatore di documenti richiede più che copiare uno snippet di middleware in un'applicazione ASP.NET Core. L'integrazione deve definire confini chiari per l'autenticazione, l'accesso ai documenti, la gestione delle sessioni, il rendering, le annotazioni, la ricerca, la stampa e la registrazione degli audit.

Le aziende che costruiscono portali incentrati sui documenti — come DMS, CRM, revisione legale o applicazioni di disegni ingegneristici — devono anche mantenere i file originali dietro il confine dell'applicazione. Doconut supporta un modello di visualizzazione lato server per documenti PDF, Office, CAD e immagini, mentre un front‑end React può fornire l'interfaccia utente.

Questo tutorial si concentra su un'architettura affidabile ed evita deliberatamente nomi di pacchetti, proprietà delle opzioni, firme dei metodi e percorsi degli endpoint che possono variare tra le versioni SDK. Utilizza la documentazione ufficiale corrispondente alla tua versione con licenza per i dettagli esatti di registrazione e API.

Architettura sicura del visualizzatore di documenti che collega un'interfaccia React, il livello di servizio ASP.NET Core e l'elaborazione protetta dei documenti
Architettura sicura del visualizzatore di documenti che collega un'interfaccia React, il livello di servizio ASP.NET Core e l'elaborazione protetta dei documenti

1️⃣ Passo 1 – Preparare i progetti ASP.NET Core e React

Prima di scrivere codice, assicurati che l'ambiente di sviluppo soddisfi i requisiti di base:

RequisitoVersione consigliata
Runtime .NET.NET 6 o successivo
ASP.NET Core6.0+
IDEUn ambiente di sviluppo .NET supportato
Front‑end (opzionale)Un'applicazione React compatibile con il tuo progetto
  1. Crea un nuovo progetto ASP.NET Core Web API
 dotnet new webapi -n DocPortal
 cd DocPortal
  1. Aggiungi le dipendenze Doconut con licenza – Ottieni i nomi esatti dei pacchetti, le versioni, le dipendenze native e le istruzioni per il caricamento della licenza dalla documentazione ufficiale della tua release Doconut. Non presumere che un pacchetto o wrapper mostrato in un tutorial non correlato sia valido per la tua versione.

  2. Prepara l'applicazione React – Se il visualizzatore verrà presentato tramite React, utilizza la configurazione front‑end già approvata dal tuo team. Mantieni l'applicazione React dipendente dalla tua API autenticata anziché da wrapper di terze parti non documentati.

  3. Esegui il commit dello stato iniziale – La maggior parte dei team enterprise applica una policy Git che richiede un commit firmato per qualsiasi modifica che tocchi licenze o impostazioni di sicurezza.

Ora hai una soluzione pulita pronta per l'integrazione server Doconut documentata.


2️⃣ Passo 2 – Configurare l'integrazione server in modo sicuro

Registra il visualizzatore seguendo le istruzioni fornite per la versione esatta di Doconut nel tuo progetto. L'ordine dei middleware, le registrazioni dei servizi, l'inizializzazione della licenza e i nomi delle proprietà di configurazione sono dettagli specifici della versione e non devono essere copiati da esempi non verificati.

Indipendentemente dalla versione SDK, l'applicazione ASP.NET Core circostante dovrebbe imporre questi controlli:

  • Autenticare prima di aprire un documento – Una sessione del visualizzatore non deve mai bypassare lo strato di identità dell'applicazione.
  • Risolvi gli identificatori dei documenti sul server – Accetta un ID documento a livello di applicazione, non un percorso fisico arbitrario fornito dal browser.
  • Autorizza ogni operazione – Visualizzazione, annotazione, ricerca, download e stampa possono richiedere permessi differenti.
  • Mantieni i segreti fuori dal controllo versione – Archivia licenze, stringhe di connessione e materiale di crittografia nel meccanismo di gestione dei segreti approvato.
  • Applica limiti alle richieste – Definisci limiti appropriati per upload, dimensione dei documenti, timeout e velocità intorno al flusso di lavoro del visualizzatore.
  • Registra gli eventi di sicurezza – Logga le decisioni di accesso e le azioni sui documenti senza scrivere i contenuti dei documenti o token sensibili nei log.

Tratta tutte le impostazioni SDK come configurazioni versionate. Conferma il loro significato nella referenza ufficiale prima di abilitarle in produzione.


3️⃣ Passo 3 – Isolare le sessioni dei documenti dietro un servizio applicativo

Mantieni le interazioni specifiche di Doconut all'interno di un servizio applicativo dedicato. Riferimenti a una classe Viewer sono utili a livello architetturale, ma le firme dei costruttori, i metodi di apertura dei documenti, i requisiti di cache e il comportamento di scoperta della licenza devono provenire dalla documentazione della versione installata.

Un confine di servizio sicuro dovrebbe:

  1. Ricevere un utente autenticato e un identificatore documento a livello di applicazione.
  2. Verificare i permessi dell'utente per l'azione richiesta.
  3. Risolvere il documento dallo storage server‑side approvato.
  4. Chiedere all'API del visualizzatore documentata di creare una sessione documento.
  5. Restituire solo le informazioni di sessione opache minime richieste dal client.
  6. Rilasciare o scadere le sessioni secondo le politiche di retention e cache.

Il browser non dovrebbe mai ricevere un percorso di storage fisico, dati di licenza, chiave di cache interna o riferimento non limitato al documento originale.


4️⃣ Passo 4 – Abilitare annotazioni, ricerca e stampa controllata

Annotazioni, ricerca, OCR e stampa controllata dovrebbero essere attivati solo quando sono inclusi nella tua configurazione Doconut con licenza e supportati dalla versione installata. Evita di presumere nomi di metodi, formati di persistenza o classi di opzioni.

  • Annotazioni – Decidi quali ruoli possono creare, modificare, visualizzare o eliminare markup. Memorizza lo stato delle annotazioni secondo le linee guida di persistenza per la tua versione SDK e i tuoi requisiti di audit.
  • Ricerca e OCR – Definisci quali tipi di documento richiedono OCR, dove il testo estratto è conservato e per quanto tempo gli indici rimangono disponibili. Tratta i risultati della ricerca come dati di documento e autorizzali di conseguenza.
  • Stampa controllata – Definisci limiti di pagine, politica di watermark, regole di approvazione ed eventi di audit a livello applicativo, quindi mappa tali requisiti alle capacità di stampa documentate.

Mantieni queste operazioni dietro lo stesso servizio applicativo usato per le sessioni documento, così i controller rimangono leggeri e le regole di business restano testabili.


5️⃣ Passo 5 – Collegare il front end React

L'applicazione React dovrebbe chiamare la tua API ASP.NET Core autenticata anziché accettare percorsi di storage o connettersi direttamente a servizi interni di documento. Definisci il tuo contratto API orientato alle risorse attorno alle azioni di business ed evita di pubblicare nomi di endpoint specifici dell'SDK come parte del contratto client pubblico.

Una tipica sequenza di interazione è:

  1. L'utente seleziona un documento già visibile nell'applicazione.
  2. React richiede una sessione di visualizzazione usando l'ID documento dell'applicazione.
  3. ASP.NET Core autentica la richiesta, autorizza il documento e coordina la sessione del visualizzatore.
  4. React riceve solo le informazioni necessarie per visualizzare il visualizzatore.
  5. Le richieste di annotazione, ricerca e stampa tornano attraverso l'API applicativa autenticata.
  6. Il server registra gli eventi di audit e scade la sessione quando opportuno.

Nell'interfaccia React, mantieni lo stato della sessione di breve durata, gestisci esplicitamente i fallimenti di autorizzazione, evita di memorizzare valori sensibili in storage persistente del browser e fornisci stati di caricamento ed errore che non rivelino percorsi interni o dettagli di eccezione.

Questa separazione mantiene il rendering e i controlli dei documenti sul server, mentre React resta responsabile della presentazione e dell'interazione.


Conclusione

Posizionando l'integrazione Doconut dietro un servizio applicativo ASP.NET Core sicuro, è possibile costruire un portale documentale per flussi di lavoro PDF, Office, CAD e immagini senza accoppiare l'interfaccia React a dettagli SDK non documentati. Autenticazione, autorizzazione, ciclo di vita della sessione, ricerca, annotazione, stampa e policy di audit rimangono parti esplicite del design della tua applicazione.

Pronto a valutare Doconut per il tuo progetto .NET? Usa il pacchetto ufficiale, la licenza e la documentazione API per la versione selezionata, quindi applica l'architettura e la checklist di sicurezza sopra al tuo implemento.

#Doconut#.NET#document viewer#React#enterprise development#visualizzatore di documenti#sviluppo enterprise