feat(dev): 增加独立分销前台端口5191、标签页会话隔离与免hosts二级域名支持

frontend/src/stores/distributionSite.ts

@@ -11,20 +11,52 @@ export interface DistributionSiteInfo {
   default_support_group_id?: number | null
 }
 
+/**
+ * 获取当前上下文生效的分销站点编码
+ * 优先级：
+ * 1. 环境变量 VITE_DISTRIBUTION_SITE_CODE（针对独立分销前台开发端口，如 5191）
+ * 2. 当前标签页 sessionStorage 中的 hfb_site_code（避免跨 Tab 污染主站）
+ * 3. 本地二级域名（如 test_1.localhost:5189）
+ * 4. 生产环境或独立域名绑定的 localStorage 缓存
+ */
+export function getEffectiveSiteCode(): string {
+  if (typeof window === 'undefined') return ''
+  const envCode = ((import.meta.env.VITE_DISTRIBUTION_SITE_CODE as string) || '').trim()
+  if (envCode) return envCode
+
+  const sessionCode = sessionStorage.getItem('hfb_site_code') || ''
+  if (sessionCode) return sessionCode
+
+  const hostname = window.location.hostname
+  if (hostname && hostname.endsWith('.localhost')) {
+    return hostname.replace(/\.localhost$/, '')
+  }
+
+  if (hostname !== 'localhost' && hostname !== '127.0.0.1') {
+    return localStorage.getItem('hfb_site_code') || ''
+  }
+
+  return ''
+}
+
 export const useDistributionSiteStore = defineStore('distributionSite', {
-  state: () => ({
-    siteCode: localStorage.getItem('hfb_site_code') || '',
-    siteName: localStorage.getItem('hfb_site_name') || '大锤商行',
-    domain: '',
-    isDistribution: Boolean(localStorage.getItem('hfb_site_code')),
-    displayAccountEnabled: true,
-    defaultSupportGroupId: null as number | null,
-    initialized: false,
-  }),
+  state: () => {
+    const code = getEffectiveSiteCode()
+    return {
+      siteCode: code,
+      siteName: sessionStorage.getItem('hfb_site_name') || '大锤商行',
+      domain: '',
+      isDistribution: Boolean(code),
+      displayAccountEnabled: true,
+      defaultSupportGroupId: null as number | null,
+      initialized: false,
+    }
+  },
 
   actions: {
     async initSite() {
-      // 1. Check URL query params: ?site=xxx or ?site_code=xxx
+      const envCode = ((import.meta.env.VITE_DISTRIBUTION_SITE_CODE as string) || '').trim()
+      const hostname = window.location.hostname
       const urlParams = new URLSearchParams(window.location.search)
       const querySite = (
         urlParams.get('site') ||
@@ -33,24 +65,37 @@ export const useDistributionSiteStore = defineStore('distributionSite', {
         ''
       ).trim()
 
+      // 1. 显式清除或重置为主站
+      if (querySite === 'main' || querySite === 'clear' || querySite === '0') {
+        this.resetToMainSite()
+        this.initialized = true
+        return
+      }
+
+      // 2. 识别目标分销站点编码
+      let targetCode = ''
       if (querySite) {
-        if (querySite === 'main' || querySite === 'clear' || querySite === '0') {
+        targetCode = querySite
+        sessionStorage.setItem('hfb_site_code', querySite)
+      } else if (envCode) {
+        targetCode = envCode
+        sessionStorage.setItem('hfb_site_code', envCode)
+      } else if (hostname && hostname.endsWith('.localhost')) {
+        targetCode = hostname.replace(/\.localhost$/, '')
+        sessionStorage.setItem('hfb_site_code', targetCode)
+      } else {
+        targetCode = sessionStorage.getItem('hfb_site_code') || ''
+        // 若在普通 localhost 且无 envCode、无 query、无 sessionStorage，则视为纯主站，清理旧的 localStorage 串扰
+        if (!targetCode && (hostname === 'localhost' || hostname === '127.0.0.1')) {
           this.resetToMainSite()
           this.initialized = true
           return
         }
-        this.siteCode = querySite
-        localStorage.setItem('hfb_site_code', querySite)
       }
 
-      const effectiveCode = this.siteCode || localStorage.getItem('hfb_site_code') || ''
-      const hostname = window.location.hostname
-
-      // If we have a site code, query by code.
-      // Otherwise query by domain (for independent domain access in production).
       let queryUrl = ''
-      if (effectiveCode) {
-        queryUrl = `/distribution/site-info?code=${encodeURIComponent(effectiveCode)}`
+      if (targetCode) {
+        queryUrl = `/distribution/site-info?code=${encodeURIComponent(targetCode)}`
       } else if (hostname && hostname !== 'localhost' && hostname !== '127.0.0.1') {
         queryUrl = `/distribution/site-info?domain=${encodeURIComponent(hostname)}`
       }
@@ -75,16 +120,16 @@ export const useDistributionSiteStore = defineStore('distributionSite', {
           this.displayAccountEnabled = info.display_account_enabled ?? true
           this.defaultSupportGroupId = info.default_support_group_id ?? null
 
-          localStorage.setItem('hfb_site_code', this.siteCode)
-          localStorage.setItem('hfb_site_name', this.siteName)
+          sessionStorage.setItem('hfb_site_code', this.siteCode)
+          sessionStorage.setItem('hfb_site_name', this.siteName)
 
-          // Update page title
+          // 更新页面标题
           document.title = `【${this.siteName}】租号商城 - 精选游戏账号平台`
         } else {
           this.resetToMainSite()
         }
       } catch {
-        // If site code was invalid or not found, fall back to main site
+        // 若站点编码无效或未找到，自动回退为主站
         this.resetToMainSite()
       } finally {
         this.initialized = true
@@ -98,6 +143,8 @@ export const useDistributionSiteStore = defineStore('distributionSite', {
       this.isDistribution = false
       this.displayAccountEnabled = true
       this.defaultSupportGroupId = null
+      sessionStorage.removeItem('hfb_site_code')
+      sessionStorage.removeItem('hfb_site_name')
       localStorage.removeItem('hfb_site_code')
       localStorage.removeItem('hfb_site_name')
       document.title = '大锤商行 - 官方租号平台'