diff --git a/requirements.txt b/requirements.txt
index 618ed54d..8c7cda8d 100644
--- a/requirements.txt
+++ b/requirements.txt
@@ -41,3 +41,4 @@ chainlit
rich
questionary
langgraph==0.4.8
+daphne
\ No newline at end of file
diff --git a/web/backend/apps/websocket/apps.py b/web/backend/apps/websocket/apps.py
index 3be36af2..70c31e36 100644
--- a/web/backend/apps/websocket/apps.py
+++ b/web/backend/apps/websocket/apps.py
@@ -1,6 +1,6 @@
from django.apps import AppConfig
-
+
class WebsocketConfig(AppConfig):
default_auto_field = 'django.db.models.BigAutoField'
name = 'apps.websocket'
diff --git a/web/backend/apps/websocket/consumers.py b/web/backend/apps/websocket/consumers.py
index 38d355d4..d324b436 100644
--- a/web/backend/apps/websocket/consumers.py
+++ b/web/backend/apps/websocket/consumers.py
@@ -1,15 +1,11 @@
import json
from channels.generic.websocket import AsyncWebsocketConsumer
from channels.db import database_sync_to_async
-from django.contrib.auth.models import AnonymousUser
from rest_framework_simplejwt.tokens import UntypedToken
from rest_framework_simplejwt.exceptions import InvalidToken, TokenError
-from django.contrib.auth import get_user_model
from django.conf import settings
import jwt
-User = get_user_model()
-
class TradingAnalysisConsumer(AsyncWebsocketConsumer):
"""거래 분석 실시간 업데이트 WebSocket Consumer"""
@@ -121,6 +117,10 @@ class TradingAnalysisConsumer(AsyncWebsocketConsumer):
@database_sync_to_async
def get_user_from_token(self):
"""JWT 토큰에서 사용자 정보 추출"""
+ from django.contrib.auth import get_user_model
+ from django.contrib.auth.models import AnonymousUser
+
+ User = get_user_model()
try:
# URL에서 토큰 추출 (query parameter 또는 header)
token = None
@@ -142,13 +142,16 @@ class TradingAnalysisConsumer(AsyncWebsocketConsumer):
# JWT 토큰 검증
try:
- UntypedToken(token) # 토큰 유효성 검사
+ # simplejwt 설정에서 올바른 서명 키와 알고리즘 가져오기
+ from rest_framework_simplejwt.settings import api_settings
+
+ UntypedToken(token) # 토큰 기본 구조 검증
# 토큰에서 사용자 ID 추출
decoded_token = jwt.decode(
- token,
- settings.SECRET_KEY,
- algorithms=['HS256']
+ token,
+ api_settings.SIGNING_KEY, # 올바른 서명 키 사용
+ algorithms=[api_settings.ALGORITHM] # 올바른 알고리즘 사용
)
user_id = decoded_token.get('user_id')
@@ -171,6 +174,7 @@ class TradingAnalysisConsumer(AsyncWebsocketConsumer):
def check_session_ownership(self, session_id):
"""분석 세션 소유권 확인"""
try:
+ # 지연 import
from apps.authentication.models import AnalysisSession
session = AnalysisSession.objects.get(id=session_id, user=self.user)
return True
diff --git a/web/backend/reset_and_run.sh b/web/backend/reset_and_run.sh
index 3f14df06..36023437 100644
--- a/web/backend/reset_and_run.sh
+++ b/web/backend/reset_and_run.sh
@@ -2,6 +2,9 @@
echo "🚀 Django 서버 시작 - 데이터베이스 초기화"
+# Django 설정 모듈 환경 변수 설정
+export DJANGO_SETTINGS_MODULE=tradingagents_web.settings
+
# 1. 데이터베이스 초기화
echo "🔄 데이터베이스 초기화 중..."
docker exec -i tradingagents_mysql mysql -u root -ppassword -e "
@@ -25,6 +28,6 @@ if not User.objects.filter(email='admin@example.com').exists():
print('✅ 관리자: admin@example.com / admin123!');
"
-# 4. 서버 시작
+# 4. 서버 시작 (환경 변수와 함께)
echo "🎉 서버 시작!"
-python manage.py runserver
\ No newline at end of file
+daphne -b 0.0.0.0 -p 8000 tradingagents_web.asgi:application
\ No newline at end of file
diff --git a/web/backend/tradingagents_web/asgi.py b/web/backend/tradingagents_web/asgi.py
index 3a78e90a..3844394b 100644
--- a/web/backend/tradingagents_web/asgi.py
+++ b/web/backend/tradingagents_web/asgi.py
@@ -8,12 +8,15 @@ https://docs.djangoproject.com/en/4.2/howto/deployment/asgi/
"""
import os
+import django
from django.core.asgi import get_asgi_application
-from channels.routing import ProtocolTypeRouter, URLRouter
-from channels.auth import AuthMiddlewareStack
-import apps.websocket.routing
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'tradingagents_web.settings')
+django.setup()
+
+from channels.auth import AuthMiddlewareStack
+from channels.routing import ProtocolTypeRouter, URLRouter
+import apps.websocket.routing
application = ProtocolTypeRouter({
"http": get_asgi_application(),
diff --git a/web/frontend/src/pages/Analysis/Analysis.js b/web/frontend/src/pages/Analysis/Analysis.js
index d60b797f..e49cd6bb 100644
--- a/web/frontend/src/pages/Analysis/Analysis.js
+++ b/web/frontend/src/pages/Analysis/Analysis.js
@@ -1,33 +1,129 @@
-import React from 'react';
-import { Card, Typography } from 'antd';
-import styled from 'styled-components';
+// web/frontend/src/pages/Analysis/Analysis.js
-const { Title, Text } = Typography;
+import React, { useState, useEffect } from 'react';
+import { Card, Divider, Spin, Alert, Typography } from 'antd';
+import styled from 'styled-components';
+import api from '../../services/api';
+import { useWebSocket } from '../../contexts/WebSocketContext';
+import AnalysisForm from './components/AnalysisForm';
+import AnalysisDisplay from './components/AnalysisDisplay';
+
+const { Title, Paragraph } = Typography;
const AnalysisContainer = styled.div`
- max-width: 800px;
+ max-width: 900px;
margin: 0 auto;
+ padding: ${props => props.theme.spacing.lg};
`;
-const PlaceholderCard = styled(Card)`
- text-align: center;
- padding: ${props => props.theme.spacing.xl};
- background: linear-gradient(135deg, #f0f2f5 0%, #e6f7ff 100%);
+const CustomPageHeader = styled(Card)`
+ border: none;
+ background-color: transparent;
+ .ant-card-body {
+ padding: 0;
+ }
`;
const Analysis = () => {
+ const [currentSessionId, setCurrentSessionId] = useState(null);
+ const [analysisStatus, setAnalysisStatus] = useState('idle'); // idle, running, completed, failed
+ const [error, setError] = useState(null);
+ const [finalReport, setFinalReport] = useState(null);
+
+ const { subscribeToAnalysis, analysisProgress, messages, clearMessages, clearAnalysisProgress } = useWebSocket();
+
+ // WebSocket 메시지로부터 상태 업데이트
+ useEffect(() => {
+ if (currentSessionId && analysisProgress[currentSessionId]) {
+ const progress = analysisProgress[currentSessionId];
+ setAnalysisStatus(progress.status);
+ if (progress.status === 'completed') {
+ setFinalReport(progress.result);
+ } else if (progress.status === 'failed') {
+ setError(progress.error || '분석 중 알 수 없는 오류가 발생했습니다.');
+ }
+ }
+ }, [analysisProgress, currentSessionId]);
+
+ // 분석 시작 핸들러
+ const handleStartAnalysis = async (values) => {
+ setAnalysisStatus('starting');
+ setError(null);
+ setFinalReport(null);
+ clearMessages();
+ if(currentSessionId) clearAnalysisProgress(currentSessionId);
+
+ try {
+ const response = await api.post('/api/trading/start-analysis/', values);
+ const { session_id } = response.data;
+
+ setCurrentSessionId(session_id);
+ subscribeToAnalysis(session_id);
+ setAnalysisStatus('running');
+
+ } catch (err) {
+ const errorMessage = err.response?.data?.error || '분석 시작에 실패했습니다.';
+ setError(errorMessage);
+ setAnalysisStatus('failed');
+ }
+ };
+
+ // 새 분석 시작 핸들러 (Display 컴포넌트에서 호출)
+ const handleNewAnalysis = () => {
+ if(currentSessionId) clearAnalysisProgress(currentSessionId);
+ setCurrentSessionId(null);
+ setAnalysisStatus('idle');
+ setError(null);
+ setFinalReport(null);
+ clearMessages();
+ };
+
+ const renderContent = () => {
+ if (analysisStatus === 'starting') {
+ return
;
+ }
+
+ if (currentSessionId && (analysisStatus === 'running' || analysisStatus === 'completed' || analysisStatus === 'failed')) {
+ return (
+ m.sessionId === currentSessionId)}
+ finalReport={finalReport}
+ onNewAnalysis={handleNewAnalysis}
+ />
+ );
+ }
+
+ return ;
+ };
+
return (
-
- 분석 시작 페이지
-
- 여기에 거래 분석을 시작할 수 있는 폼이 들어갑니다.
-
- 종목 선택, 분석 옵션 설정, 분석가 선택 등의 기능이 포함됩니다.
-
-
+
+ AI 기반 주식 분석
+
+ 관심 있는 종목에 대한 심층 분석을 시작하세요.
+
+
+
+
+ {error && !currentSessionId && ( // Show top-level error only when no session is active
+ setError(null)}
+ style={{ marginBottom: '24px' }}
+ />
+ )}
+
+ {renderContent()}
);
};
-export default Analysis;
\ No newline at end of file
+export default Analysis;
\ No newline at end of file
diff --git a/web/frontend/src/pages/Analysis/components/AnalysisDisplay.js b/web/frontend/src/pages/Analysis/components/AnalysisDisplay.js
new file mode 100644
index 00000000..5a33abc4
--- /dev/null
+++ b/web/frontend/src/pages/Analysis/components/AnalysisDisplay.js
@@ -0,0 +1,112 @@
+import React, { useRef, useEffect } from 'react';
+import { Card, Progress, Timeline, Button, Result, Typography, Empty, Tag } from 'antd';
+import { FileDoneOutlined, RedoOutlined } from '@ant-design/icons';
+import styled from 'styled-components';
+import ReactMarkdown from 'react-markdown';
+
+const { Title, Paragraph, Text } = Typography;
+
+const DisplayCard = styled(Card)`
+ border-radius: ${props => props.theme.borderRadius.lg};
+ box-shadow: ${props => props.theme.shadows.lg};
+ margin-top: ${props => props.theme.spacing.lg};
+`;
+
+const TimelineContainer = styled.div`
+ max-height: 400px;
+ overflow-y: auto;
+ padding: ${props => props.theme.spacing.md};
+ border: 1px solid ${props => props.theme.colors.border};
+ border-radius: ${props => props.theme.borderRadius.md};
+ background-color: ${props => props.theme.colors.backgroundSecondary};
+`;
+
+const ReportContainer = styled.div`
+ margin-top: ${props => props.theme.spacing.lg};
+ padding: ${props => props.theme.spacing.lg};
+ background-color: #fafafa;
+ border-radius: ${props => props.theme.borderRadius.md};
+`;
+
+const agentTagColors = {
+ market: 'blue',
+ social: 'cyan',
+ news: 'green',
+ fundamentals: 'purple',
+};
+
+const AnalysisDisplay = ({ sessionId, status, progress, messages, finalReport, onNewAnalysis }) => {
+ const timelineEndRef = useRef(null);
+
+ useEffect(() => {
+ timelineEndRef.current?.scrollIntoView({ behavior: 'smooth' });
+ }, [messages]);
+
+ const renderRunningState = () => (
+ <>
+ 분석 진행 중...
+ AI 분석가들이 정보를 수집하고 분석하고 있습니다. (세션 ID: {sessionId})
+
+ {progress?.message}
+
+
+
+ {messages.length > 0 ? messages.map(msg => (
+
+
+ {msg.agent}
+ {new Date(msg.timestamp).toLocaleTimeString()}
+
+ {msg.content}
+
+ )) : }
+
+
+
+
+ );
+
+ const renderCompletedState = () => (
+ }
+ subTitle="아래에서 생성된 최종 보고서를 확인하세요."
+ extra={[
+ } onClick={onNewAnalysis}>
+ 새 분석 시작
+
+ ]}
+ />
+ );
+
+ const renderFailedState = () => (
+ } onClick={onNewAnalysis}>
+ 다시 시도
+
+ ]}
+ />
+ );
+
+ return (
+
+ {status === 'running' && renderRunningState()}
+ {status === 'completed' && renderCompletedState()}
+ {status === 'failed' && renderFailedState()}
+
+ {status === 'completed' && finalReport && (
+
+ 최종 분석 보고서
+ {finalReport}
+
+ )}
+
+ );
+};
+
+export default AnalysisDisplay;
\ No newline at end of file
diff --git a/web/frontend/src/pages/Analysis/components/AnalysisForm.js b/web/frontend/src/pages/Analysis/components/AnalysisForm.js
new file mode 100644
index 00000000..f75ac69e
--- /dev/null
+++ b/web/frontend/src/pages/Analysis/components/AnalysisForm.js
@@ -0,0 +1,119 @@
+import React from 'react';
+import { Form, Input, Button, Card, Select, Slider, Checkbox, Row, Col, Typography } from 'antd';
+import { FundOutlined, SendOutlined } from '@ant-design/icons';
+import styled from 'styled-components';
+
+const { Title } = Typography;
+const { Option } = Select;
+
+const FormCard = styled(Card)`
+ border-radius: ${props => props.theme.borderRadius.lg};
+ box-shadow: ${props => props.theme.shadows.lg};
+`;
+
+const analystsOptions = [
+ { label: '시장 분석가 (Market)', value: 'market' },
+ { label: '소셜 분석가 (Social)', value: 'social' },
+ { label: '뉴스 분석가 (News)', value: 'news' },
+ { label: '재무 분석가 (Fundamentals)', value: 'fundamentals' },
+];
+
+const AnalysisForm = ({ onStartAnalysis, loading }) => {
+ const [form] = Form.useForm();
+
+ const handleSubmit = (values) => {
+ onStartAnalysis(values);
+ };
+
+ return (
+
+ 새 분석 시작
+
+
+ );
+};
+
+export default AnalysisForm;
\ No newline at end of file
diff --git a/web/frontend/src/pages/Dashboard/Dashboard.js b/web/frontend/src/pages/Dashboard/Dashboard.js
index 9b34368d..c296ca56 100644
--- a/web/frontend/src/pages/Dashboard/Dashboard.js
+++ b/web/frontend/src/pages/Dashboard/Dashboard.js
@@ -97,7 +97,7 @@ const Dashboard = () => {
});
const [recentAnalyses, setRecentAnalyses] = useState([]);
const { user } = useAuth();
- const { connected, analysisProgress } = useWebSocket();
+ const { connected, messages } = useWebSocket();
const navigate = useNavigate();
useEffect(() => {