Partage
  • Partager sur Facebook
  • Partager sur Twitter

DOMPDF - Aucun CSS dans le pdf Symfony 5

Sujet résolu
    16 mai 2022 à 11:10:29

    Bonjour,


    Je suis en train d'essayer de générer une page twig, en pdf avec la librairies dompdf sous symfony 5.


    Voici mon service pour générer le pdf.


    <?php
    
    namespace App\Service;
    
    use Dompdf\Dompdf;
    use Dompdf\Options;
    // use Symfony\Component\DependencyInjection\ParameterBag\ParameterBagInterface;
    
    class PdfService
    {
        // private $params;
        private $domPdf;
    
        public function  __construct(/*ParameterBagInterface $params*/)
        {
            // $this->params = $params;
    
            // $cssFile = $this->params->get('css_file');
    
            $this->domPdf = new DomPdf();
    
            $pdfOptions = new Options();
    
            $pdfOptions->set('defaultFont', 'Garamond');
    
            $this->domPdf->setOptions($pdfOptions);
            
            // $this->domPdf->setBasePath(realpath($cssFile));
        }
    
        public function showPdfFile($html)
        {
            
            $this->domPdf->loadHtml($html);
            $this->domPdf->render();
            $this->domPdf->stream("Listing", [
                'Attachement' => false
            ]);
        }
    
        public function generateBinaryPDF($html)
        {
            $this->domPdf->loadHtml($html);
            $this->domPdf->render();
            $this->domPdf->output();
        }
    }

    Et ici il y a le controller, donc lorsque je vais sur cette route le pdf est téléchargé .

    /**
    * @Route("/admin/products/generate/", name="admin_products_generate")
    */
        public function generatePdf(PdfService $pdf)
        {
            $html = $this->render('/pdf/listing_product.html.twig');
            $pdf->showPdfFile($html);
        }

    Or, lorsque que je télécharge le pdf, il n'y a aucun css ni aucune image qui n'est appliquée.

    Voilà la template twig .

    {% extends 'base.html.twig' %}
    
    {% block title %}À propos
    {% endblock %}
    {% block stylesheets %}
    	<link rel="stylesheet" href="{{ asset('css/about.css') }}">
    {% endblock %}
    
    {% block body %}
    	<section class="qui_sommes_nous">
    		<div class="img"><img src="{{asset('/images/castrading.jpg')}}"></div>
    		<div class="text_about">
    			<h3>Qui sommes nous ?</h3>
    			<p>C’est en début 2019 que CAS TRADING voit le jour avec la profonde envie d’apporter un vent de fraîcheur et de nouveautés dans le monde du « Bazar et de l’Article de Maison ».Pour cela nous mettons tout en place pour apporter à nos clients la marchandise et les prix qu’ils ne trouveront nulle part ailleurs.Les frontières ne nous font pas peur et nous allons chercher votre bonheur en Europe, au Maghreb, en Turquie ou même au fin fond de l’Asie.				Riche de 10 années d’expérience dans la vente au détail. Nous sommes donc les mieux placés pour connaître vos attentes en temps que revendeurs.</p>
    		</div>
    	</section>
    
        <section class="partenaires">
            <h3>Nos partenaires</h3>
            <div class="grid_partenaires">
            <div class="top_line">
            <img src="{{asset('images/ariane.png')}}" alt="ariane">
            <img src="{{asset('images/ultra-joy.png')}}" alt="ultra-joy">
            <img src="{{asset('images/ponimo.png')}}" alt="ponimo">
            <img src="{{asset('images/Hugva.png')}}" alt="Hugva">
            </div>
    
            <div class="bot_line">
                <img src="{{asset('images/home-life.png')}}" alt="home-life">
                <img src="{{asset('images/riviol.png')}}" alt="riviol">
                <img src="{{asset('images/ferdi-plast.png')}}" alt="ferdi-plast">
                <img src="{{asset('images/tex.png')}}" alt="tex">
            </div>
    
            </div>
        </section>
    {% endblock %}
    

    Je tiens a précisé que lorsque cette page est affichée, le css et les images fonctionnes, mais lorsque le pdf est générer non.

    Je vous remercie de votre aide.




    • Partager sur Facebook
    • Partager sur Twitter
      16 mai 2022 à 12:36:26

      Salut,

      Utilise absolute_url(asset('.....')) 

      https://symfony.com/doc/current/reference/twig_reference.html#absolute-url 

      • Partager sur Facebook
      • Partager sur Twitter
      le bienfait n'est jamais perdu
        16 mai 2022 à 14:44:19

        Hello, 

        J'avais eu le même soucis pour des appli Laravel qui utilise le même package que toi (adapté pour Laravel) car mon entreprise limite vachement les droits pour les échanges inter & intra applicatif.

        Tu peux essayer de mettre le chemin absolue de tes asset comme @WillyKouassi l'a préconisé.

        Si ça ne fonctionne pas, tu peux essayer de passer l'option de DomPDF isRemoteEnable a true : en gros, ça va autoriser ta librairie à injecter des ressources "externes" (image, css).

        Et si comme moi ça ne fonctionne toujours pas, tu peux encoder tes images en base 64 et les injecter dans ton pdf et mettre tout ton css dans une balise style ou directement en inline sur tes éléments html : c'est crado mais ça marche.

        • Partager sur Facebook
        • Partager sur Twitter
          16 mai 2022 à 15:33:19

          Salut,

          Merci pour votre aide, malheureusement, le chemin absolu n'a pas marché ainsi que l'option isRemoteEnable également.

          Du coup, je me suis tourné sur la façon brouillonne qui est de tout mettre dans une balise style, au moins ça marche.

          Par contre, je n'ai pas compris comment injecter les images en base 64 dans le pdf.

          • Partager sur Facebook
          • Partager sur Twitter
            16 mai 2022 à 17:29:31

            Tu encodes ton image en base 64 sur un site en ligne, le premier qui m'est venu : https://www.base64-image.de/

            Puis dans ta vue, tu passes le résultat dans ton attribut src de ton image. 

            Un truc dans le genre : 

            <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAk8AAAC4CAYAAAD6zwjmAAAACXBIWXMAAC4iAAAuIgGq4t2SAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAKcSSURBVHja7F15fFbF2T3PzNx3yUbYd2QPgRA2MYKICCKIiFiguFfrWqu2Vmtt3aq1ftXWulvbWrWKe1FERRFRRBSQPSwh7Pu+hGzvcu/MfH/MvW8S1kAChHDP7xclC+HeuXNnzpznec5DvR/7SO8rKgIXIRBnYFpBaw2mASKCIgAAmDb/r2mfS5g/aDBorcGZ+Z4lGCzGEQwIBC2B5GAISaEgkkNBpCaFUS81GfXSklG/Xh2c0VigWSoQAngDQMGHDx8+fPjw4eMQENFoFLGYDZIuKQEBpEAa0FoDzLAVcsmKdslLTfqciCAdnbgpxgEeARgRpLTBQWCkQVqBpAKDB"/>
            
            

            C'est immonde, mais j'ai pas trouvé mieux...

            • Partager sur Facebook
            • Partager sur Twitter

            DOMPDF - Aucun CSS dans le pdf Symfony 5

            × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
            × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
            • Editeur
            • Markdown