From f64c1ffb19bb3c0993063608d8b6ff5e17ee9552 Mon Sep 17 00:00:00 2001 From: zdl <3489966805@qq.com> Date: Thu, 4 Dec 2025 18:26:01 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BA=8B=E4=BB=B6=E8=AF=A6=E6=83=85?= =?UTF-8?q?=E9=A1=B5=20URL=20ID=20=E5=8A=A0=E5=AF=86=EF=BC=8C=E9=98=B2?= =?UTF-8?q?=E6=AD=A2=E7=94=A8=E6=88=B7=E9=81=8D=E5=8E=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 新增 idEncoder.ts 工具：使用 Base64 + 前缀混淆加密 ID - 路由改为查询参数形式：/event-detail?id=xxx - 更新所有入口使用 getEventDetailUrl() 生成加密链接 - 兼容旧链接：纯数字 ID 仍可正常访问 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- .../FeatureMenus/FollowingEventsMenu.js | 3 +- src/contexts/NotificationContext.js | 3 +- src/routes/routeConfig.js | 2 +- src/utils/idEncoder.ts | 55 +++++++++++++++ src/views/Community/hooks/useEventFilters.js | 3 +- src/views/Dashboard/Center.js | 3 +- src/views/EventDetail/index.js | 70 ++++++++----------- 7 files changed, 94 insertions(+), 45 deletions(-) create mode 100644 src/utils/idEncoder.ts diff --git a/src/components/Navbars/components/FeatureMenus/FollowingEventsMenu.js b/src/components/Navbars/components/FeatureMenus/FollowingEventsMenu.js index 50e93c96..a062c7c2 100644 --- a/src/components/Navbars/components/FeatureMenus/FollowingEventsMenu.js +++ b/src/components/Navbars/components/FeatureMenus/FollowingEventsMenu.js @@ -21,6 +21,7 @@ import { ChevronDownIcon } from '@chakra-ui/icons'; import { FiCalendar } from 'react-icons/fi'; import { useNavigate } from 'react-router-dom'; import { useFollowingEvents } from '../../../../hooks/useFollowingEvents'; +import { getEventDetailUrl } from '@/utils/idEncoder'; /** * 关注事件下拉菜单组件 @@ -86,7 +87,7 @@ const FollowingEventsMenu = memo(() => { navigate(`/event-detail/${ev.id}`)} + onClick={() => navigate(getEventDetailUrl(ev.id))} > diff --git a/src/contexts/NotificationContext.js b/src/contexts/NotificationContext.js index 73acc176..0ab4a93b 100644 --- a/src/contexts/NotificationContext.js +++ b/src/contexts/NotificationContext.js @@ -19,6 +19,7 @@ import { notificationMetricsService } from '../services/notificationMetricsServi import { notificationHistoryService } from '../services/notificationHistoryService'; import { PRIORITY_LEVELS, NOTIFICATION_CONFIG, NOTIFICATION_TYPES } from '../constants/notificationTypes'; import { usePermissionGuide, GUIDE_TYPES } from '../hooks/usePermissionGuide'; +import { getEventDetailUrl } from '@/utils/idEncoder'; // 连接状态枚举 const CONNECTION_STATUS = { @@ -460,7 +461,7 @@ export const NotificationProvider = ({ children }) => { timestamp: Date.now(), isAIGenerated: event.is_ai_generated || false, clickable: true, - link: `/event-detail/${event.id}`, + link: getEventDetailUrl(event.id), autoClose: autoClose, extra: { eventId: event.id, diff --git a/src/routes/routeConfig.js b/src/routes/routeConfig.js index 17d3fd24..220e11d2 100644 --- a/src/routes/routeConfig.js +++ b/src/routes/routeConfig.js @@ -98,7 +98,7 @@ export const routeConfig = [ // ==================== 事件模块 ==================== { - path: 'event-detail/:eventId', + path: 'event-detail', component: lazyComponents.EventDetail, protection: PROTECTION_MODES.REDIRECT, layout: 'main', diff --git a/src/utils/idEncoder.ts b/src/utils/idEncoder.ts new file mode 100644 index 00000000..0f7d85d5 --- /dev/null +++ b/src/utils/idEncoder.ts @@ -0,0 +1,55 @@ +/** + * ID 加密/解密工具 + * 用于隐藏 URL 中的真实 ID，防止用户猜测遍历 + * + * 使用 Base64 编码 + 前缀混淆 + * 例如: 15901 -> "ZXYtMTU5MDE" + */ + +const SECRET_PREFIX = 'ev-'; + +/** + * 加密事件 ID + * @param id - 原始 ID + * @returns 加密后的字符串 + */ +export const encodeEventId = (id: number | string): string => { + if (id === null || id === undefined) return ''; + return btoa(SECRET_PREFIX + String(id)); +}; + +/** + * 解密事件 ID + * @param encoded - 加密后的字符串 + * @returns 原始 ID，解密失败返回 null + */ +export const decodeEventId = (encoded: string): string | null => { + if (!encoded) return null; + + try { + const decoded = atob(encoded); + if (decoded.startsWith(SECRET_PREFIX)) { + return decoded.slice(SECRET_PREFIX.length); + } + // 兼容：如果是纯数字（旧链接），直接返回 + if (/^\d+$/.test(encoded)) { + return encoded; + } + return null; + } catch { + // Base64 解码失败，可能是旧的纯数字链接 + if (/^\d+$/.test(encoded)) { + return encoded; + } + return null; + } +}; + +/** + * 生成事件详情页 URL + * @param eventId - 事件 ID + * @returns 完整路径 + */ +export const getEventDetailUrl = (eventId: number | string): string => { + return `/event-detail?id=${encodeEventId(eventId)}`; +}; diff --git a/src/views/Community/hooks/useEventFilters.js b/src/views/Community/hooks/useEventFilters.js index be2ff8ae..51206708 100644 --- a/src/views/Community/hooks/useEventFilters.js +++ b/src/views/Community/hooks/useEventFilters.js @@ -6,6 +6,7 @@ import { useSearchParams } from 'react-router-dom'; import { logger } from '../../../utils/logger'; import { usePostHogTrack } from '../../../hooks/usePostHogRedux'; import { RETENTION_EVENTS } from '../../../lib/constants'; +import { getEventDetailUrl } from '@/utils/idEncoder'; /** * 事件筛选逻辑 Hook @@ -145,7 +146,7 @@ export const useEventFilters = ({ navigate, onEventClick, eventTimelineRef } = { }); if (navigate) { - navigate(`/event-detail/${eventId}`); + navigate(getEventDetailUrl(eventId)); } }, [navigate, track]); diff --git a/src/views/Dashboard/Center.js b/src/views/Dashboard/Center.js index 0ba315ec..2eb31105 100644 --- a/src/views/Dashboard/Center.js +++ b/src/views/Dashboard/Center.js @@ -62,6 +62,7 @@ import { } from 'react-icons/fi'; import MyFutureEvents from './components/MyFutureEvents'; import InvestmentPlanningCenter from './components/InvestmentPlanningCenter'; +import { getEventDetailUrl } from '@/utils/idEncoder'; export default function CenterDashboard() { const { user } = useAuth(); @@ -441,7 +442,7 @@ export default function CenterDashboard() { {event.title} diff --git a/src/views/EventDetail/index.js b/src/views/EventDetail/index.js index ba8e988c..3e56a4f1 100644 --- a/src/views/EventDetail/index.js +++ b/src/views/EventDetail/index.js @@ -1,5 +1,6 @@ import React, { useState, useEffect, useRef } from 'react'; -import { useParams, useLocation } from 'react-router-dom'; +import { useParams, useLocation, useSearchParams } from 'react-router-dom'; +import { decodeEventId } from '@/utils/idEncoder'; import { Box, Container, @@ -349,11 +350,16 @@ const PostItem = ({ post, onRefresh, eventEvents }) => { }; const EventDetail = () => { - const { eventId } = useParams(); + const { eventId: pathEventId } = useParams(); + const [searchParams] = useSearchParams(); const location = useLocation(); const bgColor = useColorModeValue('gray.50', 'gray.900'); const toast = useToast(); + // 优先从查询参数获取加密 ID，兼容旧的路径参数 + const encodedId = searchParams.get('id'); + const eventId = encodedId ? decodeEventId(encodedId) : pathEventId; + // 用户认证和权限控制 const { user } = useAuth(); const { hasFeatureAccess, getUpgradeRecommendation } = useSubscription(); @@ -385,22 +391,6 @@ const EventDetail = () => { const [submitting, setSubmitting] = useState(false); const [upgradeModal, setUpgradeModal] = useState({ isOpen: false, feature: '功能', required: 'pro' }); - // 从URL路径中提取eventId（处理多种URL格式） - const getEventIdFromPath = () => { - const pathParts = location.pathname.split('/'); - const lastPart = pathParts[pathParts.length - 1]; - const secondLastPart = pathParts[pathParts.length - 2]; - - if (!isNaN(lastPart) && lastPart) { - return lastPart; - } - if (!isNaN(secondLastPart) && secondLastPart) { - return secondLastPart; - } - return eventId; - }; - - const actualEventId = getEventIdFromPath(); // 保存当前滚动位置 const saveScrollPosition = () => { @@ -418,38 +408,38 @@ const EventDetail = () => { setError(null); // 加载基本事件信息（免费用户也可以访问） - const eventResponse = await eventService.getEventDetail(actualEventId); + const eventResponse = await eventService.getEventDetail(eventId); setEventData(eventResponse.data); // 总是尝试加载相关股票（权限在组件内部检查） let stocksCount = 0; try { - const stocksResponse = await eventService.getRelatedStocks(actualEventId); + const stocksResponse = await eventService.getRelatedStocks(eventId); setRelatedStocks(stocksResponse.data || []); stocksCount = stocksResponse.data?.length || 0; } catch (e) { - logger.warn('EventDetail', '加载相关股票失败', { eventId: actualEventId, error: e.message }); + logger.warn('EventDetail', '加载相关股票失败', { eventId: eventId, error: e.message }); setRelatedStocks([]); } // 根据权限决定是否加载相关概念 if (hasFeatureAccess('related_concepts')) { try { - const conceptsResponse = await eventService.getRelatedConcepts(actualEventId); + const conceptsResponse = await eventService.getRelatedConcepts(eventId); setRelatedConcepts(conceptsResponse.data || []); } catch (e) { - logger.warn('EventDetail', '加载相关概念失败', { eventId: actualEventId, error: e.message }); + logger.warn('EventDetail', '加载相关概念失败', { eventId: eventId, error: e.message }); } } // 历史事件所有用户都可以访问，但免费用户只看到前2条 let timelineCount = 0; try { - const eventsResponse = await eventService.getHistoricalEvents(actualEventId); + const eventsResponse = await eventService.getHistoricalEvents(eventId); setHistoricalEvents(eventsResponse.data || []); timelineCount = eventsResponse.data?.length || 0; } catch (e) { - logger.warn('EventDetail', '历史事件加载失败', { eventId: actualEventId, error: e.message }); + logger.warn('EventDetail', '历史事件加载失败', { eventId: eventId, error: e.message }); } // 🎯 追踪事件分析内容查看（数据加载完成后） @@ -463,7 +453,7 @@ const EventDetail = () => { } } catch (err) { - logger.error('EventDetail', 'loadEventData', err, { eventId: actualEventId }); + logger.error('EventDetail', 'loadEventData', err, { eventId: eventId }); setError(err.message || '加载事件数据失败'); } finally { setLoading(false); @@ -473,16 +463,16 @@ const EventDetail = () => { const refetchStocks = async () => { if (!hasFeatureAccess('related_stocks')) return; try { - const stocksResponse = await eventService.getRelatedStocks(actualEventId); + const stocksResponse = await eventService.getRelatedStocks(eventId); setRelatedStocks(stocksResponse.data); } catch (err) { - logger.error('EventDetail', 'refetchStocks', err, { eventId: actualEventId }); + logger.error('EventDetail', 'refetchStocks', err, { eventId: eventId }); } }; const handleFollowToggle = async () => { try { - await eventService.toggleFollow(actualEventId, eventData.is_following); + await eventService.toggleFollow(eventId, eventData.is_following); setEventData(prev => ({ ...prev, @@ -492,7 +482,7 @@ const EventDetail = () => { : prev.follower_count + 1 })); } catch (err) { - logger.error('EventDetail', 'handleFollowToggle', err, { eventId: actualEventId }); + logger.error('EventDetail', 'handleFollowToggle', err, { eventId: eventId }); } }; @@ -500,12 +490,12 @@ const EventDetail = () => { const loadPosts = async () => { setPostsLoading(true); try { - const result = await eventService.getPosts(actualEventId); + const result = await eventService.getPosts(eventId); if (result.success) { setPosts(result.data || []); } } catch (err) { - logger.error('EventDetail', 'loadPosts', err, { eventId: actualEventId }); + logger.error('EventDetail', 'loadPosts', err, { eventId: eventId }); } finally { setPostsLoading(false); } @@ -517,7 +507,7 @@ const EventDetail = () => { setSubmitting(true); try { - const result = await eventService.createPost(actualEventId, { + const result = await eventService.createPost(eventId, { title: newPostTitle.trim(), content: newPostContent.trim(), content_type: 'text', @@ -552,7 +542,7 @@ const EventDetail = () => { // Effect hook - must be called after all state hooks useEffect(() => { - if (actualEventId) { + if (eventId) { // 保存当前滚动位置 saveScrollPosition(); @@ -570,7 +560,7 @@ const EventDetail = () => { setError('无效的事件ID'); setLoading(false); } - }, [actualEventId, location.pathname]); + }, [eventId]); // 加载状态 if (loading) { @@ -614,9 +604,9 @@ const EventDetail = () => { {error} - {actualEventId && ( + {eventId && ( - 事件ID: {actualEventId} + 事件ID: {eventId} )} @@ -718,7 +708,7 @@ const EventDetail = () => { ) : ( { @@ -811,7 +801,7 @@ const EventDetail = () => { ) : ( )}