移动端sso

web/src/main.ts

@@ -10,6 +10,7 @@ import router from './router'
 import { initializeAppUpdates } from './services/appUpdates'
 import { initializeNativeHome } from './services/nativeHome'
 import { initializePwa } from './services/pwa'
+import { initializeNativeAppLinks } from './services/nativeAppLinks'
 import { setRouter } from './utils/navigate'
 import { initializeAuthSession } from './auth/session'
 
@@ -26,3 +27,4 @@ app.mount('#app')
 void initializePwa()
 void initializeAppUpdates()
 initializeNativeHome(router)
+void initializeNativeAppLinks(router)

web/src/services/nativeAppLinks.ts

@@ -0,0 +1,50 @@
+import { App } from '@capacitor/app'
+import { Browser } from '@capacitor/browser'
+import { Capacitor } from '@capacitor/core'
+import type { Router } from 'vue-router'
+
+const ssoPaths = new Set(['/sso/callback', '/sso/bind'])
+
+function appLinkRoute(url: string) {
+  try {
+    const target = new URL(url)
+    const publicBase = new URL(
+      String(import.meta.env.VITE_PUBLIC_BASE_URL ?? location.origin),
+    )
+    if (
+      target.protocol !== 'https:' ||
+      target.origin !== publicBase.origin ||
+      !ssoPaths.has(target.pathname)
+    ) {
+      return null
+    }
+    return target.pathname + target.search + target.hash
+  } catch {
+    return null
+  }
+}
+
+async function handleAppUrl(router: Router, url: string) {
+  const route = appLinkRoute(url)
+  if (!route) return
+  await Browser.close().catch(() => undefined)
+  await router.replace(route)
+}
+
+export async function initializeNativeAppLinks(router: Router) {
+  if (!Capacitor.isNativePlatform()) return
+
+  await App.addListener('appUrlOpen', event => {
+    void handleAppUrl(router, event.url)
+  })
+  const launchUrl = await App.getLaunchUrl()
+  if (launchUrl?.url) await handleAppUrl(router, launchUrl.url)
+}
+
+export async function openSsoLogin(url: string) {
+  if (!Capacitor.isNativePlatform()) {
+    window.location.assign(url)
+    return
+  }
+  await Browser.open({ url, toolbarColor: '#173a50' })
+}

web/src/views/AccountView.vue

@@ -3,6 +3,8 @@ import { onMounted, reactive, ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import http, { apiErrorMessage } from '../api/http'
 import { useAuthStore } from '../stores/auth'
+import { isNativeApp } from '../auth/session'
+import { openSsoLogin } from '../services/nativeAppLinks'
 
 const route = useRoute()
 const router = useRouter()
@@ -43,8 +45,10 @@ async function loadAccount() {
 async function startBinding() {
   actionLoading.value = true
   try {
-    const { data } = await http.post('/auth/sso/prepare-binding')
-    window.location.assign(String(data.loginUrl))
+    const { data } = await http.post('/auth/sso/prepare-binding', null, {
+      params: { nativeApp: isNativeApp() },
+    })
+    await openSsoLogin(String(data.loginUrl))
   } catch (error) {
     ElMessage.error(apiErrorMessage(error))
     actionLoading.value = false