宝哥软件园

微信JS-SDK实现微信会员卡功能(在微信卡包中发送会员卡给用户)

编辑:宝哥软件园 来源:互联网 时间:2021-08-21

需求:点击我司微信微信官方账号,从菜单栏进入会员中心。如果你是新会员,需要绑定注册,注册后跳转到用户中心页面,然后给用户发一张会员卡。如果你是老会员,如果之前没有会员卡,给他寄一张会员卡。如果你有,不要做任何处理。我实现:的思路是:进入会员中心,调用微信API接口,判断用户是否收到卡;如果没有,就调用微信JS-JDK的addCard()接口。具体实现过程如下(用C#实现):

1创建会员卡

1)先打开微信开发者文档,先调用创建会员卡界面,在文档4.1中创建会员卡界面,直接使用postman。有关详细信息,请参见文档。

特别注意“use _ custom _ code”: false和“bind _ OpenID”:创建时为false。

第一个是要不要定制代码,第二个是要不要绑定openid,这个非常重要,非常重要,非常重要!因为后面调用JS-JDK的addCard接口需要的签名会根据这两个值决定是否添加openid和代码进行签名生成(已经坑了很久了)。这个签名后面会详细解释,先一步一步来,记住这两个参数一定要注意。根据本文的描述,创建会员卡应该没有问题。对了,“SKU”: {“数量”: 5000000}是库存,所以需要补充一点库存。

2调用微信JS-SDK

1)介绍微信js

脚本类型=' text/JavaScript ' src=' http :http://RES . wx . QQ.com/open/js/jweixin-1 . 2 . 0 . js '/script 2)通过config接口注入权限验证配置

script $(function () { //判断是否已经领取会员卡$.ajax({ url: '/User/ExitCard ',键入: 'GET ',成功:函数(数据){ if(数据状态==1) //1代表没有存在卡,0代表存在卡wxAddCard();} });} //微信添加卡券函数wxAddCard() { //微信软件开发工具包配置wx.config({ debug: false,//开启调试模式,调用的所有美国石油学会(美国石油协会)的返回值会在客户端警报出来,若要查看传入的参数,可以在个人计算机端打开,参数信息会通过原木打出,仅在个人计算机端时才会打印appId: ' ',//必填,公众号的唯一标识timestamp: ' ',//必填,生成签名的时间戳nonceStr: ' ',//必填,生成签名的随机串signature: ' ',//必填,签名,见附录1 jsaplist :[' onmenushareptimeline ',' onMenuShareAppMessage ',' onMenuShareQQ ',' onMenuShareQZone ',' startRecord ',' stop record end ',' playVoice ',' pauseVoice ',' stopVoice ',' onVoicePlayEnd ',' uploadVoice ',' downloadVoice ',' hideOptionMenu '必填,需要使用的射流研究…接口列表,所有射流研究…接口列表见附录2 });wx。ready(函数(){ wx。addcard({ card list :[{ card d : },cardExt: ' { ' code ' : ' ',' openid': ' ',' timestamp': ' ',' nonce _ str ' : ' ' } ')}),success 3360 function(RES){ $ .Ajax({ URL : '/用户/活动卡',键入: 'GET ',成功:函数(数据){ if(数据。状态==0)警报('成功激活');} });},取消:函数(RES){ alert(JSON。stringify(RES))});});}/脚本我这里是进入页面就调取接口看是否已经领卡,没有领卡,则调用微信接口,用户点击领取,然后调取激活接口,将会员卡激活,下面讲述签名的生成。

3)签名的配置

上一小节中的wx.config中应用编号为公众号的唯一标识,自己填自身微信公众号的,时间戳,非时间戳,签名三个签名其实就是为了加密吧。(以下代码都是用C#实现)时间戳的生成:

///摘要///创建时间戳///本代码来自开源微信软件开发工具包(软件开发工具包)项目:https://github。com/night-king/weixink////summary///returns/returns public long CreatenTimestamp(){ return(DateTime .现在。转到通用名称()。刻度-62135596800000000)/10000000;} nonceStr的生成:

///摘要///创建随机字符串///本代码来自开源微信软件开发工具包(软件开发工具包)项目:https://github。com/night-king/weixink////summary///returns/returns public string create nonce _ str(){ Random r=new Random();var sb=new StringBuilder();可变长度=strs .长度;for(int I=0;i 15某人。追加(下一个(长度-1)]);}归还某人. ToString();}签名生成(这里是wx.config中的签名生成),签名签名的生成是由jsapi_ticket,noncestr,时间戳,url四个参数,先使用美国信息交换标准代码算法排序(其实就是看他们的字母顺序j、n、t、u排序,如果首字母相等看第二位,以此类推),先等键进行排序,然后拼接例如jsapi _ ticket=xxxnoncrest=.我这里已经自己手动排序了,所以没实现美国计算机学会排序,排序完之后,使用sha1加密,代码如下:

///摘要///签名算法///本代码来自开源微信软件开发工具包(软件开发工具包)项目:https://github。com/night-king/weixink////summary///param name=' jsapi _ ticket ' jsapi _ ticket/param///param name=' non estr '随机字符串(必须与wx.config中的非现金相同)/param ///param name='timestamp '时间戳(必须与wx.config中的时间戳相同)/param ///param名称='url '当前网页的网址,不包含#及其后面部分(必须是调用射流研究…接口页面的完整网址)/参数///返回/返回公共字符串GetSignature(string jsapi _ ticket,string noncestr,long timestamp,string URL){ var string 1 builder=new StringBuilder();string1Builder .追加(' jsapi_ticket=').追加(jsapi_ticket).追加("")。追加(' noncestr=').追加(非字符串)。追加("")。追加('时间戳=')。追加(时间戳)。追加("")。追加(' url=').追加(网址IndexOf('#')=0?url .子字符串(0,网址.IndexOf(' # ')): URL);返回ShaEncrypt .sha1加密(字符串1生成器.ToString()).toLower();}公共静态字符串sha1加密(字符串数据){ //也给不了全部的代码,只需知道拼接后sha1加密网上可以找到var hash=SHA1 .create();可变编码器=新系统文本。asciencoding();定义变量组合=编码器GetBytes(数据);定义变量结果=哈希ComputeHash(合并);StringBuilder str bul=new StringBuilder(40);for(int I=0;我的结果。长度;i ) { strbul .追加(结果[i].ToString(' x2 ');//加密结果x2’结果为32位,' x3 '结果为48位,' x4 '结果为64位}返回strbul .ToString();}返回wx.config所需要的四个参数appId,时间戳,nonceStr,签名。

没有意外的话可以成功,成功自动进入wx.ready(function () {}中。

wx。AddCard({ CardList :[{ CardD : ' ',//吧你前面创建会员卡成功返回的参数中的卡号写进去cardext :"{ code": " "、OpenID": " "、时间戳" : " "、nonce _ str": " "、签名" :"}"}]、成功3360函数(RES){ $ .Ajax({ URL : '/用户/活动卡',键入: 'GET ',成功:函数(数据){ if(数据。状态==0)警报('成功激活');} });},取消:函数(RES){ alert(JSON。stringify(RES))});cardExt的签名签名生成由你创建会员卡的时候设置的" use_custom_code": false," bind_openid":false决定,当两个为错误的时,则吧参数列表添加(代码);参数列表。添加(OpenID);注释掉,哪个为法斯勒,哪个就不要。下面代码的api _票证与上面的jsapi_ticket完全不同,不是同一个东西,我会最最下面放出他们获取的方法

//表示这里有几个参数,所以对应的paramList。在上面加上();需要添加几个//,这里是否填写了code和openid取决于会员卡创建时填写的两个字段。上面已经提到了Cardext 3360 ' { ' Code ' : ' ',' OpenID' : ' ',' timestamp' : ' ',' nonce _ str' : ' ',需要补充几个,这里是否填写Code和OpenID取决于创建会员卡时填写的两个字段。已经提到过,复制代码如下:

3.把上面后台界面的主要代码贴在下面

1)/用户/ExitCard(贴微信界面,然后根据返回的消息判断卡片是否已领取,如果已领取则为真,如果未领取则为假)

public bool exit card(String OpenID、String Token、String code、String card)//Token是access_token code是用户自定义的代码号//code,我这里是用户自定义的会员卡号//card是微信创建会员卡时返回的card { vardata=new hashtable();数据。Add('openid ',openId);数据。添加(' card_id ',CardD);var res=HttpHelper。HttpComm(字符串。format(' https://API . weixin . QQ.com/card/user/getcard list?access_token={0} ',token),' POST ',JSONHelper。ToJson(数据));var resObj=JSONHelper。fromjsontanonymoustype(RES,new { error_code=0,errmsg='ok ',has_share_card=false,card_list=Enumerable。重复(新{ card_id=string。空,代码=字符串。空},1)。to list()});//var resObj=JSONHelper。FromJsonToDictionarystring,object(RES);//对象信息=新对象();//var str=resObj。TryGetValue('card_list ',输出信息);if (resObj.card_list。count==0 | | resobj . card _ list==null)返回falsevar temp=falsefor(var I=0;i resObj.card_list。计数;i ) { if (resObj.card_list[i]。code==code){ temp=true;打破;} }返回温度;} 2)/用户/活动卡(激活会员卡)

//激活会员卡公共布尔活动卡(字符串访问令牌、字符串奖金、字符串cardNo、字符串card id)//奖金是用户积分cardno卡号card d { var data=new hashtable();数据。Add('init_bonus ',bonus);数据。添加('会员号',卡号);数据。添加('代码',卡号);//以上设置与本设置相同,自定义代码放在微信会员卡数据上。添加(' card_id ',CardD);var res=HttpHelper。HttpComm(字符串。format(' https://API . weixin . QQ.com/card/member card/activate?access_token={0} ',accessToken),' POST ',JSONHelper。ToJson(数据));var resObj=JSONHelper。fromjsontanonymoustype(RES,new { errcode='0 ',errmsg=' ok ' });if (resObj.errcode=='0 ')返回true//激活成功返回falseHttpHelper。上面的HttpComm只是一个工具类,它自己封装了定义好的http请求。

你可以自己发发帖请求,不会发。

4)总结和经验

整个过程大概如上。我觉得已经足够详细了。写这个博客的原因是网上有关于微信的知识,但是不是很详细,以至于刚接触的人都不知道怎么下手。虽然他们能看懂文档,但是微信的官方文档有很多漏洞,往往会让人花很多时间在文档的一个小细节上,上报的错误也比较笼统,所以我打算自己写一个更详细的。一个自己总结经验,有助于自我成长,另一个为后人铺路,让他们少走弯路,将来有机会和其他微信界面对接。会议流程将继续发布,以供参考。

获取api_ticket的微信界面:在这里写链接

也就是下面目录中的13.1,当然也可以在第二张图中找到,也是一样的

获取附录一jsapi_ticket的微信界面,即目录下的第16节

在这里写下链接

以上就是本文的全部内容。希望对大家的学习有帮助,支持我们。

更多资讯
游戏推荐
更多+