Problem: Zamanlama (Timing)
React, Vue və ya Angular kimi alətlərlə qurulmuş müasir veb səhifələr serverdən demək olar ki, boş bir HTML qabığı göndərir. Bütün məzmun JavaScript'in brauzerdə işləməsi ilə yaradılır. PDF aləti yalnız ilkin HTML kodu götürürsə, nəticədə boş bir sənəd əldə edirsiniz. Köhnə üsul olan wkhtmltopdf və ya sadə HTTP sorğuları bu səbəbdən işləmir – onlar JavaScript'i icra etmir.
Həll: Real Brauzer Mühərriki – Puppeteer
Doğru həll səhifəni real brauzer kimi açıb JavaScript'in tam yüklənməsini gözləməkdir. Google'un hazırladığı Puppeteer aləti headless Chromium brauzerini idarə edərək səhifəni tam render edir və sonra PDF-ə çevirir. Əsas yanaşma belədir: brauzeri işə salın, səhifəyə gedin və şəbəkə trafiki tam sakitləşənə qədər gözləyin, daha sonra PDF-i yaradın.
- waitUntil: 'networkidle0' parametri səhifədə heç bir şəbəkə əlaqəsi qalmayana qədər gözləməyi təmin edir. Bu, SPA-ların məlumatları tam yüklədiyi anı tutmaq üçün ən etibarlı üsuldur.
- printBackground: true parametri olmadan, Chrome'un PDF çap fonu rənglərini, gradientləri və fon şəkillərini silir. Nəticədə səhifə gözlənildiyindən fərqli görünür.
İncə Məqamlar və Əlavə Düzəlişlər
Sadəcə səhifəni açıb çap etmək hər zaman kifayət etmir. Bir neçə əlavə problemi həll etmək lazım gelir:
- Lazy loading (gecikməli yükləmə) ilə gələn şəkillər PDF-də olmayacaq. Çapdan əvvəl səhifəni aşağı diyirlətmək üçün JavaScript kodu işə salmaq lazımdır.
- Veb şriftlər çap anında yüklənməmiş ola bilər. document.fonts.ready vədini gözləmək bu problemi həll edir.
- Bəzi saytların çap üçün xüsusi CSS üslubu (@media print) olur. page.emulateMediaType('screen') ilə ekran üslublarını məcbur etmək olar.
- Səhifədəki sabit (sticky/fixed) elementlər PDF-in hər səhifəsində təkrarlana bilər. Çapdan əvvəl bu elementlərin vəziyyətini dəyişmək daha təmiz nəticə verir.
Öz İnfrastrukturunuz, yoxsa Xidmət?
Puppeteer güclü olsa da, onu öz serverinizdə işlətmək əməliyyat yükü gətirir. Headless Chromium təxminən 200 MB RAM tələb edir, konteynerlərdə düzgün kitabxanalar qurulmalı, yaddaş sızmaları idarə edilməlidir. Məqalə müəllifi, əgər PDF yaratmaq tətbiqinizin əsas funksiyası deyilsə, bu işi xarici xidmətə həvalə etməyi tövsiyə edir.
Xülasə, dinamik veb səhifələrdən düzgün PDF əldə etməyin sirri sadədir: JavaScript'in işləməsini gözləyin, real brauzer mühərrikindən istifadə edin, şriftlərin yüklənməsini təmin edin və gecikməli yüklənmiş məzmunu aktivləşdirmək üçün səhifəni diyirlətin. Bu addımları izləsəniz, "boş sənəd" problemi geridə qalacaq.
Mənbə: Dev.to (https://dev.to/petr_savenok/converting-a-javascript-rendered-web-page-to-pdf-4nd5)
