利用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方法不足以达到这个效果，只能改变颜色和字体大小，改变不了字体，和粗细；所以贼麻烦

###总结：

1. 前端先是提供原始图片，供用户去挑选
2. 用户选取图片之后，前端传递选中的 ID+文字 ->后台
3. 后台根据ID，存好相应的字体样式，字体，位置信息等
4. 最后后台拼接图片
5. imagecreatefromstring创建图片实例
6. imagecolorallocate字体颜色、imagefttext字体位置，粗细，字体
7. 输出图片，并且传递新生成的图片给前端展示

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