一、需求
从卡券里面获取相对真实的用户信息
二、调研
-
微信卡券是属于微信公众号的功能,所以小程序要用需要在微信开放平台里面关联小程序和微信公众号。
-
微信卡券开卡分为两种:公众号后台页面开卡、调用接口开卡(推荐)
官方有文档,主要关注两份
-
微信小程序打通领取会员卡也分两种情况:
- 调用AddCard()、OpenCard()接口
-
跳转小程序开发组件(推荐)
- 跳转型一键开卡(推荐),用户更加无感
- 非跳转型一键开卡
三、流程
-
创建一张会员卡,参考微信公众号创建会员卡文档,贴出基本格式
POST请求,JSON格式。
{ "card": { "card_type": "MEMBER_CARD", "member_card": { "wx_activate": true, "wx_activate_after_submit": true, "wx_activate_after_submit_url": "pages/index/index", "activate_app_brand_user_name": "gh_1211a5ca04bf@app",//小程序原始ID+@app 原始id不是appId "activate_app_brand_pass": "pages/index/index", "base_info": { "logo_url": "XXXXX", "brand_name": "会员卡名字", "code_type": "CODE_TYPE_QRCODE", "title": "会员卡副标题", "color": "Color100", "notice": "使用时向店员出示此券", "service_phone": "020-8887744488", "description": "不可与其他优惠同享", "date_info": { "type": "DATE_TYPE_PERMANENT" }, "sku": { "quantity": 100000000 }, "get_limit": 1, "use_custom_code": false, "can_give_friend": false, "need_push_on_view": false }, "supply_bonus": true, "supply_balance": false, "prerogative": "请线下联系店铺" } } }
-
设置用户开卡时填写的开卡字段,分必填和选填,详情见微信公众号创建会员卡
贴出基本格式
{ "card_id": "会员卡ID", "required_form": { "can_modify":false, "common_field_id_list": [ "USER_FORM_INFO_FLAG_MOBILE" ] }, "optional_form": { "can_modify":false, "common_field_id_list": [ "USER_FORM_INFO_FLAG_NAME", "USER_FORM_INFO_FLAG_SEX", "USER_FORM_INFO_FLAG_BIRTHDAY", "USER_FORM_INFO_FLAG_LOCATION" ] } }
-
跳转小程序开发组件,毕竟是微信自己开发的小程序,所以需要传一些参数。参数怎么来,怎么跳,参考博客,可以绑定一个按钮,或者直接用navigator组件。这里有几个坑:打个比方,用户通过其他渠道,如addCard、朋友分享已经领取了你这个卡,那么是不会进入小程序开发组件的,只会进入会员卡列表页面,也就不会显示注册页面,所以我们确保不能通过其他渠道提前领取。
-
填好信息,点击一键激活。怎么把参数extraData带回我们自己的小程序。
踩坑点
-
确保开卡时,这几个信息完整。尤其是wx_activate_after_submit_url,血坑。这参数我以为不用填,谁知道死活跳不回,目前好像这参数可以随便填,毕竟真正起跳回路径的是activate_app_brand_pass。
"wx_activate": true, "wx_activate_after_submit": true, "wx_activate_after_submit_url": "pages/index/index", "activate_app_brand_user_name": "gh_1211a5ca04bf@app",//小程序原始ID+@app 原始id不是appId "activate_app_brand_pass": "pages/index/index",
-
跳回去后,在哪里拿extraData,注意是在小程序App.js的onShow里面,不是跳转页面的onShow。uniapp在app.vue的onShow。
-
-
拿到参数后就简单了,调取接口获得用户注册信息,并且激活卡就行。
激活卡参数如下
{ "membership_number": "卡号或者手机号", "code": "extraData里有", "card_id": "同上" }