1、微信登录
使用cocos creator开发的微信小游戏，只有接入微信的授权登录信息才能获取用户的头像、昵称等基本信息，方便在游戏中使用。接入微信登录也是比较简单，只需要在游戏中调用wx.login接口就可以。为了使用户进入游戏必须的得到微信的授权信息，一般会在游戏的主界面调用wx.login接口，接口调用必须是在cocos creator脚本的start()方法中，在onload()中调用是不会生效的。一下是微信登录授权的具体代码实现：
//start方法
start() {
if(WECHAT){
//微信登录
this.wxLogin();
}
}
//调用微信接口
wxLogin(){
let sysInfo = wx.getSystemInfoSync();
// 获取微信界面大小
let screenWidth = sysInfo.screenWidth;
let screenHeight = sysInfo.screenHeight;
let self = this
wx.login(
{
success: (res) =>
{
if (res.code)
{
let code= res.code;
console.log("登陆成功,获取到code:", code)
wx.request({
url:GLOBAL_REQUEST_URL,
data:{
"code":code
},
success (res) {
//res.data 就是返回的json 字符串解解析后的数据 res.data.account.sdkId
console.log("login result:"+res.data)
//let loginResult = JSON.parse(res);
// loginResult.get
}
});
}
var button = wx.createUserInfoButton(
{
type: 'text',
text: '',
style: {
left: 0,
top: 0,
width: screenWidth,
height: screenHeight,
lineHeight: 40,
backgroundColor: '#00000000',
color: '#ffffff',
textAlign: 'center'
}
})
button.onTap((res) =>
{
if(res.errMsg=="getUserInfo:ok")
{
console.log("授权用户信息")
//获取到用户信息
// let userInfo = res.userInfo
// self.wxLogin(userInfo);
wx.getUserInfo({
lang:"zh_CN",
success: function(res) {
let userInfo = res.userInfo
let avatarUrl = userInfo.avatarUrl
assetManager.loadRemote(avatarUrl,{ ext: '.png' },(err, spriteFrame)=>{
if(err){
return;
}
DownloadResource.avartarSpriteFrame = SpriteFrame.createWithImage(spriteFrame as ImageAsset);
});
console.log(userInfo)
},
fail:function(){
console.log("获取失败");
return false;
}
})
//清除微信授权按钮
button.destroy()
}
else
{
console.log("授权失败")
}
})
}
})
}
以上实现的的是在游戏主界面创建一个和屏幕大小一样大的透明的按钮，用户在进入主界面的时候，点击主界面的任何位置都会触发微信授权登录。
微信登录授权成功之后会回返回给客户端一个code，客户端可以发送code到我们自己的服务器，服务器接收到code之后，将code 作为参数(当然还需要appId和appSecret,这两个参数都是在微信开发后台可以查询到的)，微信服务器请求获取用户的openId，用户的openId是唯一的，所以我们就一根据用户的openId生成自己的账号信息。具体的登录九成如下图所示：
2、微信分享功能接入
微信分享功能分为主动分享和被动分享。
主动分享：用户点击游戏中的分享按钮激活分享功能，可以分享到朋友圈和好友
被动分享：用户点击小游戏的右上角的分享，是微信小游戏自带的。
我们先来看一下如何实现被动分享，被动分享也是只要在start()方法里面调用wx.showShareMenu接口即可激活被动分享，代码如下：
start() {
if(WECHAT){
//激活右上角分享,被动分享
this.wxActivePassiveShare();
}
}
//调用微信被动分享接口
wxActivePassiveShare(){
wx.showShareMenu({
withShareTicket: true,
menus: ['shareAppMessage', 'shareTimeline']
});
resources.load("share/share", (err, data)=>{
console.log("hahahhaha:"+data.nativeUrl);
wx.onShareAppMessage(()=>{
return {
title:"大家一起来吃瓜",
imageUrl:data.nativeUrl,
success(res1){
console.log("passive share successfully!");
},
fail(res2){
console.log("passive share failed!");
}
}
});
});
resources.load("share/share", (err, data)=>{
wx.onShareTimeline(()=>{
return {
title:"大家一起来吃瓜",
imageUrl:data.nativeUrl,
success(res1){
console.log("passive share successfully!");
},
fail(res2){
console.log("passive share failed!");
}
}
});
});
}
主动分享也是同样简单，不过需要把点击事件放到分享按钮上，点击按钮触发事件在这里不做讲解，下面我们来看触发的事件如何实现，具体代码如下：
onClickShareButton(){
resources.load("share/share", (err, data)=>{
console.log("hahahhaha:"+data.nativeUrl);
wx.shareAppMessage(()=>{
return {
title:"大家一起来吃瓜",
imageUrl:data.nativeUrl,
success(res1){
console.log("active share successfully!");
},
fail(res2){
console.log("active share failed!");
}
}
});
});
}
讲解了如何获取微信授权、实现分享等功能，其实还是比较简单的，只要在合适的位置调用微信相关的接口就可以了。另外cocos creator小游戏可以发布到不同的平台运行，所以我们在调用微信接口的时候需要判断当前小游戏的运行环境是不是微信小游戏环境。cocos creator中定义了常量来标记是当前环境是不是微信小游戏环境，对应代码里面的if(WECHAT)。
