Чи є редактор документів (doc, docx), доступний у javascript

Чи може хтось запропонувати мені будь-яку бібліотеку в Редакторі документів javascript(client end), де користувач може переглядати та редагувати документи, такі як doc, docx, odf і т.д.

1 Відповідь

1

Найкраще шукати конвертери, а потім редагувати перетворений вміст.

Я шукав робоче рішення вже кілька тижнів, і найкраще, що я знайшов на сьогоднішній день, це docx2html.

Залежно від платформи розробки, ви також можете використовувати Google "ONLYOFFICE Document Server Community Edition". Вони мають у редакторах сторінок для Word, Excel і Powerpoint - але вони asp. Це платформа з відкритим вихідним кодомта доступна на Github. Можливо, варто подивитися, хоч.

Чи можна перетворити doc/docx на html за допомогою jquery/javascript?

Мені потрібно перетворити doc/docx на html. У мене є файли, які зберігаються в Amazon s3. Мені потрібно переглянути & редагувати його в браузері. Просто зараз, я використовую Apache POI для...

Створення документів docx із шаблону docx javascript

Я шукаю бібліотеку в javascript , яка може генерувати документи docx із шаблону docx і може замінювати теги їхніми значеннями та замінювати зображення іншими зображеннями я знайшов ім'я бібліотеки...

як судити, чи є файл doc або docx у POI

Назва може бути трохи заплутаною. Найпростіший метод має бути заснований на імені розширення так само, як: // is represents the InputStream if (filePath.endsWith(doc)) ( WordExtractor ex = new...

doc або docx: чи є safeway для ідентифікації типу з "requests" у python3?

1) Як я можу відрізнити файли doc та docx від запитів? а) наприклад, якщо я url="https://www.iadb.org/Document.cfm?id=36943997" r = requests.get(url,timeout=15)...

Імпорт doc та docx файлів в.Net та C#

Я пишу текстовий редакторта хочу додати можливість імпортувати файли.doc та.docx. Я знаю, що можу використовувати OLE Automation, але якщо я використовую нещодавню бібліотеку OLE, вона не буде...

Редагування документів (DOC, DOCX, RTF, TXT) у Webforms

Я розробляю веб-додаток за допомогою asp.net 3.5. Ця програма має багато документів, таких як .doc, .docx, .rtf, .pdf, .txt, і т.д... і інколи використовувати потрібно редагувати ці документи. У...

Конвертувати DOC/DOCX у семантичній HTML

Я хотів би конвертувати документи doc/docx у semantic HTML. Деякі wishes/requirements: Семантичний HTML такий, що заголовки в документі є , і т. д., таблиці -...

Пакети Golang для перетворення doc на docx і docx на pdf?

Я пишу веб-застосунок в Golang, в якому користувач може завантажити файл doc або docx. Частина вмісту файлу буде змінена відповідно до попередньо визначеного формату. Пізніше користувач...

Завантажте документ Rich Word у RichText редактор telerik редактора

У мене є якась форма, в яку я завантажую якийсь документ Word і зберігаю його на DB. Пізніше я маю зробити деяке маркування цих документів. В даний час я не знайшов нічого для...

Перетворення файлу doc на формат docx

Я конвертував файл docx у html, тому що він має формат Zip. але мені також потрібно конвертувати файли doc. Чи є спосіб, щоб змінити файл DOC в docx за допомогою коду(вважаю за краще java).Будь ласка,...

Редактор коду – підручний інструмент кожного програміста. І кожен підбирає під себе: хтось цінує функціональність, хтось мобільність, для когось головне – дизайн та зручність. Комусь навіть подобається писати код у Notepad, але це все одно, що намагатися збудувати будинок за допомогою молотка.

JavaScript - потужна та примхлива мова. З одного боку, безліч фреймворків та бібліотек, з іншого – не найпростіший синтаксис та небезпеки, пов'язані з «динамікою». Тому для роботи з ним важливо підібрати редактор. Правильний вибір забезпечить вам чистоту коду, високу швидкість розробки, мінімум помилок та задоволення від роботи. На вибір одного з сотень існуючих редакторів витратите багато часу, тому ми проробили частину роботи за вас. Ось 5 найкращих.

WebStorm

WebStorm від JetBrains прекрасний в обох своїх проявах: як IDE він підтримує роботу з системами контролю версій, дозволяє віддалено розгорнути код, як редактор - стандартні зручності, на кшталт підсвічування синтаксису, автодоповнення, навігації.

Переваги:

• LiveEdit - перегляд внесених до коду змін без необхідності його зберігати;
• взаємодія з фреймворками, наприклад, React, Angular, Meteor;
• більше сотні вбудованих тестів виявлення помилок;
• інтегрування з Mocha, Protractor, Jest, Karma для юніт-тестів;
• повномасштабний дебаггер для налагодження коду на серверній та клієнтській сторонах;
• навігація для одночасної роботи з кількома файлами;
• автодоповнення коду, підсвічування синтаксису.

Недоліки:

• коштує 129$ за перший рік роботи;
• для початківців кодерів функціонал надлишковий.

Visual Studio Code

Відгалуження IDE Visual Studio, спрямоване працювати з кодом. Він простий для освоєння, зручний у використанні і при цьому функціональний.

Переваги:

• контекстне автодоповнення, як синтаксису, і використовуваних змінних, модулів, функцій тощо. буд.;
• дебаггер з точками зупинки, стеком викликів, інтерактивною консоллю;
• підтримка сніпетів та шаблонів;
• інтеграція з Git;
• зручний та простий інтерфейс;
• безкоштовний редактор

Недоліки:

• мало плагінів.

Sublime Text

Зручний і перевірений часом кросплатформовий редактор, з інтерфейсом, що настроюється, і можливістю здійснювати тривіальні дії за допомогою гарячих клавіш.

Переваги:

• гарячі клавіші;
• навігація за кодом у вигляді міні-картки;
• можливість змінити візуальну тему;
• підтримка сніпетів;
• підсвічування, автодоповнення змінних та синтаксису;
• множинне виправлення завдяки використанню покажчиків;
• підтримка систем збирання;
• перевірка синтаксису прямо під час введення;
• автозбереження.

Недоліки:

• повна версіякоштує 70$;
• відсутність аналізатора коду для розміщення посилань.

Atom Editor

Редактор коду від Git, що з'явився в 2015 році, копіювальний дизайн Sublime Text і обгорнутий у Chromium.

Переваги:

• понад 50 відкритих модулів;
• зручний та приємний інтерфейс;
• безкоштовний;
• автодоповнення та підсвічування коду;
• менеджер пакетів, яких вже понад 3,5 тисячі;
• гнучкі налаштування редактора, пакетів, що підключаються, тим інтерфейсу;
• редагування та навігація за допомогою гарячих клавіш.

Недоліки:

• невисока продуктивність;
• порожня комплектація "з коробки".

Brackets

У 2014 році Brackets відлякав програмістів багами та недоробками, але тепер поступово повертає довіру новим якісним функціоналом.

Переваги:

• багата комплектація "з коробки";
• режим Live Preview – попередній перегляд правок у браузері в режимі реального часу;
• менеджер пакетів;
• показ у коді використовуваних зображень та кольорів;
• автодоповнення та підсвічування синтаксису;
• аналізатор коду;
• безкоштовний.

Недоліки:

• сувора орієнтація на веб та HTML+CSS+JavaScript;
• повільний розвиток;
• низька швидкодія через функції попереднього перегляду.

Я успішно зробив код для відображення PDF-файлу у браузері замість діалогового вікна "відкрити/зберегти". Тепер я застряг, намагаючись відобразити документ Wordу браузері. Я хочу відобразити документ Word у Firefox, IE7+, Chrome і т.д.

чи може хтось допомогти? Я завжди отримую діалогове вікно "відкрити/зберегти" при відображенні слова doc у браузері. Я хочу реалізувати цю функціональність за допомогою JavaScript.

6 відповідей

однак, якщо ви віддаєте перевагу вбудованій підтримці, в більшості, якщо не в усіх браузерах, я б рекомендував resaving .doc / .docx як PDF-файл вони також можуть бути незалежно візуалізовані за допомогою у форматі PDF.js Mozilla.

відповіді Брендона та fatbotdesigns обидва правильні, але реалізувавши попередній перегляд документів Google, ми знайшли кілька.docx файли, які не можуть бути оброблені Google. Переключився на MS Office онлайн прев'ю та працює як шарм.

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

здається, є деякі бібліотеки js, які можуть обробляти.docx (ні.doc) для конвертації html на стороні клієнта (у певному порядку):

https://github.com/lalalic/docx2html - docx в html, більшість елементів підтримуються

https://github.com/mwilliamson/mammoth.js - підтримує заголовки, списки, таблиці, виноски, виноски, зображення та текст коробки!--1-->

https://www.npmjs.com/package/docx2html - перетворення HTML-документів у DOCX у браузері

https://github.com/artburkart/docx2html - мабуть, працює у браузері

Примітка: Якщо ви шукаєте кращий спосібконвертувати файл doc/docx на стороні клієнта, то, ймовірно, відповідь не треба. Якщо тобі справді потрібно це зробити, зроби це. на стороні сервера, тобто з libreoffice в безголовому режимі, apache-poi або будь-якою іншою бібліотекою, найкраще підходить для вас.

ViewerJS корисно для перегляду/вбудовування формату openoffice, такого як odt,odp,ods, а також pdf.

для вбудовування openoffice/pdf документа

/ViewerJS/ - це шлях ViewerJS

#../demo/ohm2013 - шлях ваш файл хочете додайте

Це видаляє будь-які залежності часу виконання від служб Google і Microsoft (наприклад, якщо вони були або ви були обмежені їх).

Він також має перевагу, яку ви можете розширити до інших типів файлів Якщо ви хотіли (PPTX, XLS, DOC і т. д.)

Напевно, Ви багато разів стикалися з візуальними редакторами, які дозволяють досить зручно формувати зовнішній вигляд сторінок або якихось повідомлень, наприклад, на форумі. Причому не з BB-кодами, а одразу отримуючи конкретний результат. Цих редакторів чимало в Інтернеті. Один з найпопулярніших - це TinyMCE, проте, я прихильник власних скриптів і вважаю, що для кожного завдання має бути своє рішення, а не універсальне. Тому в цій статті я розповім, як створити візуальний редактор на JavaScript.

Відразу наводжу досить добре прокоментований код:

// Виведення кнопок редагування
document.write("");
document.write("");
document.write("
");
document.write(""); // Додаємо iframe
/* Залежно від браузера отримуємо доступ до створеного кадру */
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;
/* Створюємо код порожньої HTML-сторінки */
iHTML = "";
iDoc.open(); // Відкриваємо кадр
iDoc.write(iHTML); // Додаємо написаний код у кадр
iDoc.close(); // Закриваємо кадр
iDoc.designMode = "on"; // Включаємо режим редагування кадру
/* Функції для завдання зовнішнього виглядувиділеного тексту
Повний набір можливих команд: http://javascript.itsoft.ru/execcom/execCommands.html */
function setBold() (
iWin.focus();
iWin.document.execCommand("bold", null, "");
}
function setItal() (
iWin.focus();
iWin.document.execCommand("italic", null, "");
}
function save() (
/* Збереження HTML-коду в полі hidden, щоб потім можна було передати отриманий HTML-код скрипт-обробник */
document.getElementById("content").value = iDoc.body.innerHTML;
return true;
}

На перший погляд здається, що код дуже складний. І так воно і є, але якщо розглянути його за базовими елементами, нічого складного немає. Є звичайна форма і поле hidden , куди зберігається HTML-код, що вийшов у редакторі. Сам редактор - це звичайний кадр, тобто звичайна HTML-сторінка, в якій ми можемо писати текст (designMode = "on"). А різні форматування створюються за допомогою методу execCommand(), який виконує вказану в параметрі команду. А вже створити нові кнопки та прикріпити до них аналогічні обробники, думаю, що не складе для Вас труднощів.

У цьому скрипті немає нічого зайвого, тільки найголовніше та основне, і його можна брати за основу для створення власного візуального редакторана JavaScript, в якому не буде нічого зайвого, а лише те, що потрібно Вам.

Написати код JavaScript можна і в звичайному "Блокноті" - достатньо зберегти результат з розширенням.js, і він не тільки підключиться до сайту, але навіть запрацює. Проте використання такого обмеженого редактора дуже сповільнить розробку. Тому краще взяти щось спеціалізоване. Є кілька основних критеріїв, за якими потрібно вибирати редактор для роботи з кодом JavaScript.

По-перше, потрібне підсвічування синтаксису: назви, оператори та спеціальні символиповинні відображатись по-різному, щоб можна було швидко прочитати код.

Підсвічування синтаксису в Notepad++

По-друге, потрібно автодоповнення: коли ви вводите назву функції або змінної, редактор повинен запропонувати кілька варіантів команд, які ви, ймовірно, хочете ввести. Бажано, щоб він також показував підказки до обраного компонента - наприклад, необхідні аргументи, тип змінної, короткий описі так далі.

Автодоповнення в Notepad++

По-третє, потрібна можливість приховувати окремі блоки. При роботі над великими проектами це корисно, тому що не доведеться скролити величезні фрагменти коду, щоб знайти потрібний.

Приховування блоків у Visual Studio Code

Бажано, щоб підсвічувалися помилки – тоді ви зможете їх відразу помітити та виправити:

Відображення помилок у Visual Studio Code

Хорошими бонусами будуть можливість працювати з кількома файлами в одному вікні, менеджер проектів, вибір тем, встановлення плагінів тощо.

Існує велика кількість редакторів, які відповідають цим вимогам та підійдуть для роботи з JavaScript. На чому писати код - особиста справа кожного, але у багатьох виникають проблеми з вибором відповідної програми, тому ми склали список із 6 хороших інструментів.

Notepad++

Notepad++ - простий та зручний редактор із відкритим вихідним кодом. У ньому є підсвічування синтаксису кількох мов, у тому числі і JS, автоматичне форматування та автодоповнення. Присутня навігація у вигляді вкладок, файлового менеджерата карти коду.

Доступні роботи з різними кодуваннями, підключення компіляторів, використання плагінів та інші корисні функції. Наприклад, додавши QuickText, ви покращите вбудоване автодоповнення.

Notepad++ регулярно оновлюється, тому швидко виправляють баги і додають нові можливості. На жаль, працює він лише на Windows.

Vim

Редактор Vim давно став класикою. Багато хто говорить, що в ньому важко розібратися, але якщо приділити цьому достатньо часу, користуватися чимось іншим уже не захочеться.

Крім того, що він відповідає всім обраним нами критеріям, Vim ще й повністю налаштований, тому ви можете:

• встановлювати плагіни;
• міняти теми;
• призначати гарячі клавіші і таке інше.

Vim повністю безкоштовний та працює на всіх платформах, починаючи з Windows, MacOS та Linux і закінчуючи MS DOS та OS/2.

Microsoft Visual Studio

Microsoft Visual Studio - це IDE, де є все необхідне роботи з JS. Крім звичайного підсвічування синтаксису та автодоповнення, можна також користуватися дебагером та створювати Unit-тести.

Однак програма важить досить багато і систему завантажує сильно, тому не дуже підійде для роботи на слабких комп'ютерах.

Місячна передплата може коштувати від 45 до 250 доларів на місяць, але є і безкоштовна версіядля розробників-початківців і тих, хто створює програми з відкритим вихідним кодом. IDE доступна для Windows і MacOS, а на Linux можна встановити за допомогою Wine.

Visual Studio Code

Visual Studio Code – це полегшена (~170 МБ проти 30 ГБ), кросплатформова та безкоштовна версія Visual Studio. У цьому редакторі встановлено підтримку JavaScript, TypeScript і Node.JS.

Розширення з іншими мовами можна завантажити безпосередньо з Visual Studio Code.

Вбудовані дебагер та Git-команди для роботи з системою керування версій GitHub дозволяють прискорити тестування та публікацію додатків.

Sublime Text

Sublime Text – це простий кросплатформовий редактор. Його інтерфейс налаштовується, а виконувати деякі дії можна за допомогою гарячих кнопок.

Також у ньому є підтримка сніпетів, автодоповнення, підсвічування синтаксису та навігація. Крутий бонус – автозбереження. Втім, він більше потрібен новачкам – адже професійні програмісти за роки роботи виробляють звичку зберігатись після введення кожної команди.

Головний мінус Sublime Text у тому, що повна версія коштує 80 доларів (ліцензія видається на одного користувача, який може використовувати редактор на будь-якому комп'ютері). В іншому він добре підходить
JS-розробникам.