Asroads'Blog 君子不器
Layabox-学习笔记-(5)
发布于: 2018-08-24 更新于: 2024-07-20 分类于: game 阅读次数: 

Layabox 关于微信小游戏 用户授权 接入

接入原因

2018年4月15日微信团队发了新的接口调整的公告

小程序与小游戏获取用户信息接口调整,请开发者注意升级

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

一、小程序:

1、使用 button 组件,并将 open-type 指定为 getUserInfo 类型,获取用户基本信息。

详情参考文档:

https://developers.weixin.qq.com/miniprogram/dev/component/button.html

2、使用 open-data 展示用户基本信息。

详情参考文档:

https://developers.weixin.qq.com/miniprogram/dev/component/open-data.html

二、小游戏:

1、使用用户信息按钮 UserInfoButton。

详情参考文档:

https://developers.weixin.qq.com/minigame/dev/document/open-api/user-info/wx.createUserInfoButton.html

2、开放数据域下的展示用户信息。

详细参考文档:

https://developers.weixin.qq.com/minigame/dev/document/open-api/data/wx.getUserInfo.html

请各位开发者注意及时调整接口。

这个时候 我们知道 第三条 是关于小游戏 用户信息的,以前我们登录的生活 直接获取用户信息,如果没有授权的用户自动弹出用户授权信息,已经授权的则不会弹出,这次修改改变了原来的逻辑。

更新办法

在微信小游戏API版本>=2.0.1之后 就可以使用新的方法 UserInfoButton wx.createUserInfoButton(Object object) 来实现以前的功能。

以前我们可以这样写:

1
2
3
4
private starGame() {
const userInfo = game platform.getUserInfo();//game 是你游戏对象的实例
console.log("用户数据:",userInfo);
}

以后要改用新的API规则自己主动调用。

官方给出的例子:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
let button = wx.createUserInfoButton({
type: 'text',
text: '获取用户信息',
style: {
left: 10,
top: 76,
width: 200,
height: 40,
lineHeight: 40,
backgroundColor: '#ff0000',
color: '#ffffff',
textAlign: 'center',
fontSize: 16,
borderRadius: 4
}
})
button.onTap((res) = > {
console.log(res)
})

表示可以用两种类型 文本按钮 和图片按钮 来触发 下面的 style 对象是设置 按钮的样式 还有一些其他的参数是可选的。大家可以自行去看官方的API 写 的很详细。《UserInfoButton wx.createUserInfoButton(Object object)

这样 我们在登录游戏的时候 可以通过 用户的设置信息 获得 有没有经过授权,然后判断是否主动弹出让用户授权的页面。接口是 wx.getSetting(Object object)API地址点击查看

返回的信息下面 有个 authSetting的属性 里面包含一个scope.userInfo的属性。这个属性是个boolean类型的,我们可以根据这个类型进行操作。

问题得以解决

我的示例代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
/**
* Created by asroads on 2018/8/21 上午11:45
* Note: 微信授权UI
*/
module smile {
export class MyAuthorize {
/**
* 获取用户设置信息(关于授权...)
*/
public static getWXSetting = () => {
let seting = {
complete: (scope) => {
console.log("wxsetingComplete");
},
success: (scope) => {
// console.log("setingSuccess:" + JSON.stringify(scope));
if (scope && scope.authSetting && scope.authSetting['scope.userInfo'])
MyAuthorize.showCallbackFunction();//如果已经授权
} else {
console.log("notAuthorize");
MyAuthorize.initUserInfoButton();
}
},
fail: (scope) => {
console.log("wxsetingFail");
}
};
mygame.platform.Instance.getSetting(seting);
};
/**
* 显示开始游戏
*/
private static showCallbackFunction = () => {
console.log("这里写你的开始游戏界面");
};
/**
* 初始化 用户信息授权按钮 和监听点击事件
*/
private static initUserInfoButton = () => {
let button = MyAuthorize.creatUserInfoButton();
button.onTap((res) => {
// console.log("sucess:" + JSON.stringify(res));
button.destroy();
});
button.show();
};
/**
* 创建 按钮
*/
private static creatUserInfoButton = () => {
let imgWidth: number = 279;
let imgHeight: number = 179;
let button = mygame.platform.Instance.createUserInfoButton({
type: 'image',
text: '获取用户信息',
image: 'path/login.png',
style: {
left: (Laya.Browser.clientWidth - imgWidth) / 2,
top: (Laya.Browser.clientHeight - imgHeight) / 2,
width: imgWidth,
height: imgHeight,
lineHeight: 40,
backgroundColor: '#ff0000',
color: '#ffffff',
textAlign: 'center',
fontSize: 16,
borderRadius: 4
},
withCredentials: true,
lang: 'zh_CN'
});
return button;
}
}
}


Layabox 关于微信小游戏 网络加载

刚开始我按照官方文档 设置了白名单,但是本地测试一直是采用的网络加载,后来才发现,这个设置只有在微信平台下才起作用,所以我在 chome 和 layaair本地测试无效。是layabox 专为微信API 特意定制的设置方法

1
2
3
4
material.diffuseTexture = Laya.Texture2D.load("res/layabox.png");
box.meshRender.material = material;
Laya.URL.basePath = "https://XXXX.com";//请把XXXX换成自己的真实网址;
//在此之下,再使用load加载资源,都会自动加入URL网址。从网络上动态加载。

白名单 设置也很简单

1
2
3
4
5
6
7
8
9
10
MiniAdpter.nativefiles =  [
"wxlocal",
"res/atlas/houzi.atlas",
"res/atlas/houzi.png",
"common/tishi.png",
"common/bg.png",
"ui.json",
"newLb/bg031.png"
];

Layabox 官方文档 http://ldc.layabox.com/doc/?nav=zh-ts-5-0-4

--- 本文结束 The End ---