PHP制作分享图片

落日映苍穹つ 2021-09-28 05:16 344阅读 0赞

# [处理图片的类：上传、缩略图、二维码追加logo、检查是否合法等][logo] #

### 需求图片样式如下（不同的分享出现的数据不同） ###

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDM1NDY4Mw_size_16_color_FFFFFF_t_70][]

### 1、思路： ###

需要一个html模板来承载这些样式和数据

需要控制器来查询出这些数据，然后调用模板，并获取其中的流（这个流的数据相当于访问他的数据），然后把这个流生成PDF，然后转换成PNG

二维码也是流的展示方法，然后里面的LOGO是追加上去的

### 2、代码展示 ###

首先使用composer安装PDF在自己项目中：composer require mpdf/mpdf

## [MAC安装composer方法][MAC_composer] ##

## [window安装composer方法][window_composer] ##

主要代码：

<?php
        /**
         * 制作装修图片
         * @param $data  数据
         * @param $name  图片名称
         * @throws \Mpdf\MpdfException
         */
        function make_activity_image($data,$name){
    
            if ($data && $name){
                $share_data = base64_encode(json_encode($data));
                $url = SITE_URL."/mobile/index.php?app=renovation&act=make_share_image&share_data={$share_data}";
                $content = file_get_contents($url);
                $pdf_path = ROOT_PATH . '/data/files/activity_share/pdf/';
                $pdf_name = $this->html2pdf($content,$pdf_path,$name);
                $pdf_file = ROOT_PATH."/data/files/activity_share/pdf/{$name}.pdf";
                $png_file = ROOT_PATH."/data/files/activity_share/png/{$name}.png";
                $share_sh = "gs -dQUIET -dNOSAFER -r300 -dBATCH -sDEVICE=pngalpha -dNOPAUSE -dNOPROMPT -sOutputFile=$png_file $pdf_file";
                exec($share_sh);
                /*删除PDF文件*/
                @unlink($pdf_file);
            }
    
            return;
        }
    
        /**
         * 生产PDF
         * @param $html
         * @param $PATH
         * @param $name
         * @return string
         * @throws \Mpdf\MpdfException
         */
        function html2pdf($html, $PATH,$name){
            $mpdf = new \Mpdf\Mpdf(['tempDir' => ROOT_PATH . '/temp']);
            $mpdf->SetDisplayMode('fullpage');
            $mpdf->autoScriptToLang = true;
            $mpdf->autoLangToFont = true;
            $mpdf->WriteHTML($html);
            $pdf_name = $name.'.pdf';
            $mpdf->Output($PATH.$pdf_name);
    
            return $pdf_name;
        }

在以上代码中需要引入另外一个控制器的方法，获取页面排版的流 来生产PDF文件，根据情况来定这个方法：SITE\_URL."/mobile/index.php?app=renovation&act=make\_share\_image&share\_data=\{$share\_data\}";

在这个控制器中编写一下代码

<?php
        /**
         * 三级页面制作分享的HTML
         */
        function make_share_image(){
            $share_data = json_decode(base64_decode($_GET['share_data']),true);
            $logo_src =  SITE_URL. '/data/files/mall/settings/basicprofile.jpeg';
            if ($share_data['type'] =='share'){
                $url = SITE_URL . "/mobile/index.php?app=renovation&act=share_third&share_id={$share_data['id']}";
            }
            if ($share_data['type'] == 'featured'){
                $url = SITE_URL . "/mobile/index.php?app=renovation&act=featured_third&featured_id={$share_data['id']}";
            }
            $invitation_code = SITE_URL . '/index.php?app=qrcode&url='.urlencode($url);
            import('image.lib');
            $imageProcessor = new imageProcessor();
            $qrcode = $imageProcessor->src_logo($invitation_code,$logo_src);
            $qrcode = "data:image/png;base64,".base64_encode($qrcode);
            $share_data['scan_code'] = $qrcode;
            $this->assign('share_data',$share_data);
    
            $this->display('activity_share.html');
        }

以上中二维码调用的src\_logo方法是一个在二维码追加logo的类：[PHP处理图片的类][logo]

引入一个activity\_shart.html模板，这是调整图片里面样式和添加数据的模板

<!doctype html>
    <html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <meta name="apple-mobile-web-app-capable" content="yes"/>
        <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
        <meta name="baidu-site-verification" content="nSvCYjTrwa"/>
        <meta name="description" content="本站是一家专注于学生领域的在线电子商务平台，在学生用品经营方面有独特优势，不仅所有产品均来自知名品牌，并且品类众多，可满足学生日常的各种学习需求。">
        <script src="/cdn/js/jsLoad.js"></script>
    </head>
    <body style="position: relative">
    
    <div style="font-family: 微软雅黑; font-size: 18px; position: relative;background: #ffffff;border-radius: 10px;">
        <div style="width: 580px;height: 322px;display: block;border: 0;margin: auto;">
            <img src="{$site_url}/{$share_data.image}" alt="" style="width: 580px;height: 322px;margin:20px auto;display: block;padding:20px 0 30px 0">
        </div>
        <p style="font-size: 28px;color:#333;text-align: center">{$share_data.title}</p>
        <div style="padding:50px 0 32px;box-sizing: border-box;margin:auto" >
            <p style="width: 130px;height: 130px;margin:auto;">
                <img style="display: block;width: 130px;height: 130px;" src="{$share_data.scan_code}" alt="">
            </p>
            <p style="font-size: 24px; color: #7b7b7b;text-align: center;padding-bottom:36px">长按识别二维码</p>
        </div>
    </div>
    </body>
    </html>

在合适的位置编写好后，执行make\_activity\_image方法，就会生成带有二维码的分享图片

[logo]: https://download.csdn.net/download/weixin_40354683/10963103
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MDM1NDY4Mw_size_16_color_FFFFFF_t_70]: /images/20210923/f06fc9c1dcf4401cb1cae7552fdedb8b.png
[MAC_composer]: https://blog.csdn.net/weixin_40354683/article/details/87457152
[window_composer]: https://blog.csdn.net/weixin_40354683/article/details/87193701