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 | 83 | }) |
84 | 84 | } |
85 | 85 | |
86 | - | |
86 | +// 微信获取openid | |
87 | 87 | export function getWechatOpenId(code) { |
88 | 88 | return request({ |
89 | 89 | 'url': '/sso/weixinPublic?code=' + 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 | 155 | getPublicKey, |
150 | 156 | changUserPsd, |
151 | 157 | forgotPassword, |
152 | - getWechatOpenId | |
158 | + getWechatOpenId, | |
159 | + bindOpenId | |
153 | 160 | } | ... | ... |
frontend/app-user/common/config.js
1 | 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 | 3 | // baseUrl: 'http://123.60.140.65:60011/api',// 会员端ip |
4 | + baseUrl: 'https://lpg.ip-server.cn/api', //会员端线上 | |
5 | 5 | gaodeMapKey: "ec36eed040d5dad959e19711b83905d6", //高德逆地址解析key |
6 | 6 | // 超时 |
7 | 7 | timeout: 30000, |
8 | 8 | // 禁用 Cookie 等信息 |
9 | 9 | withCredentials: false, |
10 | 10 | isOpenTokenExpiration: false, //token过期弹窗 |
11 | + appid:'wxb619394476ca1888', | |
11 | 12 | header: { |
12 | 13 | //租户ID |
13 | 14 | 'tenant-id': 1 | ... | ... |
frontend/app-user/pages/jump/weChatOffAcc.vue
1 | 1 | <template> |
2 | - <view class="container"> | |
3 | - <div>微信公众号-授权认证中</div> | |
4 | - </view> | |
2 | + <view class="container"> | |
3 | + <div>微信公众号-授权认证中</div> | |
4 | + </view> | |
5 | 5 | </template> |
6 | 6 | |
7 | 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 | 159 | </script> |
117 | 160 | |
118 | 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 | 169 | \ No newline at end of file | ... | ... |
frontend/app-user/pages/login.vue
... | ... | @@ -191,64 +191,56 @@ |
191 | 191 | }, 1000) |
192 | 192 | } |
193 | 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 | 206 | onReady() { |
209 | 207 | // 如果需要兼容微信小程序,并且校验规则中含有方法等,只能通过setRules方法设置规则 |
210 | 208 | this.$refs.form.setRules(this.rules) |
211 | 209 | }, |
212 | 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 | 245 | isWechatBrowser() { |
254 | 246 | return /MicroMessenger/i.test(navigator.userAgent); |
... | ... | @@ -413,15 +405,21 @@ |
413 | 405 | this.$store.dispatch('Login', data).then(res => { |
414 | 406 | this.$modal.closeLoading(); |
415 | 407 | setTimeout(() => { |
416 | - uni.$u.toast('登录成功'); | |
408 | + // uni.$u.toast('登录成功'); | |
417 | 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 | 419 | }, 300) |
423 | 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 | 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 | 177 | SetAdsName({ |
164 | 178 | commit |
165 | 179 | }, data) { | ... | ... |