Генерація 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 хвилин