쿠키/스토리지

🍪 쿠키 관리

쿠키 설정

// Vue/React에서
await bridge.setCookie('session_id', 'abc123', {
  domain: '.example.com',
  path: '/',
  maxAge: 86400,  // 1일
  secure: true,
  httpOnly: true
});

쿠키 읽기

// JavaScript
const cookies = document.cookie
  .split(';')
  .reduce((acc, cookie) => {
    const [name, value] = cookie.trim().split('=');
    acc[name] = value;
    return acc;
  }, {});

💾 로컬 스토리지

데이터 저장

// Vue/React
await bridge.saveData('user', {
  id: 123,
  name: 'John',
  email: 'john@example.com'
});

데이터 불러오기

const user = await bridge.loadData('user');
console.log(user.name); // 'John'

🔄 세션 스토리지

🔐 보안 저장소

민감한 데이터(토큰, 비밀번호 등)는 암호화된 저장소에 저장됩니다. (Native단에서 자동 암호화 처리)

// 저장
await bridge.saveSecure('auth_token', token);

// 읽기
const token = await bridge.loadSecure('auth_token');

// 삭제
await bridge.deleteSecure('auth_token');

🎯 실전 예제

인증 토큰 관리

// 로그인 후
const token = 'eyJhbGciOiJIUzI1NiIs...';

// 보안 저장
await bridge.saveSecure('auth_token', token);

// API 호출 시 사용
const token = await bridge.loadSecure('auth_token');
fetch('/api/user', {
  headers: { 'Authorization': `Bearer ${token}` }
});

오프라인 데이터

// 온라인일 때 저장
const posts = await fetchPosts();
await bridge.saveData('cached_posts', posts);

// 오프라인일 때
if (!navigator.onLine) {
  const posts = await bridge.loadData('cached_posts');
  displayPosts(posts);
}

⚠️ 주의사항

• 용량 제한: saveData는 작은 데이터만 (KB 단위)
• 암호화: 민감한 데이터는 saveSecure 사용
• HTTPS: Secure 쿠키는 HTTPS에서만
• 만료: 토큰 만료 처리 필수
• 삭제: 로그아웃 시 모든 데이터 삭제

💡 베스트 프랙티스

• ✅ 토큰은 saveSecure 사용
• ✅ 설정은 saveData 사용
• ✅ 세션 데이터는 sessionStorage 사용
• ✅ HTTPS 전용 Secure 쿠키 권장

안전한 데이터 관리로 사용자 개인정보를 보호하세요!