1. 小程序要做分销功能,即这个小程序是谁分享给你的,你使用TA分享过来的小程序买了东西后,双方都有优惠
2. 小程序要实现分销功能,就要获取分享者的openid和使用者的openid;使用者的openid很容易获取,但是分享者的openid怎么通过小程序码和转发带过来呢?这是本文主要解决的问题。
最终实现的前端界面如下图所示,要实现 小程序码带参 和 “分享好友购票带参”
1. 实现的大体逻辑:
1.1 首先获取AccessToken(https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140183);
1.2 然后调用微信API:getWXACodeUnlimit(https://developers.weixin.qq.com/miniprogram/dev/api-backend/getWXACodeUnlimit.html);
即可生成小程序码。
2. 接口代码片段 CommonFunc.php (里面涉及到数据库操作和HTTP请求可以改成自己的)
fetchByWxAppId($appId);#数据库操作
if($row)
{
$token = empty($row['access_token']) ? null : json_decode($row['access_token'], true);
if($token && $token['expire'] > time())
{
return $token['access_token'];
}else
{
$appSecret = $row['wx_appsecret'];
$url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid={$appId}&secret={$appSecret}";
$curl = new CUrl(30);
$ret = $curl->get($url);#HTTP请求
$ret = json_decode($ret, true);
if(isset($ret['errcode']))
{
throw new RemoteServiceException("获取AccessToken失败:".$ret['errmsg'],98);
}else
{
$expire = time() + $ret['expires_in'] - 200; //过期时间
$accessToken = $ret['access_token'];
$updateData = array('access_token' => json_encode(array('access_token' => $accessToken, 'expire' => $expire)));
$params = array('wx_appid' => $appId);
$appIdModel->updateData($updateData, $params);#数据库操作
return $accessToken;
}
}
}else
{
throw new LocalServiceException("账户信息不存在或配置有误",99);
}
}
/**
* @Function 生成微信二维码
* @param $scene String 最大32个可见字符,只支持数字,大小写英文以及部分特殊字符
* @param string $page String 必须是已经发布的小程序存在的页面(否则报错),例如 pages/index/index
* @param string $width String 二维码的宽度,单位 px,最小 280px,最大 1280px
* @param bool $auto_color Bool 自动配置线条颜色,如果颜色依然是黑色,则说明不建议配置主色调,默认 false
* @param string $line_color Bool auto_color为 false 时生效,使用 rgb 设置颜色 例如 {"r":"xxx","g":"xxx","b":"xxx"} 十进制表示
* @param bool $is_hyaline Bool 是否需要透明底色,为 true 时,生成透明底色的小程序
* @return mixed|string
* @throws LocalServiceException
* @throws RemoteServiceException
*/
public function getWXACodeUnlimit($scene, $page='pages/index/index', $width='430',$auto_color=false,$line_color='{"r":0,"g":0,"b":0}',$is_hyaline=false)
{
//1.获取AccessToken
$appId = \PhalApi\DI()->config->get('app.zc.wxAppId');#获取配置文件里的小程序appid
$token = $this->getAccessToken($appId);
//2.获取二维码
$params = array(
'scene'=>$scene,
'page' => $page,
'width' => $width,
'auto_color' => $auto_color,
'line_color' => $line_color,
'is_hyaline' => $is_hyaline,
);
$params = json_encode($params);
$url = "https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token={$token}";
$curl = new CUrl(30);
$curlRes = $curl->post($url,$params);#HTTP请求
$ret = json_decode($curlRes, true);
if(isset($ret['errcode'])) {
throw new RemoteServiceException("获取二维码失败:".$ret['errmsg'],98);
}else {
return base64_encode($curlRes);
}
}
}
接口调用示例:
getWXACodeUnlimit($scene, $page, $width, $auto_color,$line_color, $is_hyaline);
小程序前端wxacode.js
Page({
/**
* 页面的初始数据
*/
data: {
openid: '',
imgBase64: '',//小程序二维码base64值
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var openid = wx.getStorageSync('openid');
this.setData({ openid: openid });
this.getWXACodeUnlimit();
},
//获取二维码数据
getWXACodeUnlimit: function(){
var that = this;
var openid = that.data.openid;
var imgBase64 = wx.getStorageSync(openid + '_imgBase64')
if (imgBase64){
that.setData({ imgBase64: imgBase64 })
}else{
var reqData = {
scene: openid,
}
wx.request({
url: 'www.example.com',
data: {
scene: reqData.scene,
page: reqData.page,
width: reqData.width,
auto_color: reqData.auto_color,
line_color: reqData.line_color,
is_hyaline: reqData.is_hyaline,
},
header: {
"content-type": "application/json"
},
method: "POST",
success: function (e) {
that.setData({imgBase64: e})
wx.setStorageSync(openid + '_imgBase64', data)
},
fail: function (t) {
}
})
}
},
})
小程序前端wxacode.wxml
经过以上步骤即可生成小程序码。
transfer.wxml
transfer.js
Page({
/**
* 页面的初始数据
*/
data: {
openid: '',
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var openid = wx.getStorageSync('openid');
this.setData({ openid: openid });
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
//分享好友购票
onShareAppMessage:function(){
var that = this;
var openid = that.data.openid;
return {
title:'专业城际巴士互联网订票平台,300万用户的首选!',
path: '/pages/index/index?whoShareToMe=' + openid,
success:function(res){
console.log(res)
}
}
},
})
至此,带参转发也可以了。
在app.js 的 onLaunch函数里捕获即可
onLaunch: function (options) {
console.log(JSON.stringfy(options))
}