微信公衆平臺開發(121) 微信二維碼海報

關鍵字：微信公衆平臺 二維碼 海報
做者：方倍工做室
原文: http://www.cnblogs.com/txw1958/p/weixin-poster.html 

 

本文介紹微信公衆平臺下二維碼海報的開發過程。

1、微信二維碼海報介紹

微信二維碼海報是指在海報中嵌入和微信用戶關聯的參數二維碼的海報，用戶分享推廣以後，新用戶能夠被統計爲被推廣人員數，從而達到增長粉絲的傳播效果。其使用場景以下：

 

 

2、開發流程

在微信二維碼海報生成中，須要用到如下信息

1. 自定義菜單中設置一個菜單項，點擊後返回二維碼海報給用戶

2. 接口接收到菜單點擊以後，獲取用戶的頭像、ID(可使用OpenID)

3. 生成和用戶關聯的參數二維碼，

4. 將參數二維碼進行縮放

5. 將頭像和參數二維碼合併成新的參數二維碼圖片

6. 將新參數二維碼圖片作爲水印合成到背景海報中

7. 將用戶暱稱，以及二維碼時間戳(類型爲臨時二維碼時)等文字合成到背景海報中

8. 將海報上傳成臨時圖片素材

9. 將圖片素材使用客服接口發送給用戶。

 

3、微信素材準備

海報底圖以下

3.1 生成自定義菜單

菜單的生成方法，請參考《微信公衆平臺開發（58）自定義菜單》以及方倍工做室的書籍《微信公衆平臺開發最佳實踐(第2版)》

本項目中使用的菜單JSON爲

3.2 獲取用戶基本信息

使用方倍工做室SDK獲取用戶基本信息的方法以下

    //獲取用戶信息
    $userinfo = $weixin->get_user_info($openid);
    var_dump($userinfo);
    
    //獲取用戶頭像 64像素
    $headimgurl = substr($userinfo['headimgurl'],0,strripos($userinfo['headimgurl'], "/"))."/64";
    var_dump($headimgurl);
    // $headimgurl = "http://wx.qlogo.cn/mmopen/R9V6295VOlibNsicszoREqUF2CiaY8hL5fFt0D8DykUCjJ8ia4rQicbYViax3A2V0am2oUEWvw5awGia0tmwQEbI0tAu4kkCL7Eiaeia7/64";
    

須要注意的是，用戶默認頭像是640像素的大圖，將其切換成64位像素大小，以便放置在二維碼中間。

一樣的，用戶基本信息的獲取方法，請參考《微信公衆平臺開發(76) 獲取用戶基本信息 》以及方倍工做室的書籍《微信公衆平臺開發最佳實踐(第2版)》

用戶頭像信息以下所示

 

3.3 生成參數二維碼

使用方倍工做室SDK獲取用戶基本信息的方法以下

  //建立永久二維碼，參數爲用戶openid
    $qrcodeinfo = $weixin->create_qrcode("QR_LIMIT_STR_SCENE", $openid);
    var_dump($qrcodeinfo);
    $qrcodeurl = "https://mp.weixin.qq.com/cgi-bin/showqrcode?ticket=".urlencode($qrcodeinfo["ticket"]);
    var_dump($qrcodeurl);
    // $qrcodeurl = "https://mp.weixin.qq.com/cgi-bin/showqrcode?ticket=gQHf7zoAAAAAAAAAASxodHRwOi8vd2VpeGluLnFxLmNvbS9xL05rUGlyTXJsd2hxN3BCUnFNbTlNAAIEu1X8VwMEAAAAAA%3D%3D";

參數二維碼能夠考慮使用永久字符串的，也能夠考慮使用臨時數字，臨時數字優勢沒有上限限制，缺點是有有效期。永久的則相反。

一樣的，參數二維碼的獲取方法，請參考《微信公衆平臺開發(83) 生成帶參數二維碼》以及方倍工做室的書籍《微信公衆平臺開發最佳實踐(第2版)》

參數二維碼以下所示

 

 

4、微信二維碼海報生成

4.1 二維碼縮放

 微信二維碼默認是430像素，將其縮放成300像素，核心代碼以下

imagecopyresampled($qrcode_thumb, $qrcode_source, 0, 0, 0, 0, 300, 300, 430, 430);

 

4.2 頭像合成到二維碼圖片上

核心代碼以下

imagecopy($qrcode_thumb, $head_source, 118, 118, 0, 0, 64, 64);

合成後，效果以下

4.3 二維碼合成到海報中

核心代碼以下

//加水印
    imagecopy($dst_qr, $qrcode_thumb, 212, 410, 0, 0, 300, 300);    //水印位置

 

4.4 文字合成到海報中

核心代碼以下

imagettftext($dst_qr, 30, 0, 40, 85, $textcolor, $font, $text);

合成後效果以下

 

5、素材上傳與發送

5.1 上傳臨時圖片素材

使用方倍工做室SDK上傳圖片素材的方法以下

//將圖片上傳臨時圖文素材
    $material = $weixin->upload_temporary_material("image", $filename); //logo.jpg須放於類同目錄，注意路徑
    var_dump($material);
    $mediaid = $material["media_id"];

    // array(3) { ["type"]=> string(5) "image" ["media_id"]=> string(64) "21Lz-eMFoSsA_R5gLOUJOqxbGw6YEEPRQq-UjHVbU6q64VyUBUqt7B8252ySPKdt" ["created_at"]=> int(1487213817) }

上傳後，得到圖片的media_id

 

5.2 使用客服接口發送圖片

使用方倍工做室SDK發送圖片的方法以下

    //客服接口發送臨時圖片素材
    $send_result = $weixin->send_custom_message($openid, "image", array('media_id'=>$mediaid));
    var_dump($send_result);

 

6、演示

關注方倍工做室微信公衆帳號，點擊菜單「個人海報」

 

 

6、源碼

聯繫QQ 1354386063