로그아웃 처리

로그아웃 처리 — 소스라이브 플레이어

⏱ 예상 소요 시간: 10분

📋 사전 조건: 사용자 인증 연동 완료

로그아웃 처리가 필요한 이유

플레이어는 인증에 성공한 회원 토큰을 플레이어 도메인의 쿠키에 저장합니다.
자사몰과 도메인이 다르므로, 자사몰에서 로그아웃해도 이 쿠키는 남아 있습니다.

자사몰 로그아웃

→

토큰 없이 재진입

→

이전 회원으로 진입

로그아웃 시 예약값 guest 를 전달하면 저장된 회원 토큰을 폐기하고 게스트로 진입합니다.

⚠️ 공백 문자열은 로그아웃이 아닙니다. setMemberToken(' ') 처럼 빈 값을 전달하면 플레이어가 이를 토큰으로 해석하지 못해 저장된 쿠키를 그대로 사용합니다. 로그아웃에는 예약값 'guest' 를 사용합니다.

연동 방식별 호출

세 방식의 동작은 같습니다. 사용 중인 연동 방식의 것 하나만 적용합니다.

연동 방식	호출	적용 시점
라이브러리	`setMemberToken('guest')`	`load()` 전
URL	`?accessToken=guest`	플레이어 URL 생성 시
브릿지 (iframe · 앱 웹뷰)	`sauceflexEnterAsGuest`	`sauceflexEnter` 수신 직후

JavaScript — 라이브러리 방식

const memberToken = getMemberTokenFromMyServer();  // 로그아웃 상태면 null

window.SauceLiveLib.setInit({ broadcastId });
window.SauceLiveLib.setMemberToken(memberToken ?? 'guest');
window.SauceLiveLib.load();

💡 간편 인증(setMemberObject)을 사용하는 경우에도 로그아웃 상태에서는 setMemberObject 대신 setMemberToken('guest') 를 호출합니다.

URL 방식

// 로그인 상태 — 서버에서 발급한 JWT 전달
https://player.sauceflex.com/broadcast/{라이브 ID}?accessToken={JWT}

// 로그아웃 상태 — 예약값 전달

https://player.sauceflex.com/broadcast/{라이브 ID}?accessToken=guest

브릿지로 전송하기

플레이어를 iframe 이나 앱 웹뷰로 띄워 URL·라이브러리 호출을 제어할 수 없을 때 사용합니다.
sauceflexEnterAsGuest 는 자사몰·앱이 플레이어로 보내는 이벤트입니다.

📌 전송 시점은 sauceflexEnter 수신 직후입니다. 플레이어는 브릿지 수신을 준비한 직후 sauceflexEnter 를 보내고, 그 뒤 세션 처리를 시작합니다. 이 사이에 전송해야 반영됩니다.

웹 (iframe) Android iOS

JavaScript

const iframe = document.getElementById('sauce-player');

window.addEventListener('message', (e) => {
  if (typeof e.data !== 'string') return;

  const { key } = JSON.parse(e.data);
  if (key !== 'sauceflexEnter') return;
  if (isLoggedIn) return;  // 로그인 상태이면 보내지 않습니다

  iframe.contentWindow.postMessage(
    JSON.stringify({ key: 'sauceflexEnterAsGuest' }),
    '*'
  );
});

Kotlin — SauceflexBridge.kt

@JavascriptInterface
fun sauceflexEnter() {
    if (isLoggedIn) return  // 로그인 상태이면 보내지 않습니다

    activity?.runOnUiThread {
        webView.evaluateJavascript(
            "window.postMessage(JSON.stringify({ key: 'sauceflexEnterAsGuest' }), '*')",
            null
        )
    }
}

Swift — WKScriptMessageHandler

case "sauceflexEnter":
    guard !isLoggedIn else { break }  // 로그인 상태이면 보내지 않습니다

    webView.evaluateJavaScript(
        "window.postMessage(JSON.stringify({ key: 'sauceflexEnterAsGuest' }), '*')"
    )

💡 sauceflexEnter 수신 처리는 브릿지 이벤트 연동에 있습니다. 이벤트 규격은 브릿지 이벤트 레퍼런스에서 확인하세요.

동작과 제약

항목	동작
회원 토큰	저장된 회원 토큰을 폐기하고 게스트로 진입합니다.
게스트 식별자	이전에 사용하던 게스트 식별자는 유지됩니다. 회원 정보만 지워지므로, 이전 게스트 닉네임이 그대로 표시될 수 있습니다.
적용 범위	플레이어 진입 시점에 한 번 적용됩니다.

📌 이미 실행 중인 플레이어는 바뀌지 않습니다. 세션 처리가 끝난 뒤 도착한 요청은 무시됩니다. 시청 중 로그아웃을 반영하려면 플레이어를 다시 띄웁니다.

다음 단계

🪄 플로팅 플레이어 — 페이지를 이동해도 계속 시청하게 하기

→