Я создаю расширение Chrome для Документов Google и пытаюсь получить выделенный текст из текущего редактируемого документа:
Однако, когда я пытаюсь запустить этот код, он возвращает пустую строку ' ':
const docsFrame = document.getElementsByClassName('docs-texteventtarget-iframe')[0]
docsFrame.contentDocument.getSelection().toString()
Была библиотека под названием Google Docs Utils, которая раньше могла это делать, но с тех пор, как Docs перешли на рендеринг на основе Canvas, библиотека больше не работает.
Обновлено:
Вот пример Google Docs для проверки
РЕДАКТИРОВАТЬ № 2:
Сделал некоторый прогресс, нашел эту тему с множеством потенциальных решений: https://github.com/Amaimersion/google-docs-utils/issues/10
@oleedd docs.google.com/document/d/…
О, кажется, только в <canvas>
. Это не текст, а графика. getSelection()
работает только для текстовых узлов (что вы можете найти с помощью ctrl+f
в консоли). Изучите методы холста.
А, это имело бы смысл. Позвольте мне исследовать и попробовать некоторые методы холста, чтобы увидеть, возможно ли это...
Самый простой способ сделать это — использовать скрипт надстройки Google.
Вы попадете в интерфейс Google App Scripts, который дает вам доступ к API-интерфейсам холста Google Doc, позволяя вам делать именно то, что вы в настоящее время изо всех сил пытаетесь сделать.
Ваша задача, вероятно, будет заключаться в том, чтобы примириться с тем фактом, что магазин/рынок расширений Google – это не то же самое, что рынок дополнений/рабочей области Google.
Лично я думаю, что вы должны просто пойти ва-банк и написать надстройку для Google. Делает жизнь намного проще, чем написание расширения для Chrome.
Спасибо, посмотрю. Я создаю проект, который должен работать на нескольких сайтах, а не только в Документах Google, но, поскольку Документы являются основной платформой, я хотел бы, чтобы мое расширение работало и здесь. Grammarly и Wordtune каким-то образом это делают, поэтому должен быть способ
Это справедливое замечание. Я давно не писал расширения для Google, поэтому мне нужно будет посмотреть, какая литература преобладает для использования API-интерфейсов холста документов Google внутри расширения.
Да, я пытаюсь найти способы соединить их, а также ищу способ сделать это без надстройки (и добился определенного прогресса).
Я понял, как это сделать, с помощью упомянутого выше потока и изучения открытого исходного кода. Я не уверен, что мне разрешено публиковать здесь открытый исходный код, и, чтобы избежать конфликтов с лицензиями, я опубликую здесь общие шаги, которые я нашел:
Включить функцию чтения с экрана / чтение SVG. Google добавит элементы svg и rect в ".kix-canvas-tile-selection"
, которые содержат введенный текст. Посмотрите вторую половину этой темы, чтобы найти различные решения для включения этого.
Используйте $(".kix-page-paginated").get()
, чтобы получить текущую страницу в Документах Google. Затем используйте вычисления $(window).height(), чтобы выяснить, на какой странице в данный момент находится пользователь.
После выполнения двух вышеперечисленных действий вы можете использовать функцию, подобную приведенной ниже, чтобы получить строку текста.
function getSelectedLineOfText(page) {
const overlaps = (a, b) => a.left < b.right && a.right > b.left && a.top < b.bottom && a.bottom > b.top
const selectionRects = $(".kix-canvas-tile-selection > svg > rect", page).get()
.map(el => el.getBoundingClientRect())
// Using text elements on that page and the selection rects, find the actual selected line of text.
const textElements $("svg > g[role=paragraph] > rect", page).get();
Примечание: как видно из имени функции, это может получить только всю выделенную строку в файле. Он не может выделить конкретный текст в строке.
Итак, здесь: «Меня зовут Боб. Привет, меня зовут Боб. Привет, меня зовут Боб». будет возвращен. Я изо всех сил пытался получить более конкретную информацию, поэтому, если у кого-то есть подсказка, не стесняйтесь добавлять/создавать еще один ответ.
Дайте ссылку с документом и текстом для выбора и получения.