hookehuyr

feat(微信授权): 添加微信授权模块及相关API

新增微信授权模块,包括授权页面、授权信息获取API及微信配置初始化逻辑。修改路由守卫以检查微信授权状态,未授权时跳转至授权页面。优化axios配置及Vant Toast样式导入路径。
1 <!-- 1 <!--
2 * @Date: 2025-03-20 19:53:12 2 * @Date: 2025-03-20 19:53:12
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-03-25 10:56:11 4 + * @LastEditTime: 2025-03-25 14:31:15
5 * @FilePath: /mlaj/src/App.vue 5 * @FilePath: /mlaj/src/App.vue
6 * @Description: 入口文件 6 * @Description: 入口文件
7 --> 7 -->
...@@ -24,6 +24,29 @@ import 'vant/es/toast/style' ...@@ -24,6 +24,29 @@ import 'vant/es/toast/style'
24 24
25 provideAuth(); // 提供全局认证状态 25 provideAuth(); // 提供全局认证状态
26 provideCart('single'); // 提供全局购物车状态,单一商品模式 26 provideCart('single'); // 提供全局购物车状态,单一商品模式
27 +
28 +// 初始化微信配置
29 +const initWxConfig = async () => {
30 + const raw_url = encodeURIComponent(location.pathname + location.hash);
31 + try {
32 + const wxJs = await wxJsAPI({ url: raw_url })
33 + wxJs.data.jsApiList = apiList
34 + wx.config(wxJs.data)
35 + wx.ready(() => {
36 + wx.showAllNonBaseMenuItem()
37 + })
38 + wx.error((err) => {
39 + console.warn('微信配置初始化失败:', err)
40 + })
41 + } catch (error) {
42 + console.error('初始化微信配置失败:', error)
43 + }
44 +}
45 +
46 +// 在非开发环境下初始化微信配置
47 +if (!import.meta.env.DEV && wxInfo().isWeiXin) {
48 + initWxConfig()
49 +}
27 </script> 50 </script>
28 51
29 <template> 52 <template>
......
1 +import { fn, fetch } from '@/api/fn';
2 +
3 +const Api = {
4 + AUTH_INFO: '/srv/?a=openid_has',
5 +}
6 +
7 +/**
8 + * @description: 获取用户授权信息
9 + * @param {*}
10 + * @returns
11 + */
12 +export const getAuthInfoAPI = () => fn(fetch.get(Api.AUTH_INFO));
1 /* 1 /*
2 * @Date: 2022-05-18 22:56:08 2 * @Date: 2022-05-18 22:56:08
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-03-21 18:05:34 4 + * @LastEditTime: 2025-03-25 14:59:50
5 * @FilePath: /mlaj/src/api/fn.js 5 * @FilePath: /mlaj/src/api/fn.js
6 * @Description: 文件描述 6 * @Description: 文件描述
7 */ 7 */
8 import axios from '@/utils/axios'; 8 import axios from '@/utils/axios';
9 import qs from 'Qs' 9 import qs from 'Qs'
10 -import { showSuccessToast, showFailToast } from 'vant'; 10 +import { showFailToast } from 'vant';
11 -import 'vant/lib/toast/style' 11 +import 'vant/es/toast/style'
12 12
13 /** 13 /**
14 * 网络请求功能函数 14 * 网络请求功能函数
......
1 /* 1 /*
2 * @Date: 2025-03-20 20:36:36 2 * @Date: 2025-03-20 20:36:36
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-03-25 09:55:59 4 + * @LastEditTime: 2025-03-25 15:17:18
5 * @FilePath: /mlaj/src/router/index.js 5 * @FilePath: /mlaj/src/router/index.js
6 * @Description: 文件描述 6 * @Description: 文件描述
7 */ 7 */
8 import { createRouter, createWebHashHistory } from 'vue-router' 8 import { createRouter, createWebHashHistory } from 'vue-router'
9 import checkinRoutes from './checkin' 9 import checkinRoutes from './checkin'
10 +import { getAuthInfoAPI } from '@/api/auth'
11 +import { wxInfo } from "@/utils/tools";
10 12
11 const routes = [ 13 const routes = [
12 { 14 {
...@@ -180,6 +182,12 @@ const routes = [ ...@@ -180,6 +182,12 @@ const routes = [
180 name: 'upload_video', 182 name: 'upload_video',
181 component: () => import('../views/upload_video.vue'), 183 component: () => import('../views/upload_video.vue'),
182 meta: { title: 'upload_video' }, 184 meta: { title: 'upload_video' },
185 + }, {
186 + path: '/auth',
187 + component: () => import('@/views/auth.vue'),
188 + meta: {
189 + title: '微信授权页面',
190 + }
183 }, 191 },
184 ...checkinRoutes, 192 ...checkinRoutes,
185 ] 193 ]
...@@ -210,7 +218,20 @@ const authRequiredRoutes = [ ...@@ -210,7 +218,20 @@ const authRequiredRoutes = [
210 ] 218 ]
211 219
212 // 导航守卫 220 // 导航守卫
213 -router.beforeEach((to, from, next) => { 221 +router.beforeEach(async (to, from, next) => {
222 + // 微信授权检查
223 + if (!import.meta.env.DEV && wxInfo().isWeiXin && to.path !== '/auth') {
224 + try {
225 + const { code, data } = await getAuthInfoAPI();
226 + if (code && !data.openid_has) {
227 + next({ path: '/auth', query: { href: location.hash } })
228 + return
229 + }
230 + } catch (error) {
231 + console.error('微信授权检查失败:', error)
232 + }
233 + }
234 +
214 const currentUser = JSON.parse(localStorage.getItem('currentUser')) 235 const currentUser = JSON.parse(localStorage.getItem('currentUser'))
215 236
216 // 检查当前路由是否需要认证 237 // 检查当前路由是否需要认证
......
...@@ -2,19 +2,18 @@ ...@@ -2,19 +2,18 @@
2 * @Author: hookehuyr hookehuyr@gmail.com 2 * @Author: hookehuyr hookehuyr@gmail.com
3 * @Date: 2022-05-28 10:17:40 3 * @Date: 2022-05-28 10:17:40
4 * @LastEditors: hookehuyr hookehuyr@gmail.com 4 * @LastEditors: hookehuyr hookehuyr@gmail.com
5 - * @LastEditTime: 2024-07-25 09:46:46 5 + * @LastEditTime: 2025-03-25 15:03:55
6 - * @FilePath: /temple_material_request/src/utils/axios.js 6 + * @FilePath: /mlaj/src/utils/axios.js
7 * @Description: 7 * @Description:
8 */ 8 */
9 import axios from 'axios'; 9 import axios from 'axios';
10 -import router from '@/router'; 10 +// import router from '@/router';
11 -import qs from 'Qs' 11 +// import qs from 'Qs'
12 -import { strExist } from '@/utils/tools' 12 +// import { strExist } from '@/utils/tools'
13 -// import { parseQueryString } from '@/utils/tools'
14 13
15 -axios.defaults.baseURL = 'http://localhost:3000/api'; 14 +// axios.defaults.baseURL = 'http://localhost:3000/api';
16 axios.defaults.params = { 15 axios.defaults.params = {
17 - f: 'good', 16 + f: 'behalo',
18 }; 17 };
19 18
20 /** 19 /**
......
1 +<!--
2 + * @Date: 2022-08-29 13:55:31
3 + * @LastEditors: hookehuyr hookehuyr@gmail.com
4 + * @LastEditTime: 2025-03-25 15:10:43
5 + * @FilePath: /mlaj/src/views/auth.vue
6 + * @Description: 授权模块
7 +-->
8 +<template>
9 + <div />
10 +</template>
11 +
12 +<script setup>
13 +import { onMounted } from 'vue'
14 +import { useRoute } from 'vue-router'
15 +
16 +const $route = useRoute();
17 +
18 +onMounted(() => {
19 + // php需要先跳转链接获取openid
20 + /**
21 + * encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。
22 + * 该方法不会对 ASCII 字母和数字进行编码,也不会对这些 ASCII 标点符号进行编码: - _ . ! ~ * ' ( ) 。
23 + * 其他字符(比如 :;/?:@&=+$,# 这些用于分隔 URI 组件的标点符号),都是由一个或多个十六进制的转义序列替换的。
24 + */
25 + let raw_url = encodeURIComponent(location.origin + location.pathname + $route.query.href); // 未授权的地址
26 + // TAG: 开发环境测试数据
27 + const short_url = `/srv/?f=behalo&a=openid&res=${raw_url}`;
28 + location.href = import.meta.env.DEV
29 + ? `${short_url}&test_openid=${import.meta.env.VITE_OPENID}`
30 + : `${short_url}`;
31 +})
32 +</script>