feat: Frontend Slack 로그인 목업 구현 계획 추가
- Slack OAuth 회원가입/로그인 목업 구현 계획 - Username 생성 우선순위: display_name > email > real_name > slack_ID - Frontend 목업만 구현, auth-server 연동은 향후 과제 - CLAUDE.md에 Frontend 배포 방식 추가
This commit is contained in:
parent
b53ffe4b1c
commit
9db8dcec76
55
ideas/250828_dynamic_system_prompt_memory.md
Normal file
55
ideas/250828_dynamic_system_prompt_memory.md
Normal file
@ -0,0 +1,55 @@
|
|||||||
|
# 동적 시스템 프롬프트 메모리 시스템
|
||||||
|
|
||||||
|
**작성일**: 2025-08-28
|
||||||
|
**카테고리**: 아이디어
|
||||||
|
**관련**: 메모리 시스템, 개인화, 학습
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 개념
|
||||||
|
사용자와의 대화 중 중요한 피드백을 실시간으로 시스템 프롬프트에 반영하여, 로빙이 즉각적으로 행동을 수정하는 동적 학습 시스템
|
||||||
|
|
||||||
|
## 핵심 기능
|
||||||
|
|
||||||
|
### 1. 동적 프롬프트 생성
|
||||||
|
```python
|
||||||
|
# 기본 시스템 프롬프트 + 사용자별 규칙 + 대화 중 학습
|
||||||
|
system_prompt = base_prompt + user_rules[user_id] + dynamic_rules[session_id]
|
||||||
|
```
|
||||||
|
|
||||||
|
### 2. 감정 가중치 반영
|
||||||
|
- 강한 부정 표현 감지 시 즉시 규칙 추가
|
||||||
|
- 예: "그 말 다시는 하지 마!" → `NEVER mention {topic}` 규칙 생성
|
||||||
|
- 감정 강도에 따른 우선순위 조정 (anger: 1.5x, frustration: 1.2x)
|
||||||
|
|
||||||
|
### 3. DB 스키마
|
||||||
|
```sql
|
||||||
|
CREATE TABLE dynamic_prompts (
|
||||||
|
id UUID PRIMARY KEY,
|
||||||
|
user_id UUID REFERENCES users(id),
|
||||||
|
robeing_id VARCHAR(50),
|
||||||
|
rule_type ENUM('never', 'always', 'prefer', 'avoid'),
|
||||||
|
content TEXT,
|
||||||
|
emotion_weight FLOAT DEFAULT 1.0,
|
||||||
|
created_at TIMESTAMP,
|
||||||
|
expires_at TIMESTAMP -- 임시 규칙 지원
|
||||||
|
);
|
||||||
|
```
|
||||||
|
|
||||||
|
## 구현 방식
|
||||||
|
- 대화 중 감정/강조 표현 실시간 감지
|
||||||
|
- DB에 규칙 저장 → 다음 대화부터 즉시 적용
|
||||||
|
- 로빙이 자체적으로 규칙 생성/삭제 가능
|
||||||
|
- 우선순위: never(1.5x) > always(1.2x) > prefer(1.0x) > avoid(0.8x)
|
||||||
|
|
||||||
|
## 활용 사례
|
||||||
|
- "그 주제 얘기하지 마" → 특정 주제 회피
|
||||||
|
- "항상 존댓말로" → 말투 고정
|
||||||
|
- "짧게 대답해" → 응답 스타일 조정
|
||||||
|
- "내 생일 기억해" → 개인정보 영구 저장
|
||||||
|
|
||||||
|
## 기대 효과
|
||||||
|
- 실시간 개인화 강화
|
||||||
|
- 사용자 만족도 향상
|
||||||
|
- 반복 학습 없이 즉시 적용
|
||||||
|
- 로빙별 고유 성격 형성
|
||||||
185
plans/250828_frontend_slack_login_mockup_plan.md
Normal file
185
plans/250828_frontend_slack_login_mockup_plan.md
Normal file
@ -0,0 +1,185 @@
|
|||||||
|
# Frontend Slack 로그인 목업 구현 계획
|
||||||
|
|
||||||
|
**작성일**: 2025-08-28
|
||||||
|
**작성자**: 51123 서버 관리자
|
||||||
|
**상태**: 🟡 계획
|
||||||
|
**목표**: Frontend에 Slack으로 회원가입/로그인 목업 구현
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 1. 개요
|
||||||
|
|
||||||
|
Google OAuth 외에 Slack으로도 처음 회원가입/로그인 가능하도록 Frontend 목업 구현.
|
||||||
|
- **회원가입**: Slack 계정으로 처음 로그인하는 사용자도 자동 가입
|
||||||
|
- **Slack 권한(스코프)**: 추후 아이템으로 별도 관리 예정
|
||||||
|
- **현재 목표**: Frontend 목업만 구현, auth-server 연동은 향후 과제
|
||||||
|
|
||||||
|
### 확인된 설정 (auth-server/.env)
|
||||||
|
- **Slack Client ID**: `9073915808149.9085704341778`
|
||||||
|
- **Slack Client Secret**: `5f8701a3c97a9e0b406817f44f5dbb5f`
|
||||||
|
- **Redirect URI**: `https://auth.ro-being.com/auth/slack/callback`
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 2. 목업 구현 (Phase 1)
|
||||||
|
|
||||||
|
### 2.1 UI 컴포넌트
|
||||||
|
```typescript
|
||||||
|
// components/slack-login-button.tsx
|
||||||
|
const SlackLoginButton = () => {
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
className="slack-login-btn"
|
||||||
|
onClick={handleMockLogin}
|
||||||
|
>
|
||||||
|
<img src="/assets/integrations/slack-logo.svg" />
|
||||||
|
Sign in with Slack
|
||||||
|
</button>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
```
|
||||||
|
|
||||||
|
### 2.2 목업 로그인 핸들러
|
||||||
|
```typescript
|
||||||
|
const handleMockLogin = () => {
|
||||||
|
// Slack이 제공하는 사용자 정보 시뮬레이션
|
||||||
|
const slackUserInfo = {
|
||||||
|
slack_id: 'U_NEW_USER_001',
|
||||||
|
email: 'john.doe@slack-team.com',
|
||||||
|
real_name: 'John Doe',
|
||||||
|
display_name: 'johndoe', // Slack 프로필 표시 이름
|
||||||
|
};
|
||||||
|
|
||||||
|
// Username 생성 우선순위
|
||||||
|
const generateUsername = (info) => {
|
||||||
|
// 1순위: display_name
|
||||||
|
if (info.display_name) return info.display_name;
|
||||||
|
// 2순위: email @ 앞부분
|
||||||
|
if (info.email) return info.email.split('@')[0];
|
||||||
|
// 3순위: real_name 첫 단어 (소문자)
|
||||||
|
if (info.real_name) return info.real_name.split(' ')[0].toLowerCase();
|
||||||
|
// 4순위: slack_{slack_id[:8]} 기본값
|
||||||
|
return `slack_${info.slack_id.substring(0, 8)}`;
|
||||||
|
};
|
||||||
|
|
||||||
|
const newSlackUser = {
|
||||||
|
...slackUserInfo,
|
||||||
|
username: generateUsername(slackUserInfo), // 'johndoe'
|
||||||
|
uuid: 'mock-uuid-' + Date.now()
|
||||||
|
};
|
||||||
|
|
||||||
|
// 목업 JWT 생성
|
||||||
|
const mockToken = btoa(JSON.stringify({
|
||||||
|
username: newSlackUser.username,
|
||||||
|
email: newSlackUser.email,
|
||||||
|
provider: 'slack',
|
||||||
|
exp: Date.now() + 86400000
|
||||||
|
}));
|
||||||
|
|
||||||
|
// localStorage 키 (문서 확인됨)
|
||||||
|
localStorage.setItem('token', mockToken); // 또는 'auth_token'
|
||||||
|
localStorage.setItem('authProvider', 'slack'); // Google과 구분
|
||||||
|
|
||||||
|
// 로그인 후 원래 페이지로 복귀
|
||||||
|
const redirectPath = localStorage.getItem('redirectAfterLogin') || '/';
|
||||||
|
localStorage.removeItem('redirectAfterLogin');
|
||||||
|
window.location.href = redirectPath;
|
||||||
|
};
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 3. 향후 auth-server 연동 계획
|
||||||
|
|
||||||
|
### 3.1 환경변수 설정
|
||||||
|
```bash
|
||||||
|
# frontend-customer/.env
|
||||||
|
VITE_API_URL=http://localhost:8001
|
||||||
|
VITE_ROBING_API_URL=https://ro-being.com/gateway
|
||||||
|
VITE_SLACK_CLIENT_ID=9073915808149.9085704341778
|
||||||
|
VITE_AUTH_SERVER_URL=https://auth.ro-being.com
|
||||||
|
```
|
||||||
|
|
||||||
|
### 3.2 OAuth URL 생성
|
||||||
|
```typescript
|
||||||
|
const generateSlackAuthUrl = () => {
|
||||||
|
const state = crypto.randomUUID();
|
||||||
|
sessionStorage.setItem('slack_oauth_state', state);
|
||||||
|
|
||||||
|
return `https://slack.com/oauth/v2/authorize?` +
|
||||||
|
`client_id=${SLACK_CLIENT_ID}&` +
|
||||||
|
`scope=openid,profile,email&` +
|
||||||
|
`redirect_uri=${encodeURIComponent(REDIRECT_URI)}&` +
|
||||||
|
`state=${state}`;
|
||||||
|
};
|
||||||
|
```
|
||||||
|
|
||||||
|
### 3.3 auth-server 연동
|
||||||
|
**현재 구현된 엔드포인트:**
|
||||||
|
- **Slack 매핑 API**: `GET /api/slack/mapping/{slack_user_id}` ✅ 동작 확인
|
||||||
|
- 반환: `{ user_id, username, email, robeing_id }`
|
||||||
|
|
||||||
|
**구현 필요한 엔드포인트:**
|
||||||
|
- **로그인 시작**: `/auth/slack/login` (미구현)
|
||||||
|
- **콜백 처리**: `/auth/slack/callback` (미구현)
|
||||||
|
- **사용자 정보**: `openid.connect.userInfo` 호출로 email, real_name, display_name 획득
|
||||||
|
- **Username 생성**: display_name > email@ 앞 > real_name 첫단어 > slack_ID 순
|
||||||
|
- **UUID 생성**: UUID5(namespace='6ba7b810-9dad-11d1-80b4-00c04fd430c8', slack_user_id)
|
||||||
|
|
||||||
|
### 3.4 Frontend 구현 필요사항
|
||||||
|
**현재 Frontend 구조:**
|
||||||
|
- 라우터: wouter 사용
|
||||||
|
- 페이지: `src/pages/` (landing, game-dashboard, inventory, ir-presentation)
|
||||||
|
|
||||||
|
**구현 필요:**
|
||||||
|
```typescript
|
||||||
|
// src/pages/slack-callback.tsx (생성 필요)
|
||||||
|
const handleSlackLogin = () => {
|
||||||
|
const currentPath = window.location.pathname;
|
||||||
|
localStorage.setItem('redirectAfterLogin', currentPath);
|
||||||
|
// Slack OAuth로 리다이렉트
|
||||||
|
};
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 4. 구현 체크리스트
|
||||||
|
|
||||||
|
### Frontend 작업
|
||||||
|
- [ ] Slack 로그인 버튼 컴포넌트 생성
|
||||||
|
- [ ] 환경변수 추가 (VITE_SLACK_CLIENT_ID, VITE_AUTH_SERVER_URL)
|
||||||
|
- [ ] OAuth state 관리 (sessionStorage)
|
||||||
|
- [ ] 콜백 페이지 라우팅 추가
|
||||||
|
- [ ] JWT 토큰 저장 및 검증 로직
|
||||||
|
|
||||||
|
### auth-server 확인사항
|
||||||
|
- [x] Slack Client ID/Secret 설정 (.env에 존재)
|
||||||
|
- [x] `/api/slack/mapping/{slack_id}` API 동작 확인
|
||||||
|
- [ ] `/auth/slack/login` 엔드포인트 (미구현)
|
||||||
|
- [ ] `/auth/slack/callback` 엔드포인트 (미구현)
|
||||||
|
- [ ] JWT 발급 로직 (미구현)
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 5. 테스트 시나리오
|
||||||
|
|
||||||
|
1. **목업 테스트 (현재 단계)**
|
||||||
|
- Slack 로그인 버튼 UI 확인
|
||||||
|
- localStorage에 'token' 키로 저장 확인
|
||||||
|
- authProvider='slack' 설정 확인
|
||||||
|
- redirectAfterLogin 처리로 원래 페이지 복귀 확인
|
||||||
|
- username='johndoe' 형식 확인
|
||||||
|
|
||||||
|
2. **향후 실제 OAuth 테스트**
|
||||||
|
- Slack OAuth 권한 승인 화면
|
||||||
|
- 신규 가입자 UUID 자동 생성
|
||||||
|
- 기존 사용자 로그인 처리
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 6. 주의사항
|
||||||
|
|
||||||
|
- **목업 단계**: 실제 Slack API 연동 없이 Frontend만 구현
|
||||||
|
- **회원가입 플로우**: Slack 로그인 = 자동 회원가입 (Google OAuth와 동일)
|
||||||
|
- **Slack 권한**: 로그인용 최소 권한만, 추가 권한은 아이템으로 관리
|
||||||
|
- **Provider 구분**: Google/Slack 로그인 구분 필요 (authProvider 저장)
|
||||||
Loading…
x
Reference in New Issue
Block a user