Esiste un editor di documenti (doc, docx) disponibile in javascript

Qualcuno può suggerirmi una libreria nell'editor di documenti javascript (fine client) in cui l'utente può visualizzare e modificare documenti come doc, docx, odf ecc.

1 risposta

1

La soluzione migliore è cercare i convertitori e quindi modificare il contenuto convertito.

Sto cercando una soluzione funzionante da un paio di settimane ormai e la migliore che ho trovato finora è docx2html.

A seconda della tua piattaforma di sviluppo, puoi anche utilizzare "ONLYOFFICE Document Server Community Edition" di Google. Hanno editor di pagine per Word, Excel e Powerpoint, ma sono asp. Questa è una piattaforma aperta codice sorgente ed è disponibile su Github. Potrebbe valere la pena dare un'occhiata però.

È possibile convertire doc/docx in html utilizzando jquery/javascript?

Devo convertire doc/docx in html. Ho file archiviati in Amazon s3. Devo visualizzarlo e modificarlo nel browser. In questo momento sto utilizzando Apache POI per...

Generazione di documenti docx dal modello javascript docx

Sto cercando una libreria in javascript che possa generare documenti docx da un template docx e possa sostituire i tag con i loro valori e sostituire le immagini con altre immagini ho trovato il nome della libreria...

come giudicare se un file è doc o docx in POI

Il titolo può creare un po' di confusione. Il metodo più semplice dovrebbe essere basato sul nome dell'estensione, proprio come: // rappresenta InputStream if (filePath.endsWith(doc)) ( WordExtractor ex = new...

doc o docx: esiste un modo sicuro per identificare il tipo dalle "richieste" in python3?

1) Come posso distinguere tra file doc e docx dalle richieste? a) ad esempio, se ho url="https://www.iadb.org/Document.cfm?id=36943997" r = request.get(url,timeout=15)...

Importa file doc e docx in .Net e C#

Scrivo io editor di testo e voglio aggiungere la possibilità di importare file .doc e .docx. So di poter utilizzare l'automazione OLE, ma se utilizzo una libreria OLE recente non funzionerà...

Modifica di documenti (DOC, DOCX, RTF, TXT) in Webform

Sto sviluppando un'applicazione web utilizzando asp.net 3.5. Questa applicazione contiene molti documenti come .doc, .docx, .rtf, .pdf, .txt, ecc... e talvolta l'utente deve modificare questi documenti. IN...

Converti DOC/DOCX in HTML semantico

Vorrei convertire documenti doc/docx in HTML semantico. Alcuni desideri/requisiti: HTML semantico tale che i titoli nel documento siano, ecc., tabelle -...

Pacchetti Golang per convertire doc in docx e docx in pdf?

Sto scrivendo un'applicazione web in Golang in cui l'utente può caricare un file doc o docx. Alcuni contenuti del file verranno modificati in base al formato predefinito. Successivamente l'utente...

Carica un documento Rich Word nell'editor RichText telerik editor

Ho un modulo in cui carico un documento Word e lo salvo nel DB. Dovrò fare qualche segno su questi documenti più tardi. Al momento non ho trovato nulla per...

Conversione di file doc in formato docx

Ho convertito il file docx in html poiché è in formato Zip. ma devo convertire anche i file doc. C'è un modo per cambiare il file DOC in docx usando il codice (preferire Java). Per favore...

Un editor di codice è uno strumento utile per ogni programmatore. E ognuno sceglie per se stesso: alcuni apprezzano la funzionalità, altri apprezzano la mobilità, per altri la cosa principale è il design e la comodità. Ad alcune persone piace anche scrivere codice nel Blocco note, ma è come cercare di costruire una casa con un martello.

JavaScript è un linguaggio potente e capriccioso. Da un lato ci sono molti framework e librerie, dall'altro non la sintassi più semplice e i pericoli legati alla “dinamica”. Pertanto, è importante scegliere un editor con cui lavorare. La scelta giusta ti fornirà codice pulito, elevata velocità di sviluppo, un minimo di errori e piacere dal lavoro. Scegliere uno tra le centinaia di editor esistenti può richiedere molto tempo, quindi abbiamo svolto parte del lavoro per te. Ecco i 5 migliori.

WebStorm

WebStorm di JetBrains è meraviglioso in entrambe le sue forme: come IDE supporta il lavoro con i sistemi di controllo della versione, consente di distribuire il codice in remoto e come editor: servizi standard come l'evidenziazione della sintassi, il completamento automatico, la navigazione.

Vantaggi:

• LiveEdit - visualizzazione delle modifiche apportate al codice senza doverlo salvare;
• interazione con framework, come React, Angular, Meteor;
• più di cento test integrati per rilevare errori;
• integrazione con Mocha, Goniometro, Jest, Karma per test unitari;
• debugger su vasta scala per il debug del codice sui lati server e client;
• navigazione per lavorare contemporaneamente con più file;
• completamento del codice, evidenziazione della sintassi.

Screpolatura:

• costa $ 129 per il primo anno di attività;
• Per i programmatori principianti la funzionalità è ridondante.

Codice di Visual Studio

Un fork dell'IDE di Visual Studio finalizzato all'utilizzo del codice. È facile da imparare, facile da usare e allo stesso tempo funzionale.

Vantaggi:

• completamento contestuale sia della sintassi che delle variabili utilizzate, moduli, funzioni, ecc.;
• debugger con punti di interruzione, stack di chiamate, console interattiva;
• supporto per snippet e modelli;
• Integrazione Git;
• interfaccia comoda e semplice;
• redattore gratuito.

Screpolatura:

• pochi plugin.

Testo sublime

Un editor multipiattaforma comodo e collaudato nel tempo, con un'interfaccia personalizzabile e la capacità di eseguire azioni banali utilizzando i tasti di scelta rapida.

Vantaggi:

• Tasti di scelta rapida;
• navigazione del codice sotto forma di mini-mappa;
• possibilità di cambiare il tema visivo;
• supporto per frammenti;
• evidenziazione, completamento automatico delle variabili e sintassi;
• editing multiplo grazie all'utilizzo di puntatori;
• costruire il supporto del sistema;
• controllo della sintassi durante la digitazione;
• salvataggio automatico.

Screpolatura:

• versione completa costa $ 70;
• mancanza di un analizzatore di codice per l'inserimento dei collegamenti.

Editore dell'atomo

Apparso nel 2015, un editor di codice di Git, che copia il design di Sublime Text e lo avvolge in Chromium.

Vantaggi:

• più di 50 moduli aperti;
• interfaccia comoda e piacevole;
• gratuito;
• completamento ed evidenziazione del codice;
• gestore di pacchetti, di cui ce ne sono già più di 3,5 mila;
• impostazioni flessibili per l'editor, pacchetti plug-in e temi dell'interfaccia;
• modifica e navigazione tramite tasti di scelta rapida.

Screpolatura:

• bassa produttività;
• insieme vuoto "fuori dagli schemi".

Parentesi

Nel 2014, Brackets spaventava i programmatori con bug e carenze, ma ora sta gradualmente riconquistando la fiducia con nuove funzionalità di alta qualità.

Vantaggi:

• ricca dotazione “out of the box”;
• Modalità Anteprima dal vivo: anteprima delle modifiche nel browser in tempo reale;
• gestore di pacchetti;
• visualizzare le immagini e i colori utilizzati nel codice;
• completamento automatico ed evidenziazione della sintassi;
• analizzatore di codici;
• gratuito.

Screpolatura:

• focalizzazione rigorosa sul web e su HTML+CSS+JavaScript;
• sviluppo lento;
• prestazioni lente a causa delle funzioni di anteprima.

Ho creato con successo il codice per visualizzare un file PDF nel browser anziché nella finestra di dialogo "apri/salva". Ora sono bloccato nel tentativo di visualizzare Documento di parole nel browser. Voglio visualizzare un documento Word in Firefox, IE7+, Chrome, ecc.

qualcuno può aiutare? Ottengo sempre una finestra di dialogo "apri/salva" quando visualizzo la parola doc nel browser. Voglio implementare questa funzionalità utilizzando JavaScript.

6 risposte

tuttavia, se preferisci avere il supporto nativo, nella maggior parte se non in tutti i browser, ti consiglio di salvare nuovamente i file .doc/.docx come PDF; possono anche essere renderizzati in modo indipendente utilizzando PDF.js di Mozilla.

Le risposte di Brandon e fatbotdesigns sono entrambe corrette, ma implementando Google Docs Preview abbiamo trovato diversi file .docx che non potevano essere elaborati da Google. Passato all'anteprima online di MS Office e funziona a meraviglia.

https://view.officeapps.live.com/op/embed.aspx?src=http://remote.url.tld/path/to/document.doc"

Sembra che ci siano alcune librerie js in grado di gestire .docx (no .doc) per convertire html sul lato client (in un ordine specifico):

https://github.com/lalalic/docx2html - da docx a html, è supportata la maggior parte degli elementi

https://github.com/mwilliamson/mammoth.js - supporta intestazioni, elenchi, tabelle, note a piè di pagina, note a piè di pagina, immagini e testo della casella!--1-->

https://www.npmjs.com/package/docx2html - Converti documenti HTML in DOCX nel browser

https://github.com/artburkart/docx2html - apparentemente funziona nel browser

Nota: se stai cercando Il modo migliore converti il ​​file doc/docx sul lato client, probabilmente la risposta Non c'è bisogno. Se hai davvero bisogno di farlo, fallo. lato server, ad esempio con libreoffice in modalità headless, apache-poi o qualsiasi altra libreria è la soluzione migliore per te.

ViewerJS è utile per visualizzare/incorporare formati openoffice come odt,odp,ods e pdf.

per incorporare il documento openoffice/pdf

/ViewerJS/ è il percorso di ViewerJS

#../demo/ohm2013 - aggiungi il percorso al tuo file

Ciò rimuoverà qualsiasi dipendenza di runtime dai servizi Google e Microsoft (ad esempio, se ce n'erano o se eri limitato ad essi).

Ha anche il vantaggio che puoi espanderlo ad altri tipi di file se lo desideri (PPTX, XLS, DOC, ecc.)

Sicuramente ti sei imbattuto molte volte in editor visivi che ti consentono di modellare in modo abbastanza conveniente l'aspetto delle pagine o di alcuni messaggi, ad esempio su un forum. E non con i codici BB, ma ottenendo immediatamente un risultato specifico. Ci sono molti di questi editor su Internet. Uno dei più popolari è TinyMCE, tuttavia, sono un sostenitore dei miei script e credo che per ogni attività dovrebbe esserci una propria soluzione, e non universale. Pertanto, in questo articolo ti dirò come creare un editor visivo in JavaScript.

Ecco del codice abbastanza ben commentato:

// Visualizza i pulsanti di modifica
documento.write("");
documento.write("");
documento.write("
");
documento.write(""); // Aggiungi un iframe
/* A seconda del browser, otteniamo l'accesso al frame creato */
var isGecko = navigator.userAgent.toLowerCase().indexOf("gecko") != -1;
var iframe = (isGecko) ? document.getElementById("frameId") : frames["frameId"];
var iWin = (isGecko) ? iframe.contentWindow: iframe.window;
var iDoc = (isGecko) ? iframe.contentDocument: iframe.document;
/* Crea il codice per una pagina HTML vuota */
iHTML = "";
iDoc.open(); // Apre la cornice
iDoc.scrivi(iHTML); // Aggiunge il codice scritto al frame
iDoc.close(); // Chiude la cornice
iDoc.designMode = "acceso"; // Abilita la modalità di modifica del frame
/* Funzioni da impostare aspetto testo selezionato
Set completo di comandi possibili: http://javascript.itsoft.ru/execcom/execCommands.html */
funzione setGrassetto() (
iWin.focus();
iWin.document.execCommand("grassetto", null, "");
}
funzione setItal() (
iWin.focus();
iWin.document.execCommand("italic", null, "");
}
funzione salva() (
/* Salvare il codice HTML nel campo nascosto in modo da poter successivamente passare il codice HTML risultante allo script handler */
document.getElementById("content").value = iDoc.body.innerHTML;
restituisce vero;
}

A prima vista, il codice sembra essere molto complesso. E così è, ma se lo guardi in base ai suoi elementi di base, allora non c'è niente di complicato. C'è un modulo regolare e un campo nascosto, dove viene salvato il codice HTML generato nell'editor. L'editor stesso è un frame regolare, cioè una normale pagina HTML in cui possiamo scrivere testo (designMode = "on"). Inoltre, varie formattazioni vengono create utilizzando il metodo execCommand(), che esegue il comando specificato nel parametro. E penso che non sarà difficile per te creare nuovi pulsanti e associarvi gestori simili.

Non c'è nulla di superfluo in questo script, solo il più importante e basilare, e puoi usarlo come base per crearne uno tuo redattore visivo in JavaScript, in cui non ci sarà nulla di superfluo, ma solo ciò di cui hai bisogno.

Puoi scrivere il codice JavaScript in un normale Blocco note: basta salvare il risultato con l'estensione .js e non solo si collegherà al sito, ma funzionerà anche. Tuttavia, l'utilizzo di un editor così limitato rallenterà notevolmente lo sviluppo. Pertanto, è meglio prendere qualcosa di specializzato. Esistono diversi criteri principali in base ai quali è necessario scegliere un editor per lavorare con il codice JavaScript.

Innanzitutto, abbiamo bisogno dell'evidenziazione della sintassi: nomi, operatori e Simboli speciali dovrebbe essere visualizzato in modo diverso in modo che il codice possa essere letto rapidamente.

Evidenziazione della sintassi in Notepad++

In secondo luogo, è necessario il completamento automatico: quando inserisci il nome di una funzione o di una variabile, l'editor dovrebbe offrire diverse opzioni per i comandi che probabilmente inserirai. È consigliabile che mostri anche suggerimenti sul componente selezionato, ad esempio argomenti richiesti, tipo di variabile, breve descrizione e così via.

Completamento automatico in Notepad++

In terzo luogo, abbiamo bisogno della capacità di nascondere i singoli blocchi. Quando lavori su progetti di grandi dimensioni, questo è utile perché non devi scorrere enormi porzioni di codice per trovare ciò di cui hai bisogno.

Nascondere i blocchi in Visual Studio Code

È auspicabile che gli errori vengano evidenziati, quindi puoi immediatamente notarli e correggerli:

Visualizzazione degli errori nel codice di Visual Studio

Buoni bonus saranno la capacità di lavorare con più file in una finestra, un project manager, la selezione di temi, l'installazione di plugin e così via.

Esistono numerosi editor che soddisfano questi requisiti e sono adatti a lavorare con JavaScript. Su cosa scrivere il codice è una questione personale per ognuno, ma molte persone hanno problemi a scegliere il programma giusto, quindi abbiamo compilato un elenco di 6 buoni strumenti.

Blocco note++

Notepad++ è un editor open source semplice e conveniente. Dispone di evidenziazione della sintassi per diverse lingue, tra cui JS, formattazione automatica e completamento automatico. C'è la navigazione sotto forma di schede, gestore di file e carte codice.

Puoi lavorare con diverse codifiche, connettere compilatori, utilizzare plugin e altre funzioni utili. Ad esempio, l'aggiunta di QuickText migliorerà il completamento automatico integrato.

Notepad++ viene aggiornato regolarmente, quindi i bug vengono risolti rapidamente e vengono aggiunte nuove funzionalità. Purtroppo funziona solo su Windows.

Vim

L'editor Vim è da tempo un classico. Molte persone dicono che è difficile da capire, ma se gli dedichi abbastanza tempo, non vorrai più usare nient'altro.

Oltre a soddisfare tutti i criteri da noi scelti, Vim è anche completamente personalizzabile, quindi puoi:

• installare plugin;
• cambiare argomento;
• assegnare tasti di scelta rapida e così via.

Vim è completamente gratuito e funziona su tutte le piattaforme, da Windows, MacOS e Linux a MS DOS e OS/2.

Microsoft Visual Studio

Microsoft Visual Studio è un IDE che ha tutto il necessario per lavorare con JS. Oltre alla consueta evidenziazione della sintassi e al completamento automatico, puoi anche utilizzare un debugger e creare unit test.

Tuttavia, il programma pesa parecchio e carica pesantemente il sistema, quindi non è molto adatto per lavorare su computer deboli.

Un abbonamento mensile può costare da $ 45 a $ 250 al mese, ma ce ne sono anche versione gratuita per sviluppatori principianti e coloro che creano programmi open source. L'IDE è disponibile per Windows e MacOS e può essere installato su Linux utilizzando Wine.

Codice di Visual Studio

Visual Studio Code è una versione leggera (~170 MB contro 30 GB), multipiattaforma e gratuita di Visual Studio. Questo editor è preinstallato con il supporto per JavaScript, TypeScript e Node.JS.

Le estensioni per altre lingue possono essere scaricate direttamente da Visual Studio Code.

Il debugger integrato e i comandi Git per lavorare con il sistema di controllo della versione GitHub consentono di velocizzare il test e la pubblicazione delle applicazioni.

Testo sublime

Sublime Text è un semplice editor multipiattaforma. La sua interfaccia è personalizzabile e puoi eseguire alcune azioni utilizzando i tasti di scelta rapida.

Supporta anche snippet, completamento automatico, evidenziazione della sintassi e navigazione. Fantastico bonus: salvataggio automatico. Tuttavia, è più necessario ai principianti: dopotutto, i programmatori professionisti nel corso degli anni di lavoro sviluppano l'abitudine di salvare dopo aver inserito ogni comando.

Lo svantaggio principale di Sublime Text è che la versione completa costa $80 (la licenza viene rilasciata per un utente, che può utilizzare l'editor su qualsiasi computer). Altrimenti si adatta bene
Sviluppatori JS.