微信小程序官方并未提供分享到朋友圈的方法,所以目前基本整个行业都是使用生成图文海报发到朋友圈,然后识别太阳码进入到小程序。

通过谷歌或者百度有很多同学已经提供了一些解决方案,但是在我们使用后效果并不是很理想,主要体现在以下方面:

  1. 通过PHP写入的字体效果并不理想。
  2. 背景图片和微信头像合成后清晰度不够。
  3. 无法实现一些复杂的效果。
  4. 实现过程也较复杂。

最终我们找了一种认为非常合理的实现方式,就是基于 PhantomJS 实现,通过 PhantomJS 隐形浏览器截图的功能来生成海报。

PhantomJS是一个基于webkit的JavaScript API。它使用QtWebKit作为它核心浏览器的功能,使用webkit来编译解释执行JavaScript代码。任何你可以在基于webkit浏览器做的事情,它都能做到。它不仅是个隐形的浏览器,提供了诸如CSS选择器、支持Web标准、DOM操作、JSON、HTML5、Canvas、SVG等,同时也提供了处理文件I/O的操作,从而使你可以向操作系统读写文件等。PhantomJS的用处可谓非常广泛,诸如网络监测、网页截屏、无需浏览器的 Web 测试、页面访问自动化等。

有以下优点:

  1. 基于html可实现复杂的文字,图片,阴影效果。
  2. 清晰度和文件大小合理
  3. 使用简单、即插即用

包地址:laravel-miniprogram-poster 求 star : )

体验

扫码进入商品详情页分享生成图文体验

安装

  1. composer require ibrand/laravel-miniprogram-poster
  • 低于 Laravel5.5 版本,config/app.php 文件中 'providers' 添加iBrand\Poster\PhantoMmagickServiceProvider::class

  • 图片保存在 storage/app/public 下所以需要执行 php artisan storage:link

  • 如需自定义配置请执行 php artisan vendor:publish --provider="iBrand\Poster\PhantoMmagickServiceProvider" --tag="config"

配置项

  1. return [
  2. //图片存储位置
  3. 'disks' => [
  4. 'MiniProgramShare' => [
  5. 'driver' => 'local',
  6. 'root' => storage_path('app/public/share'),
  7. 'url' => env('APP_URL') . '/storage/share',
  8. 'visibility' => 'public',
  9. ],
  10. ],
  11. //图片宽度
  12. 'width' => '575px',
  13. //放大倍数
  14. 'zoomfactor' => 1.5,
  15. //0-100,100质量最高
  16. 'quality' => 100,
  17. //是否压缩图片
  18. 'compress' => true,
  19. ];

使用

  1. use iBrand\Miniprogram\Poster\MiniProgramShareImg;
  2. $url = 'https://www.ibrand.cc/';
  3. $result = MiniProgramShareImg::generateShareImage($url);

返回结果:

  1. [
  2. 'url' => 'http://xxx.png', 图片访问url
  3. 'path' => 'path/to/image', 图片文件路径
  4. ]

字体安装

如果需要实现复杂的字体效果,需要安装字体,比如在 centos 上就没有微软雅黑的字体,所以如果生成的图片有指定的特殊字体,需要在服务器上进行安装。

  • window 将下载的字体文件复制到C:Windows\Fonts目录下或者双击字体文件进行安装
  • mac 下载的字体文件 双击字体文件进行安装
  • centos
  1. # 安装微软雅黑
  2. wget -P /tmp/ https://iyoyo.oss-cn-hangzhou.aliyuncs.com/mirror/fonts/msyh.ttf
  3. wget -P /tmp/ https://iyoyo.oss-cn-hangzhou.aliyuncs.com/mirror/fonts/msyhbd.ttf
  4. wget -P /tmp/ https://iyoyo.oss-cn-hangzhou.aliyuncs.com/mirror/fonts/msyhl.ttf
  5. cd /usr/share/fonts/lyx/
  6. mkdir chinese
  7. cd chinese
  8. mv /tmp/msyhbd.ttf ./
  9. chmod 755 *.ttf
  10. yum -y install mkfontscale
  11. mkfontscale
  12. mkfontdir
  13. fc-cache -fv

Resource

项目基于PhantomMagick

讨论交流

Laravel 生成小程序图文海报最佳方案之一的更多相关文章

  1. PHP 图片+文字+二维码生成小程序分享海报

    思路: 1.请求微信接口获取一定尺寸微信二维码 2.准备海报主图,处理尺寸按比例缩放 3.准备分享语录,计算段落高度 4.生成海报:创建画布,分写别入按顺序和位置写入二维码.图片.文字等 5.保存海报 ...

  2. nodejs + 小程序云函数 生成小程序码

    前言:这个东西坑死我了 业务需求要生成小程序码 然后我找了两天的资料 运行 生成一堆的乱码 死活就是不能生成 最后看了一遍博客 套用了一下 自己又简单的改了一下  nodejs 我是刚刚接触  有很多 ...

  3. 微信小程序获取Access_token和页面URL生成小程序码或二维码

    1.微信小程序获取Access_token: access_token具体时效看官方文档. using System; using System.Collections.Generic; using ...

  4. 在小程序中实现 Mixins 方案

    摘要: 小程序开发技巧 作者:jrainlau 原文:在小程序中实现 Mixins 方案 Fundebug经授权转载,版权归原作者所有. 在原生开发小程序的过程中,发现有多个页面都使用了几乎完全一样的 ...

  5. PHP生成小程序二维码

    /** * [生成小程序二维码] * @return [type] [description] */ public function makeMiniQrcode_do() { begin: $id ...

  6. C# 生成小程序码

    /// <summary> /// B接口-微信小程序带参数二维码的生成 /// </summary> /// <param name="access_toke ...

  7. .NET生成小程序码,并合自定义背景图生成推广小程序二维码

    前言: 对于小程序大家可能都非常熟悉了,随着小程序的不断普及越来越多的公司都开始推广使用起来了.今天接到一个需求就是生成小程序码,并且于运营给的推广图片合并在一起做成一张漂亮美观的推广二维码,扫码这种 ...

  8. [技术博客]海报图片生成——小程序canvas画布

    目录 背景介绍 canvas简介 代码实现 难点讲解 圆角矩形裁剪失败之PS的妙用 编码不要过硬 对过长的文字进行截取 真机首次生成时字体不对 drawImage只能使用本地图片 背景介绍 目标:利用 ...

  9. PHP生成小程序二维码合成图片生成文字

    这部分代码是写在项目上的代码,THINKPHP3.1如果迁移到其他的地方应该要稍稍改动一下以适合自己的项目 function get_bbox($text,$fsize,$ffile){ return ...

随机推荐

  1. QDU_组队训练(ABEFGHKL)

    A - Accurately Say "CocaCola"! In a party held by CocaCola company, several students stand ...

  2. python-is,==

    在讲is和==这两种运算符区别之前,首先要知道Python中对象包含的三个基本要素,分别是:id(身份标识).python type()(数据类型)和value(值).is和==都是对对象进行比较判断 ...

  3. tensorflow基础-placeholder

    placeholder: 要给节点输入数据时用 placeholder,在 TensorFlow 中用placeholder 来描述等待输入的节点,只需要指定类型即可,然后在执行节点的时候用一个字典来 ...

  4. BZOJ - 2844 线性基

    题意:求给定的数在原数组中的异或组合中的排名(非去重) 因为线性基中\(b[j]=1\)表示该位肯定存在,所以给定的数如果含有该位,由严格递增和集合枚举可得,排名必然加上\(2^j\)(不是完全对角就 ...

  5. git命令行使用

    * git branch : 查看本地分支 * git branch -r : 查看远程分支 * git branch -a : 查看全部分支 * git branch name : 本地新建分支 * ...

  6. mutillidae2.6.48部署到phpstudy

    废话不多说,先上链接 mutillidae2.6.48链接: https://pan.baidu.com/s/1hssyiVy 密码: pw67 phpstudy2016.exe链接: https:/ ...

  7. PIE SDK矢量唯一值渲染

    1. 功能简介 图层的唯一值渲染即是根据矢量图层的某一个数值字段的属性值,按照值的不同大小设置不同的显示符号.属性数值相等的所有要素归为同一种类,即同一符号. 2. 功能实现说明 2.1. 实现思路及 ...

  8. jquery 去除字符串左右空格

    /*** 删除左右两端的空格*/String.prototype.trim=function(){return this.replace(/(^\s*)|(\s*$)/g, '');} 调用方式: v ...

  9. 学习javscript函数笔记(二)

    定义: 函数包含一组语句,他们是JavaScript的基础模块单元,用于代码复用.信息隐藏和组合调用.函数用于指定对象的行为. 1.函数对象 JavaScript中的函数就是对象,函数对象连接到Fun ...

  10. 使用JavaFX打开fxml,找不到打开的图形界面

    解决方案: 将 HKEY_CURRENT_USER\Software\JavaSoft\Prefs\com\oracle\javafx\scenebuilder\app\preferences\/S/ ...