PlaynPlay
PlaynPlay

Windows·macOS

PlaynPlay App이 PC 수강 화면을
브라우저 밖에서 재생합니다

수강생은 웹 강의실에서 재생 버튼을 누르고, 영상은 PC에 설치된 PlaynPlay App에서 재생됩니다. Windows 10 이상과 macOS 11 이상을 지원합니다. 수강생이 겪는 순서, 개발팀 준비물, 도입 전 확인할 점을 모았습니다.

최종 수정

Windows·macOS 재생을 표현한 PlaynPlay 일러스트
User Flow

수강생이 PC에서 겪는 순서

설치는 처음 한 번입니다. 그 뒤로는 웹 강의실의 버튼이 앱을 엽니다.

  1. PlaynPlay App 설치

    앱은 별도 설치 파일로 제공됩니다. 설치 안내 문구와 내려받기 위치를 웹 강의실 첫 화면에 미리 마련해 두기를 권합니다.

  2. 재생 버튼 클릭

    웹 페이지가 playnplay.launch()를 호출하면 앱이 열립니다. 플레이어 창의 너비와 높이는 호출할 때 지정합니다.

  3. 업데이트 안내

    설정 파일의 minVersion보다 낮은 버전을 쓰는 수강생에게만 업데이트 알림이 뜹니다. 값은 "latest" 또는 "1.x.x" 형식으로 적습니다.

  4. 다운로드와 오프라인 시청

    다운로드 타입으로 앱을 열거나 여러 영상을 한 번에 다운로드 목록에 넣습니다. 오프라인 재생 기한은 초 단위로 정하며, 0으로 두면 오프라인 재생이 막힙니다.

Integration

웹 강의실에 붙이는 두 가지 방식

지금 쓰는 웹 강의실을 그대로 둘지, 학습 화면 전체를 앱 안으로 옮길지에 따라 고릅니다.

  • Agent

    웹 페이지에서 앱 실행

    웹 페이지에 설정 파일(playnplay_config.js)과 agent.js를 넣습니다. 설정 파일이 agent.js보다 먼저 와야 합니다. 실행 타입은 세 가지입니다.

    • Streaming: 동영상 재생
    • Downloading: 동영상 다운로드
    • OpeningPage: 커스텀 페이지 열기
    • CDNetworks 고객사는 전용 도메인의 agent.js 사용
  • Custom Page

    앱 안에서 고객사 웹 페이지 열기

    강의 목록과 학습 화면을 고객사 웹 페이지로 만들고 PlaynPlay App 안에서 엽니다. 페이지는 playnplay.startService()로 보안 서비스를 시작하고, 같은 경로에 서비스 스크립트(playnplay-service.js)를 둡니다.

    • video 요소에서 open()으로 DRM 영상 재생
    • 북마크 조회, 추가, 제목 수정, 삭제
    • 1.0.31부터 window.open은 앱 안 새 창으로 열림
    • playnplay.close()로 앱 종료

이미 다른 서비스 워커를 쓰는 페이지라면 새 파일을 만들지 말고 기존 서비스 워커에 PlaynPlay 스크립트를 추가합니다.

Checklist

고객사 개발팀이 준비할 것

다섯 가지가 갖춰지면 PC 재생을 시험할 수 있습니다. 담당 칸은 흔히 쓰는 역할 분담 예시입니다.

준비 항목할 일권장 담당
콘솔 App콘솔에서 서비스할 App을 만들고 App Key와 App ID를 보관합니다. 라이선스 키 발급 요청에 쓰는 값입니다.서비스 운영자
영상 패키징콘솔에서 DRM 패키징 도구를 내려받아 ndrm-pkg와 ndrmconfig를 같은 폴더에 둡니다. DRM을 적용하지 않은 파일도 서비스할 수 있습니다.콘텐츠 담당
미디어 서버패키징한 파일을 미디어 서버에 올리고 재생 URL 목록을 정리합니다.인프라 담당
웹 스크립트재생 버튼에 launch() 호출을 연결하고 App ID, 사용자 ID, userData(강좌 ID 같은 식별값)를 넘깁니다.웹 개발자
Callback URL 서버콘솔에 Callback URL, Authorization(선택), 보고 주기를 등록합니다. 접근 권한 검사에는 Ok, Expired, NoRights, DeviceLimitExceeded 중 하나로 응답합니다.서버 개발자

단계별 일정과 오픈 전 점검은 도입 실행 가이드, 영상 준비 작업은 콘텐츠 패키징 운영에서 이어집니다.

Feature Table

PC에서 쓰는 기능과 설정 위치

영상마다 다른 시청 규칙은 앱을 실행할 때 넘기는 미디어 정보(MediaItem)에 담습니다.

기능PC에서 동작설정
지원 OSWindows 10 이상, macOS 11 이상별도 설치 파일
건너뛰기 제한탐색 허용 여부 지정, 기본값 허용seekable
배속 제한배속 사용 여부 지정, 기본값 허용disablePlaybackRate
이어보기서버가 준 시작 시간과 오프라인에 저장된 재생 시간 중 더 최근 값으로 시작startTime, syncedAt
구간 재생원본의 시작·끝 위치만 지정해 재생clipping
자막자막 URL, 언어, 표시 이름, 자동 선택·표시·숨김subtitles
북마크PlaynPlay 저장 또는 고객사 서버 저장useBookmarkCallback
기기 정보플랫폼, OS 버전, 아키텍처, 모델 조회getDeviceInfo()

재생 편의 기능 전체는 플레이어 기능에서 볼 수 있습니다.

PC Security

PC 보안은 앱 환경에서 처리합니다

재생은 PlaynPlay App 안에서 일어나고, 녹화 차단과 디바이스 관리는 콘솔에서 함께 다룹니다.

  • Recording

    화면 녹화 차단

    PlaynPlay App은 화면 녹화 차단·방지와 워터마크 기능을 갖추고 있습니다. 녹화 차단은 2025년 12월 1.0.31에서 개선됐습니다.

  • Lockdown

    개발 도구와 단축키 제한

    Windows 버전은 1.0.29에서 브라우저 단축키를 껐고, 1.0.28에서 개발자 도구가 열리는 문제를 고쳤습니다. 커스텀 페이지의 openDevTools()는 디버깅용이며 운영 환경에서는 쓰지 말 것을 권합니다.

  • Session Error

    재생 거부 원인 12종

    커스텀 페이지는 onSessionError로 거부 원인을 받습니다.

    • 라이선스 없음, 확인 실패, 서버 연결 실패
    • 세션 없음, 세션 종료, 동시 접속
    • 기기 제한 초과, 권한 없음, 권한 만료, 재생 제한 초과
    보안 기능 전체 보기
Dev Resources

개발팀이 먼저 열어 볼 자료

연동 전에 샘플로 동작을 확인하고, 커스텀 페이지 문제는 디버깅 툴의 로그로 찾습니다.

  • Samples

    샘플과 테스트 페이지

    재생·다운로드 테스트 페이지와 커스텀 페이지 테스트 페이지가 있습니다. 샘플 묶음은 일반 고객사용과 CDNetworks 고객사용으로 나뉘고, 서버 사이드 샘플도 따로 받습니다.

    샘플 문서 열기
  • Debugging

    커스텀 페이지 로그 보기

    앱 안에서 실행되는 커스텀 페이지의 콘솔 로그를 출력하는 툴입니다. macOS(arm64, x86_64)와 Windows(x86_64, x86)용이 있습니다.

    디버깅 문서 열기
  • Release Notes

    앱 변경 이력

    공개 이력에는 2025년 7월 1.0.26부터 12월 1.0.32까지 7개 버전이 있습니다. 1.0.32는 최신 WebView2에서 로컬 네트워크 접근 제한이 기본으로 켜지며 생긴 재생 문제를 고쳤습니다.

    변경 이력 열기

PC 도입 FAQ

  • Mac을 쓰는 수강생도 같은 방식으로 보나요?

    같은 방식입니다. Agent로 플레이어를 실행하는 절차는 Windows, macOS, iOS, Android에서 같고, macOS는 11 이상이 필요합니다. 모바일 앱 연동은 Android와 iOS 페이지에 정리했습니다.

  • 구버전 앱을 쓰는 수강생은 어떻게 관리하나요?

    설정 파일의 minVersion에 허용할 최소 버전을 적습니다. 재생 문제를 고친 버전이 나오면 그 번호로 올려 두기를 권합니다. 1.0.32의 WebView2 관련 수정이 그런 경우입니다.

  • 커스텀 페이지의 링크는 어디서 열리나요?

    1.0.31부터 window.open은 PlaynPlay App 안의 새 창으로 열립니다. 외부 브라우저로 보낼 링크는 target에 "_external"을 지정합니다. form 태그의 target="_blank"도 지원합니다.

  • 오프라인에서 본 기록도 받을 수 있나요?

    받을 수 있습니다. 1.0.26에 오프라인 재생 정보 콜백이 추가됐습니다. 재생 시작이나 종료 중 한쪽이라도 오프라인이었다면 온라인에 연결될 때 NotifyOfflinePlaybackLog로 세션별 기록이 전송됩니다.

  • DRM 패키징은 어느 컴퓨터에서 돌리나요?

    도구는 macOS(arm64, x86_64), Windows(x86_64, x86), Linux(aarch64, x86_64, x86)용 7가지 빌드가 있어 작업자 PC나 리눅스 서버 어디서든 실행합니다. 명령은 ndrm-pkg -o 뒤에 출력 폴더와 파일을 적는 형식이고, 와일드카드 **로 하위 경로 전체를 지정합니다.

Get Started

PlaynPlay 도입을 위한
기술적 지원과 서비스를 제공합니다.

제품 문의부터 데모 시연까지, 모든 지원을 위해 세일즈 및 기술 지원 팀이 준비되어 있습니다.

  • 제품 및 도입 문의

    도입 범위, 일정, 견적을 상담합니다. 서비스 형태와 사용자 규모를 알려주시면 맞는 연동 방식과 보안 설정을 제안합니다.

  • Trial 신청

    PlaynPlay의 기능을 먼저 테스트해 보세요. 트라이얼 기간 동안 귀사의 제품과 PlaynPlay를 연동하고 성능과 기능을 직접 검증할 수 있습니다.

  • PlaynPlay 기술 문의

    SDK 연동, Callback URL 설계, DRM 패키징 중에 생기는 질문에 기술팀이 답합니다. 공개된 개발 문서와 샘플 프로젝트도 함께 확인하세요.