Commit 0828d0a9062436681538a6b637cf23fc6200955e
1 parent
68d55e91
Exists in
dev
feat:微信静默登录
Showing
5 changed files
with
241 additions
and
178 deletions
Show diff stats
frontend/app-user/api/login.js
@@ -83,7 +83,7 @@ export function getUserInfo(params) { | @@ -83,7 +83,7 @@ export function getUserInfo(params) { | ||
83 | }) | 83 | }) |
84 | } | 84 | } |
85 | 85 | ||
86 | - | 86 | +// 微信获取openid |
87 | export function getWechatOpenId(code) { | 87 | export function getWechatOpenId(code) { |
88 | return request({ | 88 | return request({ |
89 | 'url': '/sso/weixinPublic?code=' + code, | 89 | 'url': '/sso/weixinPublic?code=' + code, |
@@ -91,7 +91,13 @@ export function getWechatOpenId(code) { | @@ -91,7 +91,13 @@ export function getWechatOpenId(code) { | ||
91 | }) | 91 | }) |
92 | } | 92 | } |
93 | 93 | ||
94 | - | 94 | +// 绑定openid |
95 | +export function bindOpenId(params) { | ||
96 | + return request({ | ||
97 | + 'url': `/api/user/v1/user/bindOpenId?account=${params.account}&openid=${params.openId}`, | ||
98 | + 'method': 'get' | ||
99 | + }) | ||
100 | +} | ||
95 | 101 | ||
96 | 102 | ||
97 | // 获取短信验证码 | 103 | // 获取短信验证码 |
@@ -149,5 +155,6 @@ export default { | @@ -149,5 +155,6 @@ export default { | ||
149 | getPublicKey, | 155 | getPublicKey, |
150 | changUserPsd, | 156 | changUserPsd, |
151 | forgotPassword, | 157 | forgotPassword, |
152 | - getWechatOpenId | 158 | + getWechatOpenId, |
159 | + bindOpenId | ||
153 | } | 160 | } |
frontend/app-user/common/config.js
1 | module.exports = { | 1 | module.exports = { |
2 | - baseUrl: 'http://192.168.0.48:60011/api', //lst本地 | ||
3 | - // baseUrl: 'https://lpg.ip-server.cn/api', //会员端线上 | 2 | + // baseUrl: 'http://192.168.0.48:60011/api', //lst本地 |
4 | // baseUrl: 'http://123.60.140.65:60011/api',// 会员端ip | 3 | // baseUrl: 'http://123.60.140.65:60011/api',// 会员端ip |
4 | + baseUrl: 'https://lpg.ip-server.cn/api', //会员端线上 | ||
5 | gaodeMapKey: "ec36eed040d5dad959e19711b83905d6", //高德逆地址解析key | 5 | gaodeMapKey: "ec36eed040d5dad959e19711b83905d6", //高德逆地址解析key |
6 | // 超时 | 6 | // 超时 |
7 | timeout: 30000, | 7 | timeout: 30000, |
8 | // 禁用 Cookie 等信息 | 8 | // 禁用 Cookie 等信息 |
9 | withCredentials: false, | 9 | withCredentials: false, |
10 | isOpenTokenExpiration: false, //token过期弹窗 | 10 | isOpenTokenExpiration: false, //token过期弹窗 |
11 | + appid:'wxb619394476ca1888', | ||
11 | header: { | 12 | header: { |
12 | //租户ID | 13 | //租户ID |
13 | 'tenant-id': 1 | 14 | 'tenant-id': 1 |
frontend/app-user/pages/jump/weChatOffAcc.vue
1 | <template> | 1 | <template> |
2 | - <view class="container"> | ||
3 | - <div>微信公众号-授权认证中</div> | ||
4 | - </view> | 2 | + <view class="container"> |
3 | + <div>微信公众号-授权认证中</div> | ||
4 | + </view> | ||
5 | </template> | 5 | </template> |
6 | 6 | ||
7 | <script> | 7 | <script> |
8 | - | ||
9 | -const {Base64} = require('js-base64'); | ||
10 | -export default { | ||
11 | - data() { | ||
12 | - return { | ||
13 | - currentModeIndex: 2, //1账号密码 2验证码 3忘记密码 | ||
14 | - inputType: 'password', | ||
15 | - codeDisabled: false, | ||
16 | - codeTips: '', | ||
17 | - formData: { | ||
18 | - mobile: '', | ||
19 | - password: '', | ||
20 | - }, | ||
21 | - flag: true, | ||
22 | - rules: { | ||
23 | - mobile: [{ | ||
24 | - type: 'string', | ||
25 | - required: true, | ||
26 | - message: '请输入手机号', | ||
27 | - trigger: ['blur', 'change'] | ||
28 | - }, | ||
29 | - // { | ||
30 | - // // 自定义验证函数,见上说明 | ||
31 | - // validator: (rule, value, callback) => { | ||
32 | - // // 上面有说,返回true表示校验通过,返回false表示不通过 | ||
33 | - // // uni.$u.test.mobile()就是返回true或者false的 | ||
34 | - // return uni.$u.test.mobile(value) | ||
35 | - // }, | ||
36 | - // message: '手机号码不正确', | ||
37 | - // // 触发器可以同时用blur和change | ||
38 | - // trigger: ['change', 'blur'] | ||
39 | - // } | ||
40 | - ], | ||
41 | - password: { | ||
42 | - type: 'string', | ||
43 | - min: 4, | ||
44 | - max: 16, | ||
45 | - required: true, | ||
46 | - message: '密码长度4-16位密码', | ||
47 | - trigger: ['blur', 'change'] | ||
48 | - }, | ||
49 | - code: { | ||
50 | - type: 'integer', | ||
51 | - len: 4, | ||
52 | - required: true, | ||
53 | - message: '请填写4位验证码', | ||
54 | - trigger: ['blur', 'change'] | ||
55 | - } | ||
56 | - }, | ||
57 | - isAutoLogin: [], //是否自动登录 | ||
58 | - hasForgot: false, //忘记密码 | ||
59 | - loginText: "短信登录", | ||
60 | - btnText: "发送验证码", | ||
61 | - checkValue: ['agree'], | ||
62 | - accountTile: "短信验证码登录", | ||
63 | - accountTip: "未注册手机号登录后自动生成账号", | ||
64 | - accountPlaceholder: "请输入手机号", | ||
65 | - appid: this.$config.appid, | ||
66 | - openId: null | ||
67 | - } | ||
68 | - }, | ||
69 | - created() { | ||
70 | - this.handleAuthorization(); | ||
71 | - }, | ||
72 | - methods: { | ||
73 | - handleAuthorization() { | ||
74 | - console.log("================================"); | ||
75 | - this.code = ""; | ||
76 | - let local = window.location.href; | ||
77 | - console.log("local", local); | ||
78 | - console.log("this.code", this.code); | ||
79 | - let scope = "snsapi_base"; //静默授权 用户无感知 | ||
80 | - console.log("this.scope", scope); | ||
81 | - this.code = this.getUrlCode().code; | ||
82 | - console.log("this.code", this.code); | ||
83 | - | ||
84 | - this.getOpenId(this.code); | ||
85 | - console.log("================================"); | ||
86 | - }, | ||
87 | - getOpenId(code) { | ||
88 | - let that = this; | ||
89 | - this.$api.loginApi.getWechatOpenId(code).then(res => { | ||
90 | - console.log("11111that.res ", res); | ||
91 | - if (res.status == 1000) { | ||
92 | - that.openId = res.data.openId; | ||
93 | - console.log("that.openId ", that.openId); | ||
94 | - } else { | ||
95 | - Toast(res.message); | ||
96 | - } | ||
97 | - }); | ||
98 | - | ||
99 | - }, | ||
100 | - getUrlCode() { | ||
101 | - let fullUrl = window.location.href; | ||
102 | - console.log("fullUrl ", fullUrl); | ||
103 | - let theRequest = new Object(); | ||
104 | - if (fullUrl.indexOf("?") != -1) { | ||
105 | - var temp = fullUrl.split("?"); | ||
106 | - let str = temp[1]; | ||
107 | - let strs = str.split("&"); | ||
108 | - for (var i = 0; i < strs.length; i++) { | ||
109 | - theRequest[strs[i].split("=")[0]] = strs[i].split("=")[1]; | ||
110 | - } | ||
111 | - } | ||
112 | - return theRequest; | ||
113 | - }, | ||
114 | - } | ||
115 | -}; | 8 | + const { |
9 | + Base64 | ||
10 | + } = require('js-base64'); | ||
11 | + export default { | ||
12 | + data() { | ||
13 | + return { | ||
14 | + currentModeIndex: 2, //1账号密码 2验证码 3忘记密码 | ||
15 | + inputType: 'password', | ||
16 | + codeDisabled: false, | ||
17 | + codeTips: '', | ||
18 | + formData: { | ||
19 | + mobile: '', | ||
20 | + password: '', | ||
21 | + }, | ||
22 | + flag: true, | ||
23 | + rules: { | ||
24 | + mobile: [{ | ||
25 | + type: 'string', | ||
26 | + required: true, | ||
27 | + message: '请输入手机号', | ||
28 | + trigger: ['blur', 'change'] | ||
29 | + }, | ||
30 | + // { | ||
31 | + // // 自定义验证函数,见上说明 | ||
32 | + // validator: (rule, value, callback) => { | ||
33 | + // // 上面有说,返回true表示校验通过,返回false表示不通过 | ||
34 | + // // uni.$u.test.mobile()就是返回true或者false的 | ||
35 | + // return uni.$u.test.mobile(value) | ||
36 | + // }, | ||
37 | + // message: '手机号码不正确', | ||
38 | + // // 触发器可以同时用blur和change | ||
39 | + // trigger: ['change', 'blur'] | ||
40 | + // } | ||
41 | + ], | ||
42 | + password: { | ||
43 | + type: 'string', | ||
44 | + min: 4, | ||
45 | + max: 16, | ||
46 | + required: true, | ||
47 | + message: '密码长度4-16位密码', | ||
48 | + trigger: ['blur', 'change'] | ||
49 | + }, | ||
50 | + code: { | ||
51 | + type: 'integer', | ||
52 | + len: 4, | ||
53 | + required: true, | ||
54 | + message: '请填写4位验证码', | ||
55 | + trigger: ['blur', 'change'] | ||
56 | + } | ||
57 | + }, | ||
58 | + isAutoLogin: [], //是否自动登录 | ||
59 | + hasForgot: false, //忘记密码 | ||
60 | + loginText: "短信登录", | ||
61 | + btnText: "发送验证码", | ||
62 | + checkValue: ['agree'], | ||
63 | + accountTile: "短信验证码登录", | ||
64 | + accountTip: "未注册手机号登录后自动生成账号", | ||
65 | + accountPlaceholder: "请输入手机号", | ||
66 | + appid: this.$config.appid, | ||
67 | + openId: null | ||
68 | + } | ||
69 | + }, | ||
70 | + created() { | ||
71 | + this.handleAuthorization(); | ||
72 | + }, | ||
73 | + methods: { | ||
74 | + handleAuthorization() { | ||
75 | + console.log("================================"); | ||
76 | + this.code = ""; | ||
77 | + console.log("window.location.href", window.location.href); | ||
78 | + let local = window.location.href; | ||
79 | + console.log("local", local); | ||
80 | + let scope = "snsapi_base"; //静默授权 用户无感知 | ||
81 | + console.log("this.scope", scope); | ||
82 | + this.code = this.getParameters('code'); | ||
83 | + console.log("this.code", this.code); | ||
84 | + let jumpToUri = | ||
85 | + `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${this.$config.appid}&redirect_uri=${encodeURIComponent(local)}&response_type=code&scope=${scope}&state=hotent#wechat_redirect` | ||
86 | + console.log("jumpToUri", jumpToUri); | ||
87 | + // var redirect_uri = decodeURIComponent(this.getParameters("redirect")); | ||
88 | + // console.log("redirect_uri", redirect_uri); | ||
89 | + // if (redirect_uri) {} else { | ||
90 | + // } | ||
91 | + if (this.code == null || this.code === "") { | ||
92 | + window.location.href = jumpToUri; | ||
93 | + } else { | ||
94 | + this.getOpenId(this.code); | ||
95 | + } | ||
96 | + console.log("this.code", this.code); | ||
97 | + // this.getOpenId(this.code); | ||
98 | + console.log("================================"); | ||
99 | + }, | ||
100 | + getOpenId(code) { | ||
101 | + let that = this; | ||
102 | + this.$api.loginApi.getWechatOpenId(code).then(res => { | ||
103 | + console.log("res", res); | ||
104 | + if (res.openid) { | ||
105 | + that.openId = res.openid; | ||
106 | + //首次登录未绑定账号去登录页登录后触发绑定 | ||
107 | + console.log("获取openId", that.openId); | ||
108 | + uni.setStorageSync('openId', this.openId) | ||
109 | + uni.navigateTo({ | ||
110 | + url:'/pages/login' | ||
111 | + }) | ||
112 | + } else { | ||
113 | + //已经绑定直接缓存token 跳转到主页 | ||
114 | + this.$store.dispatch('wxAuthLogin', res).then(e => { | ||
115 | + uni.switchTab({ | ||
116 | + url: '/pages/home/home' | ||
117 | + }); | ||
118 | + }).catch(err => { | ||
119 | + uni.$u.toast(err) | ||
120 | + }) | ||
121 | + } | ||
122 | + }); | ||
123 | + }, | ||
124 | + getUrlCode() { | ||
125 | + let fullUrl = window.location.href; | ||
126 | + console.log("fullUrl ", fullUrl); | ||
127 | + let theRequest = new Object(); | ||
128 | + if (fullUrl.indexOf("?") != -1) { | ||
129 | + var temp = fullUrl.split("?"); | ||
130 | + let str = temp[1]; | ||
131 | + let strs = str.split("&"); | ||
132 | + for (var i = 0; i < strs.length; i++) { | ||
133 | + theRequest[strs[i].split("=")[0]] = strs[i].split("=")[1]; | ||
134 | + } | ||
135 | + } | ||
136 | + return theRequest; | ||
137 | + }, | ||
138 | + //获取url中的参数 | ||
139 | + getParameters(name) { | ||
140 | + var locUrl = decodeURI(window.location.search.substr(1)) | ||
141 | + var aryParams = locUrl.split('&') | ||
142 | + var rtn = '' | ||
143 | + for (var i = 0; i < aryParams.length; i++) { | ||
144 | + var pair = aryParams[i] | ||
145 | + var aryEnt = pair.split('=') | ||
146 | + var key = aryEnt[0] | ||
147 | + var val = aryEnt[1] | ||
148 | + if (key != name) continue | ||
149 | + if (rtn == '') { | ||
150 | + rtn = val | ||
151 | + } else { | ||
152 | + rtn += ',' + val | ||
153 | + } | ||
154 | + } | ||
155 | + return rtn | ||
156 | + }, | ||
157 | + }, | ||
158 | + }; | ||
116 | </script> | 159 | </script> |
117 | 160 | ||
118 | <style lang="scss" scoped> | 161 | <style lang="scss" scoped> |
119 | -.container { | ||
120 | - display: flex; | ||
121 | - justify-content: center; | ||
122 | - align-items: center; | ||
123 | - height: 100vh; | ||
124 | -} | ||
125 | -</style> | 162 | + .container { |
163 | + display: flex; | ||
164 | + justify-content: center; | ||
165 | + align-items: center; | ||
166 | + height: 100vh; | ||
167 | + } | ||
168 | +</style> | ||
126 | \ No newline at end of file | 169 | \ No newline at end of file |
frontend/app-user/pages/login.vue
@@ -191,64 +191,56 @@ | @@ -191,64 +191,56 @@ | ||
191 | }, 1000) | 191 | }, 1000) |
192 | } | 192 | } |
193 | // #endif | 193 | // #endif |
194 | - console.log(this.appid); | ||
195 | - // 微信公众号自动登录(暂不做) | ||
196 | - // let isWechatBrowser = this.isWechatBrowser(); | ||
197 | - // if (isWechatBrowser) { | ||
198 | - // // console.log("微信浏览器环境", process); | ||
199 | - // let openId = uni.getStorageSync("openId"); | ||
200 | - // var that = this; | ||
201 | - // if (!openId) { | ||
202 | - // this.getWxCode(); | ||
203 | - // } else { | ||
204 | - // this.openId = openId; | ||
205 | - // } | ||
206 | - // } | 194 | + console.log("appid", this.appid); |
195 | + let isWechatBrowser = this.isWechatBrowser(); | ||
196 | + this.openId = uni.getStorageSync("openId"); | ||
197 | + console.log("openId", this.openId); | ||
198 | + if (isWechatBrowser) { | ||
199 | + if (!this.openId) { | ||
200 | + uni.reLaunch({ | ||
201 | + url: '/pages/jump/weChatOffAcc' | ||
202 | + }) | ||
203 | + } | ||
204 | + } | ||
207 | }, | 205 | }, |
208 | onReady() { | 206 | onReady() { |
209 | // 如果需要兼容微信小程序,并且校验规则中含有方法等,只能通过setRules方法设置规则 | 207 | // 如果需要兼容微信小程序,并且校验规则中含有方法等,只能通过setRules方法设置规则 |
210 | this.$refs.form.setRules(this.rules) | 208 | this.$refs.form.setRules(this.rules) |
211 | }, | 209 | }, |
212 | methods: { | 210 | methods: { |
213 | - //获取code | ||
214 | - getWxCode() { | ||
215 | - this.code = ""; | ||
216 | - let local = window.location.href; | ||
217 | - console.log(local); | ||
218 | - console.log(this.code); | ||
219 | - let scope = "snsapi_base"; //静默授权 用户无感知 | ||
220 | - this.code = this.getUrlCode().code; | ||
221 | - if (this.code == null || this.code === "") { | ||
222 | - console.log(123); | ||
223 | - window.location.href = | ||
224 | - `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${this.appid}&redirect_uri=${encodeURIComponent(local)}&response_type=code&scope=${scope}#wechat_redirect`; | ||
225 | - } else { | ||
226 | - this.getOpenId(this.code); | 211 | + //是否有openid |
212 | + hasOpenId() { | ||
213 | + this.openId = uni.getStorageSync('openId'); | ||
214 | + console.log("有openid", this.openId); | ||
215 | + if (this.openId) { | ||
216 | + this.bindWxOffAcc(this.openId) | ||
217 | + // 默认静默绑定 | ||
218 | + // this.$modal.confirm('是否绑定公众号,以便下次免登录', '温馨提示', ) | ||
219 | + // .then(() => { | ||
220 | + // this.bindWxOffAcc(this.openId) | ||
221 | + // }) | ||
222 | + // .catch(() => { | ||
223 | + // console.log("不绑定"); | ||
224 | + // uni.removeStorageSync('openId'); | ||
225 | + // uni.switchTab({ | ||
226 | + // url: '/pages/home/home' | ||
227 | + // }); | ||
228 | + // }) | ||
227 | } | 229 | } |
228 | }, | 230 | }, |
229 | - getUrlCode() { | ||
230 | - let fullUrl = window.location.href; | ||
231 | - let theRequest = new Object(); | ||
232 | - if (fullUrl.indexOf("?") != -1) { | ||
233 | - var temp = fullUrl.split("?"); | ||
234 | - let str = temp[1]; | ||
235 | - let strs = str.split("&"); | ||
236 | - for (var i = 0; i < strs.length; i++) { | ||
237 | - theRequest[strs[i].split("=")[0]] = strs[i].split("=")[1]; | ||
238 | - } | ||
239 | - } | ||
240 | - return theRequest; | ||
241 | - }, | ||
242 | - getOpenId(code) { | ||
243 | - let that = this; | ||
244 | - this.$api.loginApi.getWechatOpenId(code).then(res => { | ||
245 | - if (res.status == 1000) { | ||
246 | - that.openId = res.data.openId; | ||
247 | - uni.setStorageSync("openId", that.openId); | ||
248 | - } else { | ||
249 | - Toast(res.message); | 231 | + bindWxOffAcc(openId) { |
232 | + this.$api.loginApi.bindOpenId({ | ||
233 | + account: this.formData.mobile, | ||
234 | + openId | ||
235 | + }).then((res) => { | ||
236 | + if (res.state) { | ||
237 | + // 绑定成功 | ||
238 | + uni.removeStorageSync('openId'); | ||
239 | + uni.switchTab({ | ||
240 | + url: '/pages/home/home' | ||
241 | + }); | ||
250 | } | 242 | } |
251 | - }); | 243 | + }) |
252 | }, | 244 | }, |
253 | isWechatBrowser() { | 245 | isWechatBrowser() { |
254 | return /MicroMessenger/i.test(navigator.userAgent); | 246 | return /MicroMessenger/i.test(navigator.userAgent); |
@@ -413,15 +405,21 @@ | @@ -413,15 +405,21 @@ | ||
413 | this.$store.dispatch('Login', data).then(res => { | 405 | this.$store.dispatch('Login', data).then(res => { |
414 | this.$modal.closeLoading(); | 406 | this.$modal.closeLoading(); |
415 | setTimeout(() => { | 407 | setTimeout(() => { |
416 | - uni.$u.toast('登录成功'); | 408 | + // uni.$u.toast('登录成功'); |
417 | uni.setStorageSync('myAvatorImg', ''); | 409 | uni.setStorageSync('myAvatorImg', ''); |
418 | - uni.switchTab({ | ||
419 | - url: '/pages/home/home' | ||
420 | - }); | ||
421 | - | 410 | + // 只在微信浏览器环境生效并去绑定openid |
411 | + if (this.isWechatBrowser()) { | ||
412 | + this.hasOpenId(); | ||
413 | + }else{ | ||
414 | + // 非微信环境登录直接进入主页 | ||
415 | + uni.switchTab({ | ||
416 | + url: '/pages/home/home' | ||
417 | + }); | ||
418 | + } | ||
422 | }, 300) | 419 | }, 300) |
423 | }).catch(err => { | 420 | }).catch(err => { |
424 | - // uni.$u.toast(err) | 421 | + console.log("err", err); |
422 | + uni.$u.toast(err.msg) | ||
425 | }) | 423 | }) |
426 | } | 424 | } |
427 | } | 425 | } |
frontend/app-user/store/modules/user.js
@@ -160,6 +160,20 @@ const user = { | @@ -160,6 +160,20 @@ const user = { | ||
160 | }) | 160 | }) |
161 | }) | 161 | }) |
162 | }, | 162 | }, |
163 | + wxAuthLogin({ | ||
164 | + commit | ||
165 | + }, userInfo) { | ||
166 | + return new Promise((resolve, reject) => { | ||
167 | + console.log("微信userInfo",userInfo); | ||
168 | + if(userInfo.token){ | ||
169 | + setToken(userInfo.token); | ||
170 | + commit('SET_TOKEN', userInfo.token) | ||
171 | + resolve() | ||
172 | + }else{ | ||
173 | + reject('No Token') | ||
174 | + } | ||
175 | + }) | ||
176 | + }, | ||
163 | SetAdsName({ | 177 | SetAdsName({ |
164 | commit | 178 | commit |
165 | }, data) { | 179 | }, data) { |