Невозможно выбрать текст из PDF

Я делаю простое приложение для создания PDF-файлов.

Используемые библиотеки:

- ›jspdf

- ›html2canvas

index.js

JSX:

<div className="App">
  <button onClick={exportToPdf}>Export</button>
  <div id="toRender">
   ------ Pdf print content ------
  <div>
</div>

Функция экспорта PDF:

  const exportToPdf = () => {
    let elem = document.getElementById("toRender");
    elem.scrollIntoView();
    h2c(elem).then((canvas) => {

    ---- Logic for exporting pdf ---

    })
  }

Полный код см. В приведенном ниже рабочем фрагменте.

Редактировать сгенерировать PDF с помощью jspdf (разветвленный)

Проблема:

Проблема в том, что если мы нажмем кнопку экспорта, PDF-файл будет загружен, но мы не сможем выбрать текст из PDF-файла.

Я могу понять причину того, что это происходит из-за того, что мы используем addImage () в этой строке,

  pdf.addImage(img, "PNG", 0);

Но при поиске связанных проблем здесь https://github.com/MrRio/jsPDF/issues, Ничего полезного не нашел ..

Требование:

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

Я могу реализовать любую другую библиотеку для создания генерации HTML в PDF с выбираемым текстом.

Любезно, кто-нибудь, пожалуйста, помогите мне сгенерировать PDF-файл с выбираемым текстом вместо изображения для приведенного выше примера. Заранее спасибо.


reactjs javascript pdf jspdf pdf-generation
person Maniraj Murugan    schedule 05.04.2021    source источник
comment
const [state, setState] = useState({ doc : new jsPDF( ) }) затем добавьте такой текст doc.text("test", x, y, "left")   -  person Zahir Masoodi    schedule 05.04.2021
comment
@ZahirMasoodi, как это добавит html контент? Разве doc.text() не добавить простой текст? Мне нужно добавить html-контент ..   -  person Maniraj Murugan    schedule 05.04.2021
comment
Нужно ли напрямую отображать html-контент?   -  person Zahir Masoodi    schedule 05.04.2021
comment
@ZahirMasoodi, Да .. Требование состоит в том, что мне нужно получить то же самое, что я получаю прямо сейчас из примера codeandbox .. Но ожидалось, что мне нужно иметь выбираемый текст вместо изображения .. Также я мог видеть, что fromHTML() может быть полезным, но похоже, что сейчас он устарел.   -  person Maniraj Murugan    schedule 05.04.2021
comment
Попробуйте экспортировать файл, как этот const myPdf = new File([pdf.output("blob")], "export.pdf", { type: "application/pdf",});, а затем проверьте файл.   -  person Zahir Masoodi    schedule 05.04.2021
comment
@ZahirMasoodi, я внедрил ваш код здесь codesandbox.io/s/generate -pdf-with-jspdf-forked-gckn8 вместо pdf.save(), но это не работает .. Где мне нужно реализовать этот код? не могли бы вы создать вилку для моего кода и предоставить решение?   -  person Maniraj Murugan    schedule 05.04.2021
comment
Я внес несколько изменений, можете проверить!   -  person Zahir Masoodi    schedule 05.04.2021
comment
@ZahirMasoodi, где были внесены изменения? Пожалуйста, предоставьте мне ссылку на песочницу, которую вы изменили с помощью кнопки вилки в правом верхнем углу.   -  person Maniraj Murugan    schedule 05.04.2021
comment
codeandbox.io/s/generate -pdf-with-jspdf-forked-oq4e5? file = / src /   -  person Zahir Masoodi    schedule 05.04.2021
comment
@ZahirMasoodi, но здесь pdf не скачивается, как ссылка в моем вопросе codesandbox.io/s/generate-pdf-with-jspdf-forked-znjxg   -  person Maniraj Murugan    schedule 05.04.2021
comment
@ZahirMasoodi, при нажатии на кнопку экспорта pdf должен быть загружен, как в вопросе ..   -  person Maniraj Murugan    schedule 05.04.2021
comment
После нажатия кнопки экспорта под кнопкой экспорта появится ссылка, нажмите на нее и проверьте, можно ли скопировать текст.   -  person Zahir Masoodi    schedule 05.04.2021
comment
@ZahirMasoodi, зачем текст копировать? Пользовательская работа заключается только в том, чтобы щелкнуть только кнопку экспорта и ничего более .. Если он нажмет кнопку экспорта, то необходимо загрузить pdf ..   -  person Maniraj Murugan    schedule 05.04.2021