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

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

  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 : )

体验

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

安装

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"

配置项

    return [
//图片存储位置
'disks' => [
'MiniProgramShare' => [
'driver' => 'local',
'root' => storage_path('app/public/share'),
'url' => env('APP_URL') . '/storage/share',
'visibility' => 'public',
],
],
//图片宽度
'width' => '575px',
//放大倍数
'zoomfactor' => 1.5,
//0-100,100质量最高
'quality' => 100,
//是否压缩图片
'compress' => true,
];

使用

use iBrand\Miniprogram\Poster\MiniProgramShareImg;

$url = 'https://www.ibrand.cc/';
$result = MiniProgramShareImg::generateShareImage($url);

返回结果:

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

字体安装

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

  • window 将下载的字体文件复制到C:Windows\Fonts目录下或者双击字体文件进行安装
  • mac 下载的字体文件 双击字体文件进行安装
  • centos
# 安装微软雅黑
wget -P /tmp/ https://iyoyo.oss-cn-hangzhou.aliyuncs.com/mirror/fonts/msyh.ttf
wget -P /tmp/ https://iyoyo.oss-cn-hangzhou.aliyuncs.com/mirror/fonts/msyhbd.ttf
wget -P /tmp/ https://iyoyo.oss-cn-hangzhou.aliyuncs.com/mirror/fonts/msyhl.ttf
cd /usr/share/fonts/lyx/
mkdir chinese
cd chinese
mv /tmp/msyhbd.ttf ./
chmod 755 *.ttf
yum -y install mkfontscale
mkfontscale
mkfontdir
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. 【算法笔记】B1012 数字分类

    1012 数字分类 (20 分) 给定一系列正整数,请按要求对数字进行分类,并输出以下 5 个数字: A​1​​ = 能被 5 整除的数字中所有偶数的和: A​2​​ = 将被 5 除后余 1 的数字 ...

  2. 设置select不可修改

    <s:select id="notSelectChange" list="#{'1':'表示每月几号','2':'表示每季度第几天','3':'表示每年第几月'}& ...

  3. codeforces 703D Mishka and Interesting sum 偶数亦或 离线+前缀树状数组

    题目传送门 题目大意:给出n个数字,m次区间询问,每一次区间询问都是询问 l 到 r 之间出现次数为偶数的数 的亦或和. 思路:偶数个相同数字亦或得到0,奇数个亦或得到本身,那么如果把一段区间暴力亦或 ...

  4. c# datagridview 相关操作。

    string[] newRow = {"long","d","b"}; Gridview.Rows.Insert(Gridview.Rows ...

  5. flask之--钩子,异常,上下文,flask-script,模板,过滤器,csrf_token

    一.请求钩子 在客户端和服务器交互的过程中,有些准备工作或扫尾工作需要处理,比如: - 在请求开始时,建立数据库连接: - 在请求开始时,根据需求进行权限校验: - 在请求结束时,指定数据的交互格式: ...

  6. 【记录】BurpSuite之Grep-Extract

    借助一次sql注入来说明Grep-Extract的作用 要报出当前数据库中所有表名,这里可以有多种方法,我借助limit语句,以此来说明Grep-Extract的用法.

  7. firewall-cmd --reload 防火墙

    防火墙重新加载配置firewall-cmd --reload 查看开放的端口 firewall-cmd --list-ports nano /etc/sysconfig/iptables -A IN_ ...

  8. Web API 解决跨域问题

    一.跨域问题的由来 同源策略:出于安全考虑,浏览器会限制脚本中发起的跨站请求,浏览器要求JavaScript或Cookie只能访问同域下的内容. 正是由于这个原因,我们不同项目之间的调用就会被浏览器阻 ...

  9. VUE中toast的使用与开发

    在这篇文章中介绍了toast是什么,这篇文章主要介绍toast的开发与使用. 开发 Vuejs很流行,并且官方也给出了路由插件vue-router.数据管理插件vuex,但是我们仅仅停留在了使用的阶段 ...

  10. pat02-线性结构3. 求前缀表达式的值(25)

    02-线性结构3. 求前缀表达式的值(25) 时间限制 400 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 算术表达式有前缀表示法.中缀表示法和后缀表示法 ...