wechatLogin.vue 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. <template>
  2. <view>
  3. <u-toast ref="uToast" />
  4. </view>
  5. </template>
  6. <script>
  7. import getUrlParams from './../../utils/getUrlParams.js';
  8. export default {
  9. data() {
  10. return {
  11. backUrl: '',
  12. code: ''
  13. };
  14. },
  15. onLoad(page) {
  16. let local = location.href;
  17. let locationLocaturl = location.search;
  18. // 微信返回的回调地址
  19. let backUrl = local.split('backUrl=')[1];
  20. if (backUrl) {
  21. this.backUrl = decodeURIComponent(backUrl);
  22. }
  23. console.log('backUrl', decodeURIComponent(backUrl));
  24. let code = getUrlParams(locationLocaturl, 'code');
  25. console.log('code', code);
  26. if (code) {
  27. this.code = code;
  28. let wechatLoginKey = localStorage.getItem('wechatLoginKey')
  29. if (wechatLoginKey) {
  30. wechatLoginKey = JSON.parse(wechatLoginKey);
  31. if (code === wechatLoginKey.code) {
  32. this.getToken(wechatLoginKey.openId);
  33. } else {
  34. this.handleGetWXInfo(this.code);
  35. }
  36. } else {
  37. this.handleGetWXInfo(this.code);
  38. }
  39. } else {
  40. location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${this.config.wxAppid}&redirect_uri=${encodeURIComponent(
  41. local
  42. )}&response_type=code&scope=snsapi_userinfo&state=STATE&connect_redirect=1#wechat_redirect`;
  43. }
  44. },
  45. methods: {
  46. // 通过code获取 openId等用户信息
  47. handleGetWXInfo(code) {
  48. uni.showLoading({
  49. title: '加载中'
  50. });
  51. this.$u.api
  52. .getWXInfo(code)
  53. .then((res) => {
  54. if (res.code === 200) {
  55. this.$u.vuex('vuex_wxinfo', res.data);
  56. localStorage.setItem('wechatLoginKey', JSON.stringify({
  57. code,
  58. openId: res.data.openId
  59. }))
  60. this.getToken(res.data.openId);
  61. } else {
  62. this.$refs.uToast.show({
  63. title: res.msg || '获取用户信息失败!',
  64. type: 'error'
  65. });
  66. uni.hideLoading();
  67. }
  68. })
  69. .catch((err) => {
  70. uni.hideLoading();
  71. });
  72. },
  73. /**
  74. * 通过openId获取token
  75. * @param {Object} openId
  76. */
  77. getToken(openId) {
  78. this.$u.api.codeV2Api.sendSmsCodeV2api({
  79. openId
  80. }).then((res) => {
  81. if (res.code === 200) {
  82. this.$u.vuex('vuex_token', res.data.accessToken);
  83. this.$u.vuex('vuex_hasLogin', true);
  84. if (res.data.needVerify) {
  85. localStorage.setItem('backUrl', this.backUrl);
  86. this.$u.route({
  87. url: 'pages/center/phoneLogin/phoneLogin'
  88. });
  89. } else {
  90. this.$u.vuex('vuex_user', res.data);
  91. if (this.backUrl.indexOf('wechatLogin') > (-1)) {
  92. location.href = '/'
  93. } else {
  94. location.href = this.backUrl;
  95. }
  96. }
  97. uni.hideLoading();
  98. } else {
  99. this.$refs.uToast.show({
  100. title: res.msg || '获取用户信息失败!',
  101. type: 'error'
  102. });
  103. uni.hideLoading();
  104. }
  105. });
  106. }
  107. }
  108. };
  109. </script>
  110. <style></style>