小程序sessionkey应该放在服务器,微信小程序登录流程及解析用户openid session_key,获取用户信息...

为优化用户体验,使用 wx.getUserInfo 接口直接弹出授权框的开发方式将逐步不再支持。从2018年4月30日开始,小程序与小游戏的体验版、开发版调用 wx.getUserInfo 接口,将无法弹出授权询问框,默认调用失败。正式版暂不受影响。开发者可使用以下方式获取或展示用户信息:

UnionID 机制说明

如果开发者拥有多个移动应用、网站应用、和公众帐号(包括小程序),可通过 UnionID 来区分用户的唯一性,因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号(包括小程序),用户的 UnionID 是唯一的。换句话说,同一用户,对同一个微信开放平台下的不同应用,unionid是相同的。所以我们有时候需要获取这个UnionID

这个图简单的可以看做三部分

1.微信小程序客户端

2.微信官方服务器

3.第三方服务器(这个可以看做是自己的)

具体步骤如下;

1. 客户端获得code,并将code传给第三方服务端

微信小程序端调用wx.login,获取登录凭证(code),并调用接口,将code发送到第三方客户端

2. 第三方服务端用code换session_key和openid

小程序端将code传给第三方服务器端,第三方服务器端调用接口,用code换取session_key和openid

3. 第三方服务端生成新的session(3rd_session)

第三方服务器端拿到请求回来的session_key和openid,先留着,不能给客户端;然后用操作系统提供的真正随机数算法生成一个新的session,叫3rd_session

4. 第三方服务端建立对应关系,并存储

将3rd_session作为key,微信服务端返回的session_key和openid作为值,保存起来

5. 第三方服务端将3rd_session发送到客户端

客户端只拿到3rd_session就够了,大人说话小孩别插嘴,小程序不需要知道session_key和openid

6. 正常请求

小程序每次请求都将3rd_session放在请求头里,第三方服务端解析判断合法性,并进行正常的逻辑处理

好了,废话不多说了,直接上代码:

1

2

3 登录

4

//index.js//获取应用实例

const app =getApp()var OPEN_ID = ''//储存获取到openid

var SESSION_KEY = ''//储存获取到session_key

var AVATARURL = ''

var NICKNAME = ''

var GENDER = ''

var PROVINCE = ''

var CITY = ''Page({/**

* 页面的初始数据*/data: {//判断小程序的API,回调,参数,组件等是否在当前版本可用。

canIUse: wx.canIUse('button.open-type.getUserInfo'),

isHide:false,

},/**

* 生命周期函数--监听页面加载*/onLoad:function() {var that = this;var nickName ='';var avatarUrl =''

//查看是否授权

wx.getSetting({

success:function(res) {if (res.authSetting['scope.userInfo']) {

wx.getUserInfo({

success:function(res) {//用户已经授权过,不需要显示授权页面,所以不需要改变 isHide 的值

that.setData({

nickName:res.userInfo.nickName,

avatarUrl:res.userInfo.avatarUrl

})

}

});

}else{//用户没有授权

//改变 isHide 的值,显示授权页面

that.setData({

isHide:true,

});

}

}

});

},/**

* 生命周期函数--监听页面初次渲染完成*/onReady:function() {

},/**

* 生命周期函数--监听页面显示*/onShow:function() {

},/**

* 生命周期函数--监听页面隐藏*/onHide:function() {

},/**

* 生命周期函数--监听页面卸载*/onUnload:function() {

},/**

* 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh:function() {

},/**

* 页面上拉触底事件的处理函数*/onReachBottom:function() {

},/**

* 用户点击右上角分享*/onShareAppMessage:function() {

},

bindGetUserInfo:function(e) {if(e.detail.userInfo) {//用户按了允许授权按钮

var that = this;//获取到用户的信息了,打印到控制台上看下

console.log("用户的信息如下:");

console.log(e.detail.userInfo);

NICKNAME=e.detail.userInfo.nickname;

GENDER=e.detail.userInfo.gender;

PROVINCE=e.detail.userInfo.province;

CITY=e.detail.userInfo.city;//授权成功后,通过改变 isHide 的值,让实现页面显示出来,把授权页面隐藏起来

wx.login({

success: res=>{//获取到用户的 code 之后:res.code

console.log("用户的code:" +res.code)//可以传给后台,再经过解析获取用户的 openid

//或者可以直接使用微信的提供的接口直接获取 openid ,方法如下:

wx.request({

url:'https://api.weixin.qq.com/sns/jscode2session', //接口地址

data: {

appid:'注册的appid',

secret:'生成的sercret',

js_code: res.code,

grant_type:'authorization_code'},

header: {'content-type': 'application/json' //默认值

},

success:function(res) {

console.log(res.data)

OPEN_ID= res.data.openid;//获取到的openid

SESSION_KEY = res.data.session_key;//获取到session_key

console.log(OPEN_ID)

console.log(SESSION_KEY)//如果返回成功,则将OPEN_ID和SESSION_KEY提交请求给本地服务器

wx.request({

url:'http://127.0.0.1:8080/wxapplogin/login.jsp',

data: {

open_id: OPEN_ID,

session_key: SESSION_KEY,

gender: GENDER,

province: PROVINCE,

city: CITY

},

header: {'content-type': 'application/json' //默认值

},

method:'GET'})

}

});

}

});

that.setData({

isHide:false,

});

}else{//用户按了拒绝按钮

wx.showModal({

title:'警告',

content:'您点击了拒绝授权,将无法进入小程序,请授权之后再进入!!!',

showCancel:false,

confirmText:'返回授权',

success:function(res) {//用户没有授权成功,不需要改变 isHide 的值

if(res.confirm) {

console.log('用户点击了“返回授权”');

}

}

});

}

}

})

当点击按钮之后出发getUserInfo()函数,我们在这个函数里面定义:

通过发送临时的code请求到微信的服务器,我们通过获取这个code再来解析用户的openid和session_key

请求地址url为:

https://api.weixin.qq.com/sns/jscode2session

appid为注册小程序时给定的,每一个微信小程序的appid也是唯一的,secret也会生成

当请求成功之后会从服务器返回openid和session_key,这里也可以写成

https://api.weixin.qq.com/sns/jscode2session?appid='自己的appid'&secret='自己的密钥'

完成之后我们来获取从服务器返回的值,如果请求成功,先打印出来,再传到自己的服务器上

OK,下面这个图是当点击按钮之后自动生成的code,在控制台答打印一下,每一次的都不一样

可以从控制台看到返回的数据,下面咱们再把这个数据放到自己的服务器上保留以后用

这个url是自己的服务器地址,为了方便测试,我们先用本地主机试一下,代码后续如果全部完成,再部署到服务器

所以如果点击index.wxml后控制台打印code并请求微信服务器,接着请求自己的服务器,就是这么个流程:

我们后端用java接受一下:

先打印到控制台,OK了,可以啊看到值传过去了,下面可以啊将值传到数据库里面,我就不用多写了,呀呀呀,有啥问题可以滴滴我:QQ2895911487 ,wechat:liu15694249526

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值