create-unibest 4.0.2 → 4.0.3

package/features/login/files/src/pages/me.vue

@@ -0,0 +1,79 @@
+<script lang="ts" setup>
+import { storeToRefs } from 'pinia'
+import { LOGIN_PAGE } from '@/router/config'
+import { useUserStore } from '@/store'
+import { useTokenStore } from '@/store/token'
+
+definePage({
+  style: {
+    navigationBarTitleText: '我的',
+  },
+})
+
+const userStore = useUserStore()
+const tokenStore = useTokenStore()
+// 使用storeToRefs解构userInfo
+const { userInfo } = storeToRefs(userStore)
+
+// 微信小程序下登录
+async function handleLogin() {
+  // #ifdef MP-WEIXIN
+  // 微信登录
+  await tokenStore.wxLogin()
+
+  // #endif
+  // #ifndef MP-WEIXIN
+  uni.navigateTo({
+    url: `${LOGIN_PAGE}`,
+  })
+  // #endif
+}
+
+function handleLogout() {
+  uni.showModal({
+    title: '提示',
+    content: '确定要退出登录吗？',
+    success: (res) => {
+      if (res.confirm) {
+        // 清空用户信息
+        useTokenStore().logout()
+        // 执行退出登录逻辑
+        uni.showToast({
+          title: '退出登录成功',
+          icon: 'success',
+        })
+        // #ifdef MP-WEIXIN
+        // 微信小程序，去首页
+        // uni.reLaunch({ url: '/pages/index/index' })
+        // #endif
+        // #ifndef MP-WEIXIN
+        // 非微信小程序，去登录页
+        // uni.navigateTo({ url: LOGIN_PAGE })
+        // #endif
+      }
+    },
+  })
+}
+</script>
+
+<template>
+  <view class="profile-container">
+    <view class="mt-3 break-all px-3 text-center text-green-500">
+      {{ userInfo.username ? '已登录' : '未登录' }}
+    </view>
+    <view class="mt-3 break-all px-3">
+      {{ JSON.stringify(userInfo, null, 2) }}
+    </view>
+
+    <view class="mt-[60vh] px-3">
+      <view class="m-auto w-160px text-center">
+        <button v-if="tokenStore.hasLogin" type="warn" class="w-full" @click="handleLogout">
+          退出登录
+        </button>
+        <button v-else type="primary" class="w-full" @click="handleLogin">
+          登录
+        </button>
+      </view>
+    </view>
+  </view>
+</template>

package/features/login/files/src/router/config.ts

@@ -0,0 +1,30 @@
+import { getAllPages } from '@/utils'
+
+export const LOGIN_STRATEGY_MAP = {
+  DEFAULT_NO_NEED_LOGIN: 0, // 黑名单策略，默认可以进入APP
+  DEFAULT_NEED_LOGIN: 1, // 白名单策略，默认不可以进入APP，需要强制登录
+}
+// TODO: 1/3 登录策略，默认使用`无需登录策略`，即默认不需要登录就可以访问
+export const LOGIN_STRATEGY = LOGIN_STRATEGY_MAP.DEFAULT_NO_NEED_LOGIN
+export const isNeedLoginMode = LOGIN_STRATEGY === LOGIN_STRATEGY_MAP.DEFAULT_NEED_LOGIN
+
+export const LOGIN_PAGE = '/pages/auth/login'
+export const REGISTER_PAGE = '/pages/auth/register'
+
+export const LOGIN_PAGE_LIST = [LOGIN_PAGE, REGISTER_PAGE]
+
+// 在 definePage 里面配置了 excludeLoginPath 的页面，功能与 EXCLUDE_LOGIN_PATH_LIST 相同
+export const excludeLoginPathList = getAllPages('excludeLoginPath').map(page => page.path)
+
+// 排除在外的列表，白名单策略指白名单列表，黑名单策略指黑名单列表
+// TODO: 2/3 在 definePage 配置 excludeLoginPath，或者在下面配置 EXCLUDE_LOGIN_PATH_LIST
+export const EXCLUDE_LOGIN_PATH_LIST = [
+  '/pages/xxx/index', // 示例值
+  '/pages-sub/xxx/index', // 示例值
+  ...excludeLoginPathList, // 都是以 / 开头的 path
+]
+
+// 在小程序里面是否使用H5的登录页，默认为 false
+// 如果为 true 则复用 h5 的登录逻辑
+// TODO: 3/3 确定自己的登录页是否需要在小程序里面使用
+export const LOGIN_PAGE_ENABLE_IN_MP = false

package/features/login/files/src/router/interceptor.ts

@@ -0,0 +1,145 @@
+import { isMp } from '@uni-helper/uni-env'
+/**
+ * by 菲鸽 on 2025-08-19
+ * 路由拦截，通常也是登录拦截
+ * 黑、白名单的配置，请看 config.ts 文件， EXCLUDE_LOGIN_PATH_LIST
+ */
+import { useTokenStore } from '@/store/token'
+import { isPageTabbar, tabbarStore } from '@/tabbar/store'
+import { getAllPages, getLastPage, HOME_PAGE, parseUrlToObj } from '@/utils/index'
+import { EXCLUDE_LOGIN_PATH_LIST, isNeedLoginMode, LOGIN_PAGE, LOGIN_PAGE_ENABLE_IN_MP } from './config'
+
+export const FG_LOG_ENABLE = false
+
+export function judgeIsExcludePath(path: string) {
+  const isDev = import.meta.env.DEV
+  if (!isDev) {
+    return EXCLUDE_LOGIN_PATH_LIST.includes(path)
+  }
+  const allExcludeLoginPages = getAllPages('excludeLoginPath') // dev 环境下，需要每次都重新获取，否则新配置就不会生效
+  return EXCLUDE_LOGIN_PATH_LIST.includes(path) || (isDev && allExcludeLoginPages.some(page => page.path === path))
+}
+
+export const navigateToInterceptor = {
+  // 注意，这里的url是 '/' 开头的，如 '/pages/index/index'，跟 'pages.json' 里面的 path 不同
+  // 增加对相对路径的处理，BY 网友 @ideal
+  invoke({ url, query }: { url: string, query?: Record<string, string> }) {
+    if (url === undefined) {
+      return
+    }
+    let { path, query: _query } = parseUrlToObj(url)
+
+    FG_LOG_ENABLE && console.log('\n\n路由拦截器:-------------------------------------')
+    FG_LOG_ENABLE && console.log('路由拦截器 1: url->', url, ', query ->', query)
+    const myQuery = { ..._query, ...query }
+    // /pages/route-interceptor/index?name=feige&age=30
+    FG_LOG_ENABLE && console.log('路由拦截器 2: path->', path, ', _query ->', _query)
+    FG_LOG_ENABLE && console.log('路由拦截器 3: myQuery ->', myQuery)
+
+    // 处理相对路径
+    if (!path.startsWith('/')) {
+      const currentPath = getLastPage()?.route || ''
+      const normalizedCurrentPath = currentPath.startsWith('/') ? currentPath : `/${currentPath}`
+      const baseDir = normalizedCurrentPath.substring(0, normalizedCurrentPath.lastIndexOf('/'))
+      path = `${baseDir}/${path}`
+    }
+
+    // // 处理路由不存在的情况
+    // if (path !== '/' && !getAllPages().some(page => page.path === path)) {
+    //   console.warn('路由不存在:', path)
+    //   return false // 明确表示阻止原路由继续执行
+    // }
+
+    // // 插件页面
+    // if (url.startsWith('plugin://')) {
+    //   FG_LOG_ENABLE && console.log('路由拦截器 4: plugin:// 路径 ==>', url)
+    //   path = url
+    // }
+
+    // 处理直接进入路由非首页时，tabbarIndex 不正确的问题
+    tabbarStore.setAutoCurIdx(path)
+
+    // 小程序里面使用平台自带的登录，则不走下面的逻辑
+    if (isMp && !LOGIN_PAGE_ENABLE_IN_MP) {
+      return true // 明确表示允许路由继续执行
+    }
+
+    const tokenStore = useTokenStore()
+    FG_LOG_ENABLE && console.log('tokenStore.hasLogin:', tokenStore.hasLogin)
+
+    // 不管黑白名单，登录了就直接去吧（但是当前不能是登录页）
+    if (tokenStore.hasLogin) {
+      if (path !== LOGIN_PAGE) {
+        return true // 明确表示允许路由继续执行
+      }
+      else {
+        console.log('已经登录，但是还在登录页', myQuery.redirect)
+        const url = myQuery.redirect || HOME_PAGE
+        if (isPageTabbar(url)) {
+          uni.switchTab({ url })
+        }
+        else {
+          uni.navigateTo({ url })
+        }
+        return false // 明确表示阻止原路由继续执行
+      }
+    }
+    let fullPath = path
+
+    if (Object.keys(myQuery).length) {
+      fullPath += `?${Object.keys(myQuery).map(key => `${key}=${myQuery[key]}`).join('&')}`
+    }
+    const redirectUrl = `${LOGIN_PAGE}?redirect=${encodeURIComponent(fullPath)}`
+
+    // #region 1/2 默认需要登录的情况(白名单策略) ---------------------------
+    if (isNeedLoginMode) {
+      // 需要登录里面的 EXCLUDE_LOGIN_PATH_LIST 表示白名单，可以直接通过
+      if (judgeIsExcludePath(path)) {
+        return true // 明确表示允许路由继续执行
+      }
+      // 否则需要重定向到登录页
+      else {
+        if (path === LOGIN_PAGE) {
+          return true // 明确表示允许路由继续执行
+        }
+        FG_LOG_ENABLE && console.log('1 isNeedLogin(白名单策略) redirectUrl:', redirectUrl)
+        uni.navigateTo({ url: redirectUrl })
+        return false // 明确表示阻止原路由继续执行
+      }
+    }
+    // #endregion 1/2 默认需要登录的情况(白名单策略) ---------------------------
+
+    // #region 2/2 默认不需要登录的情况(黑名单策略) ---------------------------
+    else {
+      // 不需要登录里面的 EXCLUDE_LOGIN_PATH_LIST 表示黑名单，需要重定向到登录页
+      if (judgeIsExcludePath(path)) {
+        FG_LOG_ENABLE && console.log('2 isNeedLogin(黑名单策略) redirectUrl:', redirectUrl)
+        uni.navigateTo({ url: redirectUrl })
+        return false // 修改为false，阻止原路由继续执行
+      }
+      return true // 明确表示允许路由继续执行
+    }
+    // #endregion 2/2 默认不需要登录的情况(黑名单策略) ---------------------------
+  },
+}
+
+// 针对 chooseLocation 的特殊处理
+export const chooseLocationInterceptor = {
+  invoke(options: any) {
+    // 直接放行 chooseLocation 调用
+    FG_LOG_ENABLE && console.log('chooseLocation 调用，直接放行:', options)
+    return true
+  },
+}
+
+export const routeInterceptor = {
+  install() {
+    uni.addInterceptor('navigateTo', navigateToInterceptor)
+    uni.addInterceptor('reLaunch', navigateToInterceptor)
+    uni.addInterceptor('redirectTo', navigateToInterceptor)
+    uni.addInterceptor('switchTab', navigateToInterceptor)
+
+    // 添加 chooseLocation 的拦截器，确保直接放行
+    uni.addInterceptor('chooseLocation', chooseLocationInterceptor)
+  },
+}

package/features/login/hooks.ts

@@ -0,0 +1,9 @@
+import type { FeatureContext } from '../../packages/cli/src/features/interface'
+
+export const preApply = async (ctx: FeatureContext) => {
+  console.log(`[login] Pre-apply for ${ctx.projectPath}`)
+}
+
+export const postApply = async (ctx: FeatureContext) => {
+  console.log(`[login] Post-apply for ${ctx.projectPath}`)
+}

package/features/login/package.json

@@ -0,0 +1,6 @@
+{
+  "name": "@unibest/feature-login",
+  "version": "1.0.0",
+  "description": "unibest login feature",
+  "dependencies": {}
+}

package/features/login/schema.json

@@ -0,0 +1,13 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "type": "object",
+  "properties": {
+    "loginStrategy": {
+      "type": "string",
+      "enum": ["blacklist", "whitelist"],
+      "default": "blacklist",
+      "description": "登录策略：blacklist(黑名单) 或 whitelist(白名单)"
+    }
+  },
+  "required": []
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "create-unibest",
   "type": "module",
-  "version": "4.0.2",
+  "version": "4.0.3",
   "packageManager": "pnpm@10.10.0",
   "description": "快速创建 unibest 项目的脚手架工具",
   "author": "feige996",