express 썸네일형 리스트형 React 앱에서 OAuth 1.0 인증 처리하기 OAuth 1.0은 요청 서명(HMAC-SHA1), nonce, timestamp를 기반으로 동작하는 인증 방식입니다. React 같은 프론트엔드 앱에서 직접 서명을 처리하면 비밀키 노출 위험이 있어, 일반적으로 백엔드 프록시가 서명과 토큰 교환을 담당하고 프론트엔드는 최소한의 흐름만 제어합니다.1. OAuth 1.0 흐름 요약일반적인 3-legged OAuth 1.0a 흐름은 다음과 같습니다.1) 요청 토큰 받기: 서버가 consumer key/secret으로 서명한 POST를 제공자에 보내 요청 토큰(oauth_token, oauth_token_secret)을 받습니다.2) 사용자 승인: 프론트엔드가 제공자의 authorize URL로 리다이렉트하여 사용자가 승인을 완료합니다.3) 액세스 토큰 교환:.. 더보기 React 앱에서 Web Push 알림 기능 추가하기 Web Push 알림은 사용자가 브라우저를 닫아도 서버에서 메시지를 전달할 수 있는 강력한 기능입니다. React 앱에 Web Push를 추가하려면 서비스 워커, Notification API, Push API, 그리고 VAPID 키를 사용하는 백엔드가 필요합니다. 아래 단계를 그대로 따라 하면 기본 구현을 완성할 수 있습니다.1. 동작 원리 이해전체 흐름은 다음과 같습니다. 1) 서비스 워커 등록 2) 알림 권한 요청 3) PushManager로 구독 생성 4) 구독 정보를 백엔드로 저장 5) 백엔드가 web-push로 푸시 전송 6) 서비스 워커가 push 이벤트에서 알림 표시합니다.2. 사전 준비 체크리스트1) HTTPS 환경 또는 localhost 2) React 빌드가 sw.js를 서비스할 수 .. 더보기 이전 1 다음