Отрисовать встроенную PDF-форму и отправить на сервер .NET

Содержание

Вопрос или проблема
Ответ или решение
Работа с PDF-формами в браузере и отправка на .NET сервер
Этапы реализации:
Заключение

Вопрос или проблема

У меня есть желаемая функция для проекта, над которым я работаю, и мне трудно найти инструмент для её реализации. Вот цель:

Отобразить PDF-форму в браузере и позволить пользователю её заполнить.
Предварительно заполнить определенные поля формы данными.
Позволить пользователю отправить PDF на веб-сервер .NET, извлекая значения в различных полях формы PDF.
Сохранить копию PDF, которую заполнил пользователь.

В идеале этот инструмент должен быть бесплатным. Предварительное заполнение данных я бы сказал, что является хорошей дополнительной функцией.

Есть какие-нибудь рекомендации? Возможно, это потребует использования более чем одного инструмента/библиотеки. Заранее благодарю.

Adobe FDF Toolkit устарел, но все еще работает и бесплатен. В документации по ссылке ниже предложены рабочие процессы, которые покажут вам, как предварительно заполнить PDF, отправить его так, как если бы это была HTML-форма, так что вы можете использовать любую технологию для его разбора. Вы также можете отправить весь сохраненный PDF как большой объем данных, который можно сохранить.

http://www.adobe.com/devnet/acrobat/fdftoolkit.html

Ответ или решение

Работа с PDF-формами в браузере и отправка на .NET сервер

Вопрос о том, как отобразить PDF-форму в браузере, позволяя пользователям заполнять её и отправлять данные на .NET сервер, действительно требует всестороннего подхода. Подход, который наилучшим образом соответствует вашим требованиям, должен включать инструменты для обработки PDF-документов и серверную часть для обработки их отправки. Ниже представлен подробный и обоснованный совет по реализации данной функции.

Этапы реализации:

Отображение PDF-формы в браузере:
Для отображения PDF-документа в браузере вы можете использовать библиотеки JavaScript, такие как PDF.js. Эта библиотека позволяет рендерить PDF-документы на веб-странице и обеспечивает хороший пользовательский интерфейс. Установка библиотеки проста, что позволяет вам быстро приступить к интеграции.

Пример кода для отображения PDF-документа:

<canvas id="pdf-canvas"></canvas>
<script src="https://mozilla.github.io/pdf.js/build/pdf.js"></script>
<script>
 const url = 'path_to_your_pdf_form.pdf'; // Замените на путь к вашей PDF-файлу

 pdfjsLib.getDocument(url).promise.then((pdf) => {
   pdf.getPage(1).then((page) => {
     const scale = 1.5;
     const viewport = page.getViewport({ scale });

     const canvas = document.getElementById('pdf-canvas');
     const context = canvas.getContext('2d');
     canvas.height = viewport.height;
     canvas.width = viewport.width;

     const renderContext = {
       canvasContext: context,
       viewport: viewport,
     };

     page.render(renderContext);
   });
 });
</script>

Предзаполнение полей формы:
Если вам нужно предзаполнить поля формы данными, вы можете использовать Adobe FDF Toolkit или библиотеки для манипуляции с PDF, такие как PDF-lib или pdf-lib. Эти инструменты позволят редактировать поля формы перед их отправкой.

Пример кода для предзаполнения полей:
```
const { PDFDocument } = require('pdf-lib');

const formData = {
 fieldName1: 'Value1',
 fieldName2: 'Value2',
};

const pdfDoc = await PDFDocument.load(await fetch(url).then(res => res.arrayBuffer()));
const form = pdfDoc.getForm();

for (const [field, value] of Object.entries(formData)) {
 const pdfField = form.getTextField(field);
 pdfField.setText(value);
}

const pdfBytes = await pdfDoc.save();
```
Отправка формы на сервер:
После того как пользователь заполнил PDF-форму, вы можете отправить её на ваш .NET сервер. Для этого обычно используется XMLHttpRequest или fetch в JavaScript. PDF может быть отправлен как FormData или просто как бинарные данные.

Пример отправки PDF:
```
fetch('https://your-dotnet-server/api/upload', {
 method: 'POST',
 body: formData // Можно использовать FormData(), если есть поле файла
}).then(response => response.json())
.then(data => console.log(data));
```

Обработка на .NET сервере:
Ваш .NET сервер должен иметь API-метод для получения загруженного PDF. Используйте IFormFile для обработки загруженных файлов и сохраняйте их на сервере.

Пример кода для ASP.NET Core:

[HttpPost("upload")]
public async Task<IActionResult> Upload([FromForm] IFormFile file)
{
   if (file.Length > 0)
   {
       var filePath = Path.Combine("Uploads", file.FileName);
       using (var stream = new FileStream(filePath, FileMode.Create))
       {
           await file.CopyToAsync(stream);
       }
       return Ok(new { status = "File uploaded successfully" });
   }
   return BadRequest("File is empty");
}

Сохранение копии заполненного PDF:
После успешной обработки PDF на сервере убедитесь, что вы сохраняете его в нужном месте на сервере для дальнейшей обработки или загрузки.

Заключение

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