利用php拼接图片，实现水印的效果

利用后台php拼接图片，实现水印的效果

前提：

我是个小小小前端，收到老大布置的任务需求如下

- 运行：微信小程序

- 提供图片，处理图片

- 使用自定义输入的问题替换图片中的一些文字

- *保存，分享

开始

当得到这个任务，第一个想法就是canvas或者图文堆叠，html5的canvs还是做过一些实例，简要说明下，我目前对微信小程序的组件只是了解，API还好点。就兴致勃勃的开始做。

先是看小程序的canvas组件：如下

看了半天，感觉没什么L用啊，没有我想要的东西，然后继续翻，找到下面的这些API

终于是找到了要的东西，开始写小demo,图片自己找的报纸底图（PS处理），然后也实现了效果，但是万万没想到啊，做到最后，发现小程序没有提供文字样式的方法，只有文字大小，连粗细都没有，苦逼的放弃了这个方法，听一个大佬给的方法，利用后台php合成图片；

具体思路：

将图片放在后台

前端展示图片，然后供用户选择

用户选择后，前端将ID，和文字传到后台

php接收到ID和文字之后，将对应ID的图片与文字拼接（注意文字放置的位置和字体）

拼接完成，传回新的图片给前端展示，达到水印效果

首先没处理和处理的图片我都放在了后台文件夹中

包含了图片 字体 php文件

　

PHP代码

<?php

$text = $_GET['text'];
$id = $_GET['id'];
echo $text;
echo $id;
$dst_path = "1.jpg";
echo $dst_path;
//创建图片的实例
$dst = imagecreatefromstring(file_get_contents($dst_path));
//打上文字
$font = './STHUPO.TTF';//字体
$black = imagecolorallocate($dst, 0, 0, 0);//字体颜色
imagefttext($dst, 10.5, 0, 47, 119, $black, $font, $text);
//输出图片
list($dst_w, $dst_h, $dst_type) = getimagesize($dst_path);
switch ($dst_type) {
case 1://GIF
header('Content-Type: image/gif');
imagejpeg($dst,'new.gif');
break;
case 2://JPG
header('Content-Type: image/jpg');
imagejpeg($dst,'new.jpg');
break;
case 3://PNG
header('Content-Type: image/png');
imagejpeg($dst,'new.png');
break;
default:
break;
}
imagedestroy($dst);
?>

imagejpeg($dst,'new.jpg') 生成新的图片；运行之后你就可以看到你新生成的new.jpg了

小程序就通过直接请求新生成的图片，进行展示到界面，就完成了图片拼接，这个个人感觉只能由后台来完成（指的是微信小程序），H5中的canvas比这狗多了，额不，强多了。

原因：

因为张小龙希望微信小程序体现的是轻便，小巧。所以提供的canvas方法不足以达到这个效果，只能改变颜色和字体大小，改变不了字体，和粗细；所以贼麻烦

总结：

前端先是提供原始图片，供用户去挑选

用户选取图片之后，前端传递选中的 ID+文字 ->后台

后台根据ID，存好相应的字体样式，字体，位置信息等

最后后台拼接图片

imagecreatefromstring创建图片实例

imagecolorallocate字体颜色、imagefttext字体位置，粗细，字体

输出图片，并且传递新生成的图片给前端展示

写的不好，还望谅解！可能有错的地方还望大佬指点。