orderSystemJp/raising-vue-uniapp-wx/components/alone-auth-user/index.vue

<template>
	<view style="width: auto; display: inline-block; padding: 0; margin: 0;">
		<template v-if="canIUseGetUserProfile">
			<button :style="styleObj" :class="className" @click="getUserProfile">{{btnText}}</button>
		</template>
		<template v-else>
			<button :style="styleObj" :class="className" open-type="getUserInfo" @getuserinfo="agreeGetUser"
				lang="zh_CN">{{btnText}}</button>
		</template>
	</view>
</template>

<script>
	const app = getApp();
	import api from '@/utils/api'
	import util from '@/utils/util'
	import __config from '@/config/env';
	export default {
		props: {
			btnText: {
				type: String,
				default: '微信授权登录'
			},
			className: {
				type: String,
				default: 'cu-btn bg-blue'
			},
			styleObj: {
				type: Object,
				default: () => {

				}
			},
		},
		data() {
			return {
				canIUseGetUserProfile: false,
			};
		},
		mounted() {
			if (uni.getUserProfile) {
				this.canIUseGetUserProfile = true
			}
		},

		methods: {
			getWxSession() {
				return new Promise((resolve, reject) => {
					uni.login({
						success: function(res) {
							if (res.code) {
								let params = {
									jsCode: res.code
								}
								api.doGet('/openapi/ma/common/login', params).then(res => {
									let session = res.data;
									resolve(session)
								});
							}
						},
						fail: function(error) {
							console.error('小程序wxSession信息出错: ' + error)
							resolve(error)
						}
					});
				})
			},

			agreeGetUser(e) {
				let _this = this
				if (e.detail.errMsg == 'getUserInfo:ok') {
					let eDetail = e.detail
					_this.getWxSession().then(wxSession => {
						let params = Object.assign(eDetail, wxSession, {
							accountId: app.getAccountId()
						})
						console.log('agreeGetUser', eDetail)
						api.doPost('/openapi/ma/common/decryptUserInfo', params).then(res => {
							if (res.code == 200) {
								let wxMemberInfo = util.parseUser(res.data)
								uni.setStorageSync(__config.loginWxUserInfoKey, wxMemberInfo)
								/* 授权完成触发回调 done 方法 */
								_this.$emit("done", wxMemberInfo)
							} else {
								uni.showToast({
									title: res.msg,
								})
							}
						});
					})
				}
			},

			getUserProfile(e) {
				// 推荐使用wx.getUserProfile获取用户信息，开发者每次通过该接口获取用户个人信息均需用户确认
				// 开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
				let _this = this
				wx.getUserProfile({
					desc: '用于完善会员资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
					success: (detail) => {
						let eDetail = detail
						_this.getWxSession().then(wxSession => {
							let params = Object.assign(eDetail, wxSession, {
								accountId: app.getAccountId()
							})
							console.log('getUserProfile', eDetail)
							api.doPost('/openapi/ma/common/decryptUserInfo', params).then(res => {
								if (res.code == 200) {
									let wxMemberInfo = util.parseUser(res.data)
									uni.setStorageSync(__config.loginWxUserInfoKey,
										wxMemberInfo)
									/* 授权完成触发回调 done 方法 */
									_this.$emit("done", wxMemberInfo)
								} else {
									uni.showToast({
										title: res.msg,
									})
								}
							});
						})
					}
				})
			},
		}
	}
</script>

<style lang="scss">

</style>