2024/03/05

HTML5 비디오 향상 스크립트

3/05/2024 댓글 없음

HTML5 비디오 향상 스크립트

HTML5 비디오 플레이어 고급 스크립트

템퍼몽키(Tampermonkey)에서 사용할 수 있는 h5player는 대부분의 HTML5 비디오 웹사이트에 적용할 수 있는 비디오 향상 스크립트다. YouTube, 인스타그램, 트위터 등을 비롯해 Bilibili, Tencent Video, Youku, iQiyi, Baidu, PikPak, 네이버 스포츠 등과 같은 HTML5 비디오를 사용하는 웹사이트를 지원하는데, HTML5 비디오를 사용하는 야동도 예외는 아니었다.

주요 기능은 재생 속도 조절, 스크린샷, Picture-in-Picture, 전체 화면, 밝기 • 채도 • 대비 등의 설정을 단축키로 조절할 수 있다. 또한, 이 스크립트는 사용자 정의 설정 기능을 통해 사용자가 자신만의 선호 설정을 만들 수도 있다고 한다. 아쉬운 것은 선명도(Sharpness) 조절은 지원하지 않는다는 것!

아무튼, 유튜브 등의 HTML5 비디오 사이트를 자주 이용하는 사람들에게 온라인 비디오 시청 경험을 향상할 수 있는 스크립트.

h5player 테스트 영상

h5player 특징

폭넓은 호환성: video 태그가 있는 모든 웹페이지 지원. iframe, Shadowdom 내장된 경우에도 호환
크로스 도메인 제어 지원: 크로스 도메인 제한 페이지에서도 단축키 사용
여러 인스턴스 지원(예: 트위터, 인스타그램 등)
재생 진행률 기록
재생 속도 기록
비디오 화면 확대/축소
PIP 기능
Picture-in-Picture 크로스탭 제어
비디오 스크린샷
오디오 인스턴스 제어
비디오/오디오 파일의 오프라인 저장
라이브 비디오 스트림 추출
사용자 정의 기능 추가

h5player 설치

HTML5 비디오 향상 스크립트 공식 문서

1. Tampermonkey 확장 설치(필수)
2. h5player 스크립트 설치(필수)

* 한국어 메뉴 텍스트(선택): 다운로드

h5player 메뉴 한국어로 변경

1. Tampermonkey [대시보드]로 이동해서 [HTML5 비디오 플레이어 고급 스크립트]를 클릭하면 코드를 편집할 수 있다.

2. var ru 부분으로 시작하는 러시아 언어를 위에서 받은 ‘한국어 메뉴 텍스트’(복사, 붙여넣기 방법으로)로 대체한다.

3. defaultLanguage: 'en' -> defaultLanguage: 'ru', 이렇게 변경하고 저장한다. 그리고 웹브라우저를 재시작하면 메뉴가 한국어로 변경되어 있을 것이다.

그런데 굳이 언어를 변경할 필요는 없을 것 같다. 아래 단축키만 알아두면 대부분 기능을 사용할 수 있기 때문이다. 간혹 h5player 메뉴가 안 나타날 수 있는데, 그렇더라도 단축키는 먹힌다는 것.