URL 연동
스크립트 설치 없이 어드민에서 발급된 라이브 URL 하나로 플레이어를 실행하는 연동 방식입니다. 개발 리소스가 제한적이거나 외부 채널 공유·빠른 검증이 목적인 경우 가장 빠르게 시작할 수 있습니다.
언제 URL 방식을 선택하나요?
아래 상황 중 하나라도 해당하면 URL 방식이 적합합니다. 모두 해당하지 않는다면 라이브러리 방식을 먼저 검토하세요.
빠른 시작이 필요할 때
스크립트 설치나 코드 작성 없이 URL 하나로 당일 운영이 가능합니다.
외부 채널 공유가 목적일 때
SNS, 이메일, 문자 등 자사몰 밖에서 라이브 URL을 직접 공유해야 할 때 적합합니다.
기능 검증·파일럿 단계일 때
라이브 커머스 도입 여부를 결정하기 전, 최소 비용으로 실제 라이브를 테스트합니다.
개발 리소스가 제한적일 때
프론트엔드 개발자 없이 운영팀 단독으로 라이브를 진행해야 하는 경우에 적합합니다.
⚡ URL 방식과 라이브러리 방식의 전체 비교표는 WEB 개발 가이드에서 확인할 수 있습니다. 이 페이지는 URL 방식 연동에 집중합니다.
URL 구조
어드민 송출 정보에서 확인하는 링크는 단축 URL(short link)입니다. 접속 시 아래 형태의 플레이어 URL로 자동 전환됩니다.
단축 URL
https://sflex.us/{단축코드}
플레이어 URL
https://player.sauceflex.com/broadcast/{라이브 ID}
인증 URL
https://player.sauceflex.com/broadcast/{라이브 ID}?accessToken={JWT}
⚡ 라이브 ID는 소스라이브 어드민 → 라이브 편성 → 송출 정보에서 확인할 수 있습니다. 고객성공팀에 문의하면 라이브별 전체 URL을 전달받을 수 있습니다.
시나리오별 연동 가이드
목적에 따라 시나리오를 선택하세요.
로그인 없이 URL에 접속하면 누구나 라이브를 시청할 수 있습니다. 별도 개발 작업이 필요 없으며, 어드민에서 URL을 확인하는 것만으로 바로 운영할 수 있습니다.
시청자
라이브 URL
접속
접속
→
플레이어
라이브 자동
시작
시작
→
완료
게스트 모드로
시청
시청
1
어드민에서 URL 확인
소스라이브 어드민 → 라이브 편성 → 송출 정보에서 단축 URL을 복사합니다.
2
URL 배포
SNS, 문자, 이메일, 자사몰 공지 등 원하는 채널에 URL을 공유합니다.
3
라이브 확인
라이브 시작 후 URL로 접속하여 정상 재생되는지 확인합니다.
✅ 게스트 모드 시청은 별도 개발 없이 바로 운영 가능합니다. 채팅·쿠폰·구매 등 회원 기능은 비활성화된 상태로 제공됩니다.
채팅·구매 등 회원 기능을 활성화하려면 로그인 후 JWT 토큰을 쿼리 파라미터로 전달하는 리다이렉트 흐름을 구현합니다. 사전에 고객성공팀과 PEM 키(RS256 개인키) 발급, 로그인 링크·리다이렉트 URL을 협의해야 합니다.
시청자
라이브 URL
접속
접속
→
플레이어
로그인 버튼
표시
표시
→
고객사
로그인
페이지 이동
페이지 이동
→
고객사 서버
JWT 생성
& 리다이렉트
& 리다이렉트
→
플레이어
토큰 검증
인증 완료
인증 완료
1
사전 편성 및 로그인 링크 세팅
라이브를 사전 편성하고, 플레이어에서 로그인 버튼 클릭 시 이동할 로그인 링크와 로그인 후 돌아올 리다이렉트 URL을 고객성공팀에 전달하여 설정합니다.
📧 고객성공팀에 메일 또는 카카오 채널로 문의하세요. 설정은 라이브별로 적용됩니다.
2
라이브 송출 확인
라이브 편성이 완료되면 어드민 송출 정보에 노출된 링크로 접속하여 라이브가 정상 송출되는지 확인합니다.
3
시청자가 로그인이 필요한 기능을 사용하려 할 때
시청자가 채팅 입력 또는 로그인이 필요한 기능을 시도하면 로그인 유도 버튼이 표시됩니다.
4
로그인 페이지로 이동
버튼 클릭 시 Step 1에서 설정한 로그인 링크로 이동합니다. 이때 플레이어 URL이
returnUrl 파라미터로 함께 전달됩니다.
이동 URL 예시
https://example.com/login?returnUrl=https://player.sauceflex.com/broadcast/{라이브ID}
5
로그인 완료 후 JWT 생성 및 리다이렉트
시청자가 로그인을 완료하면 고객사 서버에서 JWT 토큰을 생성하고, 플레이어 URL(
returnUrl)에 accessToken 쿼리 파라미터를 추가하여 리다이렉트합니다.
리다이렉트 URL 예시
https://player.sauceflex.com/broadcast/{라이브ID}?accessToken={JWT토큰}
🔐 JWT 토큰은 소스라이브 어드민에서 발급받은 PEM 키로 서명해야 합니다. 토큰 생성 방법은 사용자 인증 가이드를 참고하세요.
6
연동 확인
리다이렉트 이후 채팅이 활성화되고, 닉네임이 설정한 값으로 표시되면 회원 인증 연동이 완료된 것입니다.
✅ 채팅창에 설정한 닉네임이 표시되는지 확인하세요. 표시되지 않는다면 JWT 페이로드의
nickname 필드를 확인하세요.
전체 URL 흐름 예시
URL 흐름 요약
// 1. 시청자가 접속하는 라이브 URL (단축 or 전체) https://player.sauceflex.com/broadcast/lkxxxx-xxxxxx // 2. 로그인 버튼 클릭 → 고객사 로그인 페이지로 이동 https://example.com/login?returnUrl=https://player.sauceflex.com/broadcast/lkxxxx-xxxxxx // 3. 로그인 완료 → JWT를 포함한 플레이어 URL로 리다이렉트 https://player.sauceflex.com/broadcast/lkxxxx-xxxxxx?accessToken=eyJhbGciOiJSUzI1NiJ9...
⚠️ accessToken 유효 기간: JWT 토큰은 발급 후 짧은 시간 내에 사용해야 합니다. 만료된 토큰으로 접속하면 인증에 실패합니다. 서버에서 리다이렉트 시점에 토큰을 생성하도록 구현하세요.
리다이렉트 흐름 없이 플레이어 내부에서 로그인을 처리합니다. 시청자가 로그인이 필요한 기능을 시도하면 플레이어 안에 로그인 모달이 자동으로 표시됩니다. 별도 개발 작업이 필요 없으며, 사전에 고객성공팀과 활성화 설정을 협의해야 합니다.
시청자
라이브 URL
접속
접속
→
플레이어
로그인 필요
기능 시도
기능 시도
→
플레이어
로그인
모달 표시
모달 표시
→
완료
로그인 후
기능 사용
기능 사용
1
사전 설정 요청
플레이어 내 로그인 기능을 활성화하려면 소스라이브 어드민에서 별도 설정이 필요합니다. 고객성공팀에 문의하여 설정을 먼저 완료하세요.
⚠️ 지원되지 않는 기능 확인 — 상품 찜하기 등 일부 기능은 플레이어 내 로그인에서 사용할 수 없습니다. 문의 시 함께 확인하세요.
2
URL로 라이브 접속
시청자가 플레이어 URL로 접속합니다.
accessToken 파라미터 없이도 라이브를 시청할 수 있습니다.
3
로그인이 필요한 기능 시도 시 모달 자동 표시
채팅 참여, 쿠폰 다운로드, 리워드 응모 등을 시도하면 플레이어 내 로그인 모달이 자동으로 표시됩니다.
4
로그인 완료 후 기능 사용
모달에서 로그인이 완료되면 모달이 닫히고, 시도했던 기능을 이어서 사용할 수 있습니다.
라이브러리 방식으로 전환할 때
URL 방식으로 시작했더라도, 아래 상황이 생기면 라이브러리 방식으로 전환을 검토하세요. URL 방식에서 쌓은 JWT 인증 경험은 그대로 재사용할 수 있습니다.
상품 클릭 시 자사몰 상품 페이지로 이동시키고 싶을 때 — URL 방식에서는 플레이어의 상품 클릭 이벤트를 가로채서 커스텀 라우팅을 적용할 수 없습니다.
쿠폰 발급·다운로드를 자사몰 쿠폰 시스템과 연결하고 싶을 때 — 브릿지 이벤트(
sauceflexMoveCoupon)를 처리하려면 라이브러리 방식이 필요합니다.자사몰 페이지 안에 플레이어를 인라인으로 삽입하고 싶을 때 — URL 방식은 전체 페이지 이동 방식입니다. 기존 자사몰 레이아웃을 유지하면서 플레이어를 넣으려면 라이브러리가 필요합니다.
플로팅(PIP) 기능을 붙이고 싶을 때 — 페이지 스크롤 시 작은 창으로 계속 재생되는 플로팅 기능은 라이브러리 방식에서만 지원됩니다.
🔄 전환 부담은 낮습니다. URL 방식에서 이미 구현한 JWT 생성 로직은 라이브러리 방식의
setMemberToken()에서 그대로 재사용할 수 있습니다. 라이브러리 연동 가이드 →
Updated about 24 hours ago