cxc/yshopb2c-uniapp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

优化登录

Browse Source
This commit is contained in:
Gao xiaosong
2020-06-02 02:34:01 +08:00
parent f80cf2ba2a
commit 0f344a4d7e
4 changed files with 270 additions and 270 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
libs/login.js
View File

@ -4,11 +4,11 @@ import cookie from "@/utils/store/cookie";
import {
isWeixin,
login,
replaceLogin,
getCurrentPageUrl,
getCurrentPageUrlWithArgs,
parseQuery,
replace,
routerPermissions,
handleQrCode
} from "@/utils";
@ -41,11 +41,11 @@ export default function toLogin(push, backUrl) {
})
} else {
console.log('是扫描的砍价海报进来的,但是没有获取到参数')
replaceLogin()
routerPermissions()
}
} else {
console.log('无特殊情况，重新登录')
replaceLogin()
routerPermissions()
}
store.commit("UPDATE_AUTHORIZATION", false);
store.commit("UPDATE_AUTHORIZATIONPAGE", true);

21
pages/Loading/index.vue
View File

@ -43,22 +43,23 @@ export default {
}
cookie.get("spread");
// this.toLaunch();
if (this.$deviceType == 'app') {
// this.toLaunch();
this.$yrouter.switchTab({
path: '/pages/home/index',
});
return
if (this.$deviceType == "app") {
// this.toLaunch();
this.$yrouter.switchTab({
path: "/pages/home/index"
});
return;
}
login({
fail: () => {
this.toLaunch();
}
login().finally(() => {
this.$yrouter.switchTab({
path: "/pages/home/index"
});
});
},
methods: {
...mapActions(["changeAuthorization", "setUserInfo"]),
toLaunch() {
console.log("loading home");
this.changeAuthorization(false);
this.$yrouter.switchTab({
path: "/pages/home/index"

327
pages/authorization/index.vue
View File

@ -1,211 +1,218 @@
<template>
<view class="container">
<view v-if="!token">
<!-- 小程序 -->
<view v-if="$deviceType == 'routine'">
<view class="getUserInfo">
<text>您还未允许微信登录授权，请点击下方按钮允许微信授权登录。</text>
<button type="primary" open-type="getUserInfo" @getuserinfo="getUserInfo">允许微信登录授权</button>
<view style="height:20rpx"></view>
<button @click="back">取消微信登录授权</button>
</view>
</view>
<!-- app -->
<view v-if="$deviceType == 'app'">
<view class="getUserInfo">
<text>请先登录</text>
<button type="primary" @click="this.toLogin">去登录</button>
</view>
</view>
</view>
</view>
<view class="container">
<view v-if="!token">
<!-- 小程序 -->
<view v-if="$deviceType == 'routine'">
<view class="getUserInfo">
<text>您还未允许微信登录授权，请点击下方按钮允许微信授权登录。</text>
<button type="primary" open-type="getUserInfo" @getuserinfo="getUserInfo">允许微信登录授权</button>
<view style="height:20rpx"></view>
<button @click="back">取消微信登录授权</button>
</view>
</view>
<!-- app -->
<view v-if="$deviceType == 'app'">
<view class="getUserInfo">
<text>请先登录</text>
<button type="primary" @click="this.toLogin">去登录</button>
</view>
</view>
</view>
</view>
</template>
<script>
import { mapState, mapMutations, mapActions } from 'vuex';
import { mapState, mapMutations, mapActions } from "vuex";
// 组件
// import request from "@//api/request";
import { wxappAuth, getUser } from '@/api/user';
import dayjs from 'dayjs';
import cookie from '@/utils/store/cookie';
import { login } from '@/utils';
import { wxappAuth, getUser } from "@/api/user";
import dayjs from "dayjs";
import cookie from "@/utils/store/cookie";
import { login } from "@/utils";
export default {
data() {
return {
};
},
computed: {
...mapState(['isAuthorization','$deviceType','token'])
},
onShow() {
this.UPDATE_AUTHORIZATIONPAGE(true);
},
onHide() {
this.UPDATE_AUTHORIZATIONPAGE(false);
this.changeAuthorization(false);
},
onUnload() {
this.UPDATE_AUTHORIZATIONPAGE(false);
this.changeAuthorization(false);
},
methods: {
...mapActions(['changeAuthorization', 'setUserInfo']),
...mapMutations(['UPDATE_AUTHORIZATIONPAGE', 'CHANGE_TABTAR']),
back() {
this.$yrouter.switchTab({
path: '/pages/home/index',
query: {}
});
},
getUserInfo(data) {
if (data.detail.errMsg == 'getUserInfo:fail auth deny') {
uni.showToast({
title: '取消授权',
icon: 'none',
duration: 2000
});
return;
}
uni.showLoading({
title: '登录中'
});
login({
success: () => {}
});
},
toLogin() {
this.$yrouter.push({
path: '/pages/user/Login/index',
query: {}
});
}
},
onUnload() {},
mounted() {
}
data() {
return {};
},
computed: {
...mapState(["isAuthorization", "$deviceType", "token"])
},
onShow() {
this.UPDATE_AUTHORIZATIONPAGE(true);
},
onHide() {
this.UPDATE_AUTHORIZATIONPAGE(false);
this.changeAuthorization(false);
},
onUnload() {
this.UPDATE_AUTHORIZATIONPAGE(false);
this.changeAuthorization(false);
},
methods: {
...mapActions(["changeAuthorization", "setUserInfo"]),
...mapMutations(["UPDATE_AUTHORIZATIONPAGE", "CHANGE_TABTAR"]),
back() {
this.$yrouter.switchTab({
path: "/pages/home/index",
query: {}
});
},
getUserInfo(data) {
if (data.detail.errMsg == "getUserInfo:fail auth deny") {
uni.showToast({
title: "取消授权",
icon: "none",
duration: 2000
});
return;
}
uni.showLoading({
title: "登录中"
});
login()
.then(res => {
this.$yrouter.replace({ path: cookie.get("redirect") });
})
.catch(error => {
console.log(error);
uni.showToast({
title: "登录失败",
icon: "none",
duration: 2000
});
});
},
toLogin() {
this.$yrouter.push({
path: "/pages/user/Login/index",
query: {}
});
}
},
onUnload() {},
mounted() {}
};
</script>
<style lang="less">
.sp-cell {
height: 20rpx;
height: 20rpx;
}
.getUserInfo {
display: flex;
align-items: center;
flex-direction: column;
padding: 30px;
display: flex;
align-items: center;
flex-direction: column;
padding: 30px;
text {
font-size: 30rpx;
text-align: center;
margin-bottom: 20px;
}
text {
font-size: 30rpx;
text-align: center;
margin-bottom: 20px;
}
}
.container {
flex: 1;
display: flex;
flex-direction: column;
justify-content: flex-start;
position: relative;
flex: 1;
display: flex;
flex-direction: column;
justify-content: flex-start;
position: relative;
}
.tab-bar {
font-size: 0;
display: flex;
align-items: center;
background: rgba(255, 255, 255, 0.9);
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 99;
border-top: 1px solid rgba(248, 248, 248, 1);
font-size: 0;
display: flex;
align-items: center;
background: rgba(255, 255, 255, 0.9);
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 99;
border-top: 1px solid rgba(248, 248, 248, 1);
.tab-bar-item {
flex: 1;
height: 49px;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
.tab-bar-item {
flex: 1;
height: 49px;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
&.active {
text {
color: #ee7559;
}
&.active {
text {
color: #ee7559;
}
.tab-bar-pic {
display: none;
background: #f9f9f9;
.tab-bar-pic {
display: none;
background: #f9f9f9;
&.active {
display: block;
}
}
}
&.active {
display: block;
}
}
}
.tab-bar-pic {
display: block;
background: #f9f9f9;
.tab-bar-pic {
display: block;
background: #f9f9f9;
&.active {
display: none;
}
}
}
&.active {
display: none;
}
}
}
.tab-bar-pic {
width: 25px;
height: 25px;
background: #f9f9f9;
.tab-bar-pic {
width: 25px;
height: 25px;
background: #f9f9f9;
image {
width: 25px;
height: 25px;
}
}
image {
width: 25px;
height: 25px;
}
}
.tab-bar-pic-active {
}
.tab-bar-pic-active {
}
text {
font-size: 10px;
color: rgb(160, 160, 160);
line-height: 10px;
margin-top: 5px;
}
text {
font-size: 10px;
color: rgb(160, 160, 160);
line-height: 10px;
margin-top: 5px;
}
}
.tab-bar-bg {
padding-top: 46px;
width: 100%;
padding-top: 46px;
width: 100%;
}
.view-item {
display: none;
width: 100%;
display: none;
width: 100%;
}
.view-item-active {
display: block;
display: block;
}
.getUserInfo {
display: flex;
align-items: center;
flex-direction: column;
padding: 30px;
display: flex;
align-items: center;
flex-direction: column;
padding: 30px;
p {
margin-bottom: 20px;
}
p {
margin-bottom: 20px;
}
}
._van-dialog {
z-index: 99999999999;
z-index: 99999999999;
}
</style>

186
utils/index.js
View File

@ -109,46 +109,6 @@ export const copyClipboard = (data) => {
})
}
export const replaceLogin = (msg) => {
uni.hideLoading();
console.log('尝试开始重新登录')
uni.showToast({
title: '重新登录中...',
icon: 'none',
duration: 2000
});
// 这里代表已经失去登录状态以及401强制推出登录了
store.commit('LOGOUT')
if (Vue.prototype.$deviceType == 'routine') {
console.log('当前是微信小程序，开始调用登录方法')
// 如果是微信小程序，跳转到授权页
login({
fail: () => {
console.log('自动登录失败，重定向授权页面')
reLaunch({
path: '/pages/authorization/index',
query: {
redirect: `/${getCurrentPageUrl()}`,
...parseQuery()
}
})
}
})
} else {
// 如果不是小程序跳转到登录页
console.log('当前是app，跳转到登录页面')
push({
path: '/pages/user/Login/index',
query: {
redirect: `/${getCurrentPageUrl()}`,
...parseQuery()
}
})
}
}
export const getProvider = (service) => {
return new Promise((resolve, reject) => {
// 获取当前环境的服务商
@ -172,27 +132,26 @@ export const getProvider = (service) => {
export const authorize = (authorizeStr) => {
return new Promise((resolve, reject) => {
console.log('检验授权')
uni.authorize({
scope: `scope.${authorizeStr}`,
success() {
console.log('检验授权____授权成功')
resolve('获取授权成功')
},
fail() {
console.log('授权失败跳转首页')
switchTab({
path: '/pages/home/index',
// query
});
console.log('检验授权____授权失败')
// switchTab({
// path: '/pages/home/index',
// // query
// });
reject('获取授权失败')
}
})
}).catch(error => {
console.log(error)
})
}
export const login = (option) => {
export const login = () => {
console.log('开始登录 ————————————————————')
return new Promise((resolve, reject) => {
console.log('获取环境商')
@ -215,62 +174,48 @@ export const login = (option) => {
success: function (user) {
console.log('获取用户信息成功')
console.log('开始调用登录接口')
if (Vue.prototype.$deviceType == 'routine') {
wxappAuth({
encryptedData: user.encryptedData,
iv: user.iv,
code: code,
spread: cookie.get("spread")
}).then(({
data
}) => {
console.log('登录接口调用成功')
console.log('开始处理登录信息保存，并获取用户详情')
resolve(data)
uni.hideLoading();
store.commit("LOGIN", data.token, dayjs(data.expires_time));
store.dispatch('USERINFO', true)
console.log(store)
handleGetUserInfo()
wxappAuth({
encryptedData: user.encryptedData,
iv: user.iv,
code: code,
spread: cookie.get("spread")
}).then(({ data }) => {
console.log('登录接口调用成功')
console.log('开始处理登录信息保存，并获取用户详情')
uni.hideLoading();
store.commit("LOGIN", data.token, dayjs(data.expires_time));
store.dispatch('USERINFO', true)
getUser().then(user => {
console.log('获取用户信息成功')
store.dispatch('setUserInfo', user.data)
resolve(user)
}).catch(error => {
console.log('登录接口调用失败')
reject()
console.log(error)
handleFail(option, '微信登录失败')
console.log('获取用户信息失败')
reject('获取用户信息失败')
});
}
}).catch(error => {
console.log('登录接口调用失败')
reject('登录接口调用失败')
});
},
fail() {
console.log('获取用户信息失败')
// 获取用户信息失败
reject()
handleFail(option, '获取用户信息失败')
reject('获取用户信息失败')
}
});
}).catch(error => {
console.log('用户未授权')
reject()
console.log(error)
handleFail(option, '用户未授权')
reject('用户未授权')
})
},
fail() {
console.log('调用登录接口失败')
// 调用登录接口失败
reject()
handleFail(option, '登录失败')
reject('调用登录接口失败')
}
});
}).catch(error => {
handleFail(option, '获取环境服务商失败')
reject()
console.log(error)
handleFail(option, '获取环境服务商失败')
reject('获取环境服务商失败')
})
}).catch(error => {
handleFail(option, '登录失败')
console.log(error)
handleFail(option, '登录失败')
})
}
@ -343,18 +288,13 @@ export const handleGetUserInfo = () => {
})
}
const handleFail = (option, msg) => {
// 此处是处理登录失效的问题的
option && option.fail ? option.fail() : replaceLogin('登录失败，请重新登录')
}
export function parseUrl(location) {
if (typeof location === 'string') return location
const {
path,
query
} = location
const queryStr = stringify(query)
if (!queryStr) {
@ -419,6 +359,8 @@ export const handleLoginStatus = (location, complete, fail, success) => {
// 是否可以访问
let isAuth = false
console.log('即将跳转', location, parseUrl(location))
// 从 location 中获取当前url，location typeof string || object
let path = ''
if (typeof location === 'string') {
@ -427,6 +369,7 @@ export const handleLoginStatus = (location, complete, fail, success) => {
path = location.path
}
// 判断用户是否有token
if (!auth()) {
page.map((item) => {
if (item.path == path) {
@ -439,7 +382,7 @@ export const handleLoginStatus = (location, complete, fail, success) => {
return new Promise((resolve, reject) => {
if (isAuth) {
// 登录了有权限
// 有token
resolve({
url: parseUrl(location),
complete,
@ -447,8 +390,8 @@ export const handleLoginStatus = (location, complete, fail, success) => {
success
})
} else {
// 未登录没有权限
replaceLogin()
// 没有token，先校验用户是否授权，如果授权了，进行自动登录
routerPermissions(parseUrl(location))
reject()
}
}).catch(error => {
@ -456,6 +399,55 @@ export const handleLoginStatus = (location, complete, fail, success) => {
})
}
// export function checkPermissions(){
// }
export function routerPermissions(url) {
let path = url
if (!path) {
path = getCurrentPageUrlWithArgs()
}
if (Vue.prototype.$deviceType == 'routine') {
console.log('当前是微信小程序，开始处理小程序登录方法')
// 如果是微信小程序，跳转到授权页
// 先校验用户是否授权，如果授权了，进行自动登录
authorize('userInfo').then(() => {
// 自动登录
login().then(res => {
// 登录成功，跳转到需要跳转的页面
push({
path,
})
}).catch(error => {
uni.showToast({
title: error,
icon: "none",
duration: 2000
});
reLaunch({
path: '/pages/authorization/index',
})
cookie.set('redirect', path)
})
}).catch(error => {
// 跳转到登录页面或者授权页面
reLaunch({
path: '/pages/authorization/index',
})
cookie.set('redirect', path)
})
} else {
// 如果不是小程序跳转到登录页
console.log('当前是app，开始处理app登录方法')
push({
path: '/pages/user/Login/index',
})
cookie.set('redirect', path)
}
}
export function push(location, complete, fail, success) {
handleLoginStatus(location, complete, fail, success).then(params => {
uni.navigateTo(params)