解决微信小程序的问题
图片在电脑上显示但在手机上却无法显示的问题
要使用的是本地图片，不想把图片上传到网络再通过https的方式解决，解决方法如下：
1.image src中的图片地址对英文字母大小写敏感，必须确认大小写对得上；
2.图片大小问题。本地图片要小于10KB才能顺利在真机上显示。
为什么图片只在本地调试的时候显示，手机预览和发布后 图片都不显示了！
微信小程序中，图片名不能出现中文，图片路径不能出现中文。
之前用户未授权过时，调用wx.getUserInfo会调出授权框；但现在在用户未授权过时调用该接口，会直接走fail方法。
要使用上述button来请求用户授权。
复制代码
1
2
<button open-type="getUserInfo"></button>
复制代码复制代码
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
<button wx:if="{{canIUse}}"
open-type="getUserInfo"
bindgetuserinfo="bindGetUserInfo">授权登录</button>
<view wx:else>请升级微信版本</view>
index.js
Page({
data: {
//判断小程序的API，回调，参数，组件等是否在当前版本可用。
canIUse: wx.canIUse('button.open-type.getUserInfo')
},
onLoad: function() {
// 查看是否授权
wx.getSetting({
success: function(res){
if (res.authSetting['scope.userInfo']) {
wx.getUserInfo({
success: function(res) {
console.log(res.userInfo)
//用户已经授权过
}
})
}
}
})
},
bindGetUserInfo: function(e) {
console.log(e.detail.userInfo)
if (e.detail.userInfo){
//用户按了允许授权按钮
} else {
//用户按了拒绝按钮
}
}
})
复制代码官方宣布，如果提审的小程序出现「启动即要求授权」和「强制要求授权」的情况，将会无法通过审核。
button 组件的 open-type 属性赋予了新的有效值 getUserInfo
复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
// 加载微信用户信息
// wx.getUserInfo({
//
success: res => {
//
console.log("wx获取 用户信息", res.userInfo);
//
wx.setStorageSync("avatarUrl", res.userInfo.avatarUrl);
//
wx.setStorageSync("nickName", res.userInfo.nickName);
//
}
// });
复制代码复制代码
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
wx.request({
url: 'http://',
method: 'POST',
header: {
Authorization: "Basic ",
'Content-Type': 'application/x-www-form-urlencoded', // 默认值
},
data: {
mobile: 'w@' + res.code,
grant_type: 'mobile',
},
success: function(res) {
console.log("button 成功", res.data);
console.log("button token 成功", res.data.access_token);
wx.setStorageSync("token", res.data.access_token);
wx.showModal({
title: '提示',
content: '模态弹窗',
success: function(res) {
if (res.confirm) {
console.log('用户点击确定')
} else {
console.log('用户点击取消')
}
}
})
复制代码复制代码
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
onLoad: function () {
var that = this;
if (app.globalData.userInfo) {
this.setData({
userInfo: app.globalData.userInfo
})
} else if (this.data.canIUse) {
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
app.userInfoReadyCallback = res => {
this.setData({
userInfo: res.userInfo
})
}
} else {
// 在没有 open-type=getUserInfo 版本的兼容处理
wx.getUserInfo({
success: res => {
app.globalData.userInfo = res.userInfo
this.setData({
userInfo: res.userInfo
})
that.checkSettingStatu();
},
fail: function () {
wx.showModal({
title: '用户未授权',
content: '如需正常使用该小程序功能，请按确定并在授权管理中选中“用户信息”，然后点按确定。最后再重新进入小程序即可正常使用。',
showCancel: false,
success: function (resbtn) {
if (resbtn.confirm) {
wx.openSetting({
success: function success(resopen) {
//
获取用户数据
that.checkSettingStatu();
}
});
}
}
})
}
})
}
}
// onload里面调用授权
复制代码复制代码
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
checkSettingStatu: function (cb) {
var that = this;
// 判断是否是第一次授权，非第一次授权且授权失败则进行提醒
wx.getSetting({
success: function success(res) {
var authSetting = res.authSetting;
if (isEmptyObject(authSetting)) {
//第一次
} else {
// 没有授权的提醒
if (authSetting['scope.userInfo'] === false) {
wx.showModal({
title: '用户未授权',
content: '如需正常使用该小程序功能，请按确定并在授权管理中选中“用户信息”，然后点按确定。最后再重新进入小程序即可正常使用。',
showCancel: false,
success: function (res) {
if (res.confirm) {
wx.openSetting({
success: function success(res) {
console.log()
}
});
}
}
})
} else if (authSetting['scope.userInfo'] === true) {
//该处用户获取用户的一些授权信息
if (that.data.userInfo) {
var nickname = that.data.userInfo.nickName;
var gender = that.data.userInfo.gender
//性别 0：未知、1：男、2：女
if (gender == 1) {
gender = "True"
} else if (gender == 2) {
gender = "False"
} else {
gender = "True"
}
}
}
}
}
})
}
// 用于检测 当前授权的状态
复制代码简单的获取信息用于显示
复制代码
1
2
3
<open-data type="userNickName"></open-data>
<open-data type="userAvatarUrl"></open-data>
复制代码复制代码
1
2
<button open-type="getUserInfo">
复制代码获取用户信息
在页面加载后调用wx.getSetting方法可以获取当前用户的设置
复制代码
1
2
3
4
5
6
7
8
9
10
11
12
wx.showModal({
title: '提示',
content: '模态弹窗',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
}else{
console.log('用户点击取消')
}
}
})
复制代码新的调整之后 这个wx.getUserInfo（）便不再出现授权弹窗了，需要使用button做引导~
复制代码
1
2
3
<button wx:if="{{canIUse}}" open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">授权登录</button>
<view wx:else>请升级微信版本</view>
复制代码复制代码
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
//js
Page({
data: {
canIUse: wx.canIUse('button.open-type.getUserInfo')
},
onLoad: function() {
// 查看是否授权
wx.getSetting({
success: function(res){
if (res.authSetting['scope.userInfo']) {
// 已经授权，可以直接调用 getUserInfo 获取头像昵称
wx.getUserInfo({
success: function(res) {
console.log(res.userInfo)
}
})
}
}
})
},
bindGetUserInfo: function(e) {
console.log(e.detail.userInfo)
}
})
复制代码复制代码
1
2
3
4
<!-- 如果只是展示用户头像昵称，可以使用 <open-data /> 组件 -->
<open-data type="userAvatarUrl"></open-data>
<open-data type="userNickName"></open-data>
复制代码复制代码
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
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
//index.js
//获取应用实例
const app = getApp()
Page({
data: {
motto: 'Hello World',
userInfo: {},
hasUserInfo: false,
getUserInfoFail:false,
canIUse: wx.canIUse('button.open-type.getUserInfo')
},
//事件处理函数
bindViewTap: function() {
wx.navigateTo({
url: '../logs/logs'
})
},
onShow:function(){
this.login();
},
onLoad: function () {
if (app.globalData.userInfo) {
console.log(1)
this.setData({
userInfo: app.globalData.userInfo,
hasUserInfo: true
})
} else if (this.data.canIUse){
console.log(2)
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
app.userInfoReadyCallback = res => {
console.log(12)
app.globalData.userInfo = res.userInfo
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
} else {
console.log(3)
// 在没有 open-type=getUserInfo 版本的兼容处理
wx.getUserInfo({
success: res => {
app.globalData.userInfo = res.userInfo
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
},
fail:res=>{
console.log(4);
this.setData({
getUserInfoFail:true
})
}
})
}
},
getUserInfo: function(e) {
console.log(5);
console.log(e)
if(e.detail.userInfo){
app.globalData.userInfo = e.detail.userInfo
this.setData({
userInfo: e.detail.userInfo,
hasUserInfo: true
})
}else{
this.openSetting();
}
},
login: function () {
console.log(111)
var that = this
// if (typeof success == "function") {
//
console.log(6);
//
console.log('success');
//
this.data.getUserInfoSuccess = success
// }
wx.login({
success: function (res) {
var code = res.code;
console.log(code);
wx.getUserInfo({
success: function (res) {
console.log(7);
app.globalData.userInfo = res.userInfo
that.setData({
getUserInfoFail: false,
userInfo: res.userInfo,
hasUserInfo: true
})
//平台登录
},
fail: function (res) {
console.log(8);
console.log(res);
that.setData({
getUserInfoFail: true
})
}
})
}
})
},
//跳转设置页面授权
openSetting: function () {
var that = this
if (wx.openSetting) {
wx.openSetting({
success: function (res) {
console.log(9);
//尝试再次登录
that.login()
}
})
} else {
console.log(10);
wx.showModal({
title: '授权提示',
content: '小程序需要您的微信授权才能使用哦~ 错过授权页面的处理方法：删除小程序->重新搜索进入->点击授权按钮'
})
}
}
})
复制代码最后
以上就是喜悦热狗最近收集整理的关于解决微信小程序登录与发布的一些问题的全部内容，更多相关解决微信小程序登录与发布内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。
发表评论 取消回复