Генерація PDF зі сторінки і надсилання на еmail
14 Травня 2019
наступна статтяДокументи в форматі PDF підтримуються величезною кількістю пристроїв: від комп'ютерів до мобільних телефонів або електронних книг. «PDF-ки» набагато менше «важать», ніж, скажімо, зображення в популярному форматі JPEG. Тому їх використання в розвитку вашого бізнесу цілком виправдано і ефективно.
Це правдива історія однієї розробки в компанії Авіві за бажанням замовника, який думав саме так.
Зручні розрахунки
На одній зі сторінок комерційного сайту нашого клієнта розміщується калькулятор прибутковості інвестування. Тут користувачі можуть розрахувати свій майбутній дохід в залежності від вкладеної суми і періоду інвестування. Щоб позбавити відвідувачів додаткових турбот з копіюванням результатів або створення скріншотів, замовник вирішив розширити функціонал свого сайту і дати користувачам можливість надсилати свої розрахунки на вказаний email у вигляді прикріпленого PDF-файлу.
Після детального вивчення ТЗ і оцінки завдання, було прийнято рішення генерувати файл «на льоту» за допомогою JavaScript, і надсилати на сервер, де він буде надісланий поштою стандартними методами CMS Бітрікс.
Створення PDF-генератора
Для генерації вибір припав на js бібліотеку html2pdf. А вірніше її гілку, в якій реалізована callback-функція, де можна обробляти результати генерації. Також в цій гілці реалізований функціонал, за допомогою якого можна отримати файл у вигляді blob-об'єкта
Ось приклад коду який генерує PDF і відправляє його на сервер:
html2pdf().from("calculator").set({ filename: 'actual.pdf', margin: [0.2,0,0.2,0], pagebreak: { mode: 'avoid-all', before: '#required_info' }, html2canvas: { scale: 1 }, jsPDF: {orientation: 'landscape', unit: 'in', format: 'A4', compressPDF: false} }).toPdf().get('pdf').then(function (pdf) { var blob = pdf.output('blob'); // отримуємо наш файл у вигляді blob об'єкта var formData = new FormData(); formData.append('pdf', blob); formData.append('email', $('.popup-send-mail__input[name="email"]').val()); // вказуємо email $.ajax({ url: '/ajax/mail.php', method: 'POST', data: formData, processData: false, contentType: false, success: function(response){ popupMailText.text('Повідомлення надіслано'); }, error: function(err){ popupMailText.text('Помилка надсилання'); } }); });
Хочу зазначити, що даний метод створення PDF-файлів підходить не тільки для CMS Бітрікс, але і для будь-якої іншої платформи управління сайтом.
Надсилаємо електронного листа
На сервер приходить файл, доступ до якого можна отримати з масиву $ _FILES і email з масиву $ _REQUEST.
Отриманий файл переносимо з тимчасового сховища в теку / upload /. Потім отримуємо ID файлу, реєструючи його в CMS Бітрікс. У методі CEvent::Send в параметрах вказуємо шаблон листа, адреса і ID файлу. Після надсилання видаляємо тимчасові файли.
Код надсилання листа:
$pdf = $_FILES['pdf']['tmp_name']; if(isset($pdf)) { $location = $_SERVER['DOCUMENT_ROOT'].'/upload/calculation/temp_file.pdf'; move_uploaded_file($pdf, $location);//тимчасовий файл if (CModule::IncludeModule("iblock")) { $path=($_SERVER['DOCUMENT_ROOT'].'/testia/calculator/random-name.pdf'); $iFileId = \CFile::SaveFile(\CFile::MakeFileArray($location), "calculation"); // реєструємо файл в Бітріксі і отримуємо його ID $eventID=\CEvent::Send( 'CALCULATE_PDF', SITE_ID, ['EMAIL_TO' => $_REQUEST['email']], 'Y', '', [$iFileId] ); if ($iFileId) { unlink($location); \CFile::Delete($iFileId); } } }
Post Scriptum
Описані вище методи працюють відмінно. У цьому завданні ми також реалізували функціонал збереження зазначених адрес електронних пошт користувачів, але про це можемо поговорити в індивідуальному порядку.
Від себе особисто хотілося б додати, що для вирішення цього завдання найбільше часу зайняв пошук способу передачі згенерованого в js файлу на сервер. На просторах Інтернету виявилося катастрофічно мало інформації по цій темі. Тому я сподіваюся, що мій особистий досвід стане в пригоді багатьом Бітрікс-розробникам.
Ми зв'яжемось з Вами протягом 10 хвилин