feat(微信授权): 在微信环境中自动触发授权流程
在微信内置浏览器环境下点击购买时,若检测到未完成微信授权,系统将自动发起一次微信授权流程并中止本次购买。授权完成后再次点击可进入结算。开发环境保留现有调试行为不触发授权。
Showing
2 changed files
with
35 additions
and
4 deletions
| ... | @@ -45,6 +45,11 @@ https://oa-dev.onwall.cn/f/mlaj | ... | @@ -45,6 +45,11 @@ https://oa-dev.onwall.cn/f/mlaj |
| 45 | - 非微信环境(付费课):提示“请在微信内打开进行购买”,不进入结算。 | 45 | - 非微信环境(付费课):提示“请在微信内打开进行购买”,不进入结算。 |
| 46 | - 位置:`/src/views/courses/CourseDetailPage.vue` 的 `handlePurchase` 中,使用 `wxInfo` 进行环境判断。 | 46 | - 位置:`/src/views/courses/CourseDetailPage.vue` 的 `handlePurchase` 中,使用 `wxInfo` 进行环境判断。 |
| 47 | 47 | ||
| 48 | + - 微信授权自动触发(微信环境内) | ||
| 49 | + - 行为:在微信内置浏览器环境下点击“购买”时,若检测到未完成微信授权(`openid_has=false`),系统将自动发起一次微信授权流程并中止本次购买;授权完成后再次点击可进入结算。 | ||
| 50 | + - 开发环境:不触发微信授权流程(保留现有调试行为)。 | ||
| 51 | + - 位置:`/src/views/courses/CourseDetailPage.vue` 的 `handlePurchase` 中,调用 `getAuthInfoAPI()` 探测并使用 `startWxAuth()` 触发授权。 | ||
| 52 | + | ||
| 48 | - 401拦截策略优化(公开页面不再跳登录) | 53 | - 401拦截策略优化(公开页面不再跳登录) |
| 49 | - 行为:接口返回 `code=401` 时,不再对公开页面(如课程详情 `/courses/:id`)进行登录重定向;仅当当前路由确实需要登录权限时才跳转至登录页。 | 54 | - 行为:接口返回 `code=401` 时,不再对公开页面(如课程详情 `/courses/:id`)进行登录重定向;仅当当前路由确实需要登录权限时才跳转至登录页。 |
| 50 | - 原理:响应拦截器调用路由守卫 `checkAuth` 判断当前路由是否为受限页面,受限则清理登录信息并附带 `redirect` 重定向至登录页;公开页面保持当前页,由业务自行处理401。 | 55 | - 原理:响应拦截器调用路由守卫 `checkAuth` 判断当前路由是否为受限页面,受限则清理登录信息并附带 `redirect` 重定向至登录页;公开页面保持当前页,由业务自行处理401。 | ... | ... |
| ... | @@ -223,7 +223,7 @@ | ... | @@ -223,7 +223,7 @@ |
| 223 | </svg> | 223 | </svg> |
| 224 | 收藏 | 224 | 收藏 |
| 225 | </button> | 225 | </button> |
| 226 | - <button class="flex flex-col items-center text-gray-500 text-xs" @click="open_consult_dialog"> | 226 | + <!-- <button class="flex flex-col items-center text-gray-500 text-xs" @click="open_consult_dialog"> |
| 227 | <svg | 227 | <svg |
| 228 | xmlns="http://www.w3.org/2000/svg" | 228 | xmlns="http://www.w3.org/2000/svg" |
| 229 | class="h-6 w-6" | 229 | class="h-6 w-6" |
| ... | @@ -239,7 +239,7 @@ | ... | @@ -239,7 +239,7 @@ |
| 239 | /> | 239 | /> |
| 240 | </svg> | 240 | </svg> |
| 241 | 咨询 | 241 | 咨询 |
| 242 | - </button> | 242 | + </button> --> |
| 243 | </div> | 243 | </div> |
| 244 | <div class="flex items-center"> | 244 | <div class="flex items-center"> |
| 245 | <div v-if="!course?.is_buy" class="mr-2"> | 245 | <div v-if="!course?.is_buy" class="mr-2"> |
| ... | @@ -378,6 +378,8 @@ import { useCart } from '@/contexts/cart' | ... | @@ -378,6 +378,8 @@ import { useCart } from '@/contexts/cart' |
| 378 | import { useAuth } from '@/contexts/auth' | 378 | import { useAuth } from '@/contexts/auth' |
| 379 | import { useTitle } from '@vueuse/core'; | 379 | import { useTitle } from '@vueuse/core'; |
| 380 | import { wxInfo } from '@/utils/tools'; | 380 | import { wxInfo } from '@/utils/tools'; |
| 381 | +import { startWxAuth } from '@/router/guards' | ||
| 382 | +import { getAuthInfoAPI } from '@/api/auth' | ||
| 381 | import { showToast, showDialog, showImagePreview } from 'vant'; | 383 | import { showToast, showDialog, showImagePreview } from 'vant'; |
| 382 | import { formatDate } from '@/utils/tools' | 384 | import { formatDate } from '@/utils/tools' |
| 383 | import { sharePage } from '@/composables/useShare.js' | 385 | import { sharePage } from '@/composables/useShare.js' |
| ... | @@ -693,8 +695,16 @@ const RightContent = defineComponent({ | ... | @@ -693,8 +695,16 @@ const RightContent = defineComponent({ |
| 693 | 695 | ||
| 694 | const rightContent = h(RightContent) | 696 | const rightContent = h(RightContent) |
| 695 | 697 | ||
| 696 | -// 立即购买操作 | 698 | +/** |
| 697 | -const handlePurchase = () => { | 699 | + * @function handlePurchase |
| 700 | + * @description 立即购买操作: | ||
| 701 | + * 1. 检查登录状态;未登录跳转到登录页。 | ||
| 702 | + * 2. 非微信环境(生产)对非免费课程进行环境拦截提示。 | ||
| 703 | + * 3. 微信环境内检查是否已完成授权;未授权则自动发起一次微信授权流程。 | ||
| 704 | + * 4. 将课程加入购物车并进入结算页。 | ||
| 705 | + * @returns {void} | ||
| 706 | + */ | ||
| 707 | +const handlePurchase = async () => { | ||
| 698 | // 检查用户是否已登录 | 708 | // 检查用户是否已登录 |
| 699 | if (!currentUser.value) { | 709 | if (!currentUser.value) { |
| 700 | showToast('请先登录') | 710 | showToast('请先登录') |
| ... | @@ -713,6 +723,22 @@ const handlePurchase = () => { | ... | @@ -713,6 +723,22 @@ const handlePurchase = () => { |
| 713 | return | 723 | return |
| 714 | } | 724 | } |
| 715 | 725 | ||
| 726 | + // 微信环境内授权检查:未授权自动触发一次授权流程 | ||
| 727 | + if (!import.meta.env.DEV && wxInfo().isWeiXin) { | ||
| 728 | + try { | ||
| 729 | + const { code, data } = await getAuthInfoAPI(); | ||
| 730 | + if (code && !data.openid_has) { | ||
| 731 | + showToast('正在进行微信授权,请稍后...') | ||
| 732 | + await startWxAuth() | ||
| 733 | + return | ||
| 734 | + } | ||
| 735 | + } catch (e) { | ||
| 736 | + // 探测失败也尝试触发授权 | ||
| 737 | + await startWxAuth() | ||
| 738 | + return | ||
| 739 | + } | ||
| 740 | + } | ||
| 741 | + | ||
| 716 | if (course.value) { | 742 | if (course.value) { |
| 717 | // 调试日志:检查course.value.form_url的值 | 743 | // 调试日志:检查course.value.form_url的值 |
| 718 | console.log('CourseDetailPage - course.value.form_url:', course.value.form_url) | 744 | console.log('CourseDetailPage - course.value.form_url:', course.value.form_url) | ... | ... |
-
Please register or login to post a comment