欢迎访问广东谍赞智能科技有限公司业务官网,咨询热线:13923452579
网站地图 工具中心
登录
当前位置:首页>技能晋升>行业动态

pbootcms如何指定前端新闻增加以用户昵称和用户名命名的背景水印

  • 发布时间:2023-08-25 付涛
  • 【简述:】这几天在VIP会员资料的时候发现如果没有一个防伪机制在这里的时候,则会出现部分会员资料外卸的情况;为了相对增加会员用户资源外发后的难以追查;特修改了当前PBOOTCMS版本,实现不同用户登陆的时候,VIP资源正式主体以当前登陆用户的用户昵称和用户名为前提下的背景水印;成功后效果如下:实施目的:第一步、通过后台用户
  • 二维码
    手机扫码分享好友

    这几天在VIP会员资料的时候发现如果没有一个防伪机制在这里的时候,则会出现部分会员资料外卸的情况;为了相对增加会员用户资源外发后的难以追查;特修改了当前PBOOTCMS版本,实现不同用户登陆的时候,VIP资源正式主体以当前登陆用户的用户昵称和用户名为前提下的背景水印;成功后效果如下:

    微信截图_20230825150644.png

    实施目的:

    第一步、通过后台用户管理中心的用户昵称和登录账号,生成以【用户昵称登录账号.png】格式的服务器图片;

    第二步、将生成的图片保存至指定目录下;

    第三步、将生成的图片作为指定新闻页面正式内容的背景水印;

    实施过程:

    第一步、修改member.html文件模板;

    通过以下这个路径:

    PbootCMS-3.Xppsdminiewdefaultmembermember.html

    找到member.html,并用本地或者在线工具打开,然后找到约186行左右,涉及以下代码:

    	<div class="layui-form-item">
    		<div class="layui-input-block">
    			<button class="layui-btn" lay-submit>立即提交</button>
    			<button type="reset" class="layui-btn layui-btn-primary">重置</button>
    		 </div>
    	</div>
    	 </form>
    </div>

    然后在其下方添加如下代码:

    	  	<div class="layui-tab-item">
    		    	<input type="hidden" name="formcheck" value="{$formcheck}" > 
    		  		<table class="layui-table">
    		  			<thead>
    	                    <tr>
    	                    	<th>编号</th>
    	                        <th>用户名</th>
    	                        <th>昵称</th>
    	                        <th>注册时间</th>
    	                        <th>操作</th>
    	                    </tr>
    	                </thead>
    	                <tbody>
    	                    {foreach $members(key,value)}
    	                    <tr>
    	                    	<td>[value->ucode]</td>
    	                        <td>[value->username]</td>
    	                        <td>[value->nickname]</td>
    	                        <td>[value->register_time]</td>
    	                        <td>
    <!--增加将用户名和昵称生成图片开始-->
    <form method="post" action="/huiyuan-generate_image.php">
        <input type="hidden" name="username" value="[value->username]">
        <input type="hidden" name="nickname" value="[value->nickname]">
        <button type="submit" class="layui-btn" name="submit">生成图片</button>
    </form>
    <script>
        function generateImage() {
            var text = "据需求设置正确的保存路径"; // 指定的文字内容
            var textColor = "#f3f1f1"; // 文字颜色
    
            // 创建画布
            var canvas = document.createElement('canvas');
            canvas.width = 200;
            canvas.height = 60;
            var ctx = canvas.getContext('2d');
    
            // 绘制透明背景
            ctx.clearRect(0, 0, canvas.width, canvas.height);
    
            // 设置文字样式
            ctx.font = '8px sans-serif';
            ctx.textAlign = 'center';
            ctx.textBaseline = 'middle';
    
            // 绘制文字
            ctx.fillStyle = textColor;
            ctx.fillText(text, canvas.width / 2, canvas.height / 2);
    
            // 将画布转换成图片
            var img = new Image();
            img.src = canvas.toDataURL();
    
            // 显示图片
            var imageContainer = document.getElementById('imageContainer');
            imageContainer.innerHTML = '';
            imageContainer.appendChild(img);
            imageContainer.style.display = 'block';
        }
    </script>
    
    <!--增加将用户名和昵称生成图片结束-->
    	                        </td>
    	                    </tr>
    	                    {/foreach}
    	                </tbody>
    		  		</table>
    	    </div>

    保存以上代码;注意其中的form表单提交地址,要和huiyuan-generate_image.php实际存在地址一致;

    第二步、创建huiyuan-generate_image.php文件

    <?php
    if (isset($_POST@['submit'])) {
        $username = $_POST@['username'];
        $nickname = $_POST@['nickname'];
        $text = $username . $nickname;
        
        // 创建画布
        $width = 200;
        $height = 60;
        $image = imagecreatetruecolor($width, $height);
        
        // 设置透明背景
        imagesavealpha($image, true);
        $bgColor = imagecolorallocatealpha($image, 0, 0, 0, 127);
        imagefill($image, 0, 0, $bgColor);
        
        // 设置文字颜色
        $textColor = imagecolorallocate($image, 243, 241, 241); // #f3f1f1
        
        // 绘制文字
        $font = $_SERVER['DOCUMENT_ROOT'] . '/images/arial.ttf'; // 字体文件路径,根据需求设置正确的字体文件路径
        $fontSize = 8;
        $textbox = imagettfbbox($fontSize, 0, $font, $text); // 获取文本框大小
        $textWidth = $textbox[2] - $textbox[0];
        $textHeight = $textbox[7] - $textbox[1];
        $x = ($width - $textWidth) / 2;
        $y = ($height - $textHeight) / 2 + $textHeight;
        
        // 绘制文字
        imagettftext($image, $fontSize, 0, $x, $y, $textColor, $font, $text);
        
        // 生成图片并保存
        $imageName = $_POST@['username'] . $_POST@['nickname'] . '.png'; // 图片名称
        $imagePath = $_SERVER['DOCUMENT_ROOT'] . '/images/touxiang/' . $imageName; // 图片保存路径
        imagepng($image, $imagePath);
        
        // 显示生成成功的提示
        echo '<script>window.parent.postMessage("图片生成成功!", "*");</script>';
    
        // 释放资源
        imagedestroy($image);
    }
    ?>
    <script>
    function goBack() {
        history.go(-1); // 返回上一页
    }
    
    // 监听图片生成成功的提示
    window.addEventListener('message', function(event) {
        if (event.data === '图片生成成功!') {
            setTimeout(goBack, 1000); // 2秒后返回上一页
        }
    });
    </script>

    注意事项:

    1、'/images/arial.ttf'; // 字体文件路径,根据需求设置正确的字体文件路径,自行随便弄一个字体TTF文件放在根目录IMAGES里面;

    2、'/images/touxiang/'      // 图片保存路径,请根据自己实际需求弄到目标文件夹;

    第三步、在新闻或产品模板页面添加背景代码:

    <div style="width:100%;height:100%;background-image: url(/images/touxiang/huazhongxu秋韵一知秋.png);">……</div>

    在需要的目标位置添加这一段代码就可以了,其中"……"部分内容为自由定义。

    其中的【huazhongxu秋韵一知秋】可以改为pbootcms的其它参数,比如:

    {user:username}{user:nickname}

    思路如此,具体怎么用,有需要的各显神通;

    RPA应用推荐浏览

    内容链接:https://www.diebaoyun.com/industry/358.html
    内容标题:pbootcms如何指定前端新闻增加以用户昵称和用户名命名的背景水印
    内容版权:当前文章由【付涛】本人原创开发与文案内容写作,内容版权归当前平台所有,如需转载,请务必注明来源,谢谢合作!
    本文最后更新发布于【2023-08-25】,某些文章具有时效性,若有错误或已失效,请在联系客服
    争议处理:针对本站内容若有异义,亦可直接与【法律顾问:易兴俊,律师联系电话:13825799821】直接联系沟通;
  • 当前文章TAGS标签:
  • 上一篇:PBOOTCMS如何增加如本站一样的订单结算并自动扣除相应积分下一篇:如何在PBOOTCMS后台添加自定义栏目菜单?