[[Player] react-player 버전 변경

Detail Notes :

1. 최신 react-player 버전이 TV(3.0) 및 크롬 38에서 정상 동작하지 않음
> 2.15.1 -> 1.15.3 버전으로 변경
This commit is contained in:
jangheon Pyo
2024-03-12 15:18:18 +09:00
parent a7a5be07dd
commit 106234fab3
2 changed files with 61 additions and 59 deletions

View File

@@ -1,57 +1,57 @@
{ {
"name": "shopping-app-2.0", "name": "shopping-app-2.0",
"version": "2.0.0", "version": "2.0.0",
"description": "ShopTime application for webOS TVs", "description": "ShopTime application for webOS TVs",
"author": "", "author": "",
"main": "src/index.js", "main": "src/index.js",
"scripts": { "scripts": {
"serve": "enact serve", "serve": "enact serve",
"pack": "enact clean && enact pack", "pack": "enact clean && enact pack",
"build": "enact pack --production --locales=tv --verbose", "build": "enact pack --production --locales=tv --verbose",
"watch": "enact pack --watch", "watch": "enact pack --watch",
"clean": "enact clean", "clean": "enact clean",
"lint": "enact lint .", "lint": "enact lint .",
"license": "enact license", "license": "enact license",
"test": "enact test", "test": "enact test",
"test-watch": "enact test --watch" "test-watch": "enact test --watch"
}, },
"license": "UNLICENSED", "license": "UNLICENSED",
"private": true, "private": true,
"repository": "", "repository": "",
"engines": { "engines": {
"npm": ">=6.9.0" "npm": ">=6.9.0"
}, },
"enact": { "enact": {
"theme": "sandstone", "theme": "sandstone",
"ri": { "ri": {
"baseSize": 24 "baseSize": 24
} }
}, },
"eslintIgnore": [ "eslintIgnore": [
"node_modules/*", "node_modules/*",
"build/*", "build/*",
"dist/*" "dist/*"
], ],
"dependencies": { "dependencies": {
"@enact/core": "^3.3.0", "@enact/core": "^3.3.0",
"@enact/i18n": "^3.3.0", "@enact/i18n": "^3.3.0",
"@enact/sandstone": "^1.5.1", "@enact/sandstone": "^1.5.1",
"@enact/spotlight": "^3.3.0", "@enact/spotlight": "^3.3.0",
"@enact/ui": "^3.3.0", "@enact/ui": "^3.3.0",
"@enact/webos": "^3.3.0", "@enact/webos": "^3.3.0",
"axios": "^0.21.1", "axios": "^0.21.1",
"ilib": "^14.3.0", "ilib": "^14.3.0",
"prop-types": "^15.6.2", "prop-types": "^15.6.2",
"qrcode": "^1.5.3", "qrcode": "^1.5.3",
"raw-loader": "^4.0.2", "raw-loader": "^4.0.2",
"react": "^16.7.0", "react": "^16.7.0",
"react-dom": "^16.7.0", "react-dom": "^16.7.0",
"react-player": "^2.15.1", "react-player": "^1.15.3",
"react-redux": "^7.2.3", "react-redux": "^7.2.3",
"redux": "^3.7.2", "redux": "^3.7.2",
"redux-thunk": "^2.3.0" "redux-thunk": "^2.3.0"
}, },
"browserslist": [ "browserslist": [
"chrome 38" "chrome 38"
] ]
} }

View File

@@ -1,7 +1,7 @@
import React, { useCallback, useEffect, useRef, useState } from "react"; import React, { useCallback, useEffect, useRef, useState } from "react";
import classNames from "classnames"; import classNames from "classnames";
import HLSPlayer from "react-player/lazy"; import HLSPlayer from "react-player";
import { useDispatch } from "react-redux"; import { useDispatch } from "react-redux";
import Spottable from "@enact/spotlight/Spottable"; import Spottable from "@enact/spotlight/Spottable";
@@ -65,15 +65,17 @@ export default function TVideoPlayer({
) : ( ) : (
<HLSPlayer <HLSPlayer
className={""} className={""}
url={url} // 플레이어 url url={
playing={autoPlay} // 자동 재생 on = true off = false "https://qvc-amd-live.akamaized.net/hls/live/2034113/lsqvc1usott/master.m3u8"
} // 플레이어 url
playing={true} // 자동 재생 on = true off = false
muted={autoPlay} // 자동 재생 on = true off = false muted={autoPlay} // 자동 재생 on = true off = false
width={width} // 플레이어 크기 (가로) width={width} // 플레이어 크기 (가로)
height={height} // 플레이어 크기 (세로) height={height} // 플레이어 크기 (세로)
controls={false} // 플레이어 컨트롤 노출 여부 controls={false} // 플레이어 컨트롤 노출 여부
light={false} // 플레이어 모드 light={false} // 플레이어 모드
pip={false} // pip 모드 설정 여부 pip={false} // pip 모드 설정 여부
poster={""} // 플레이어 초기 포스터 사진 (작동 안함 테스트 진행) // poster={""} // 플레이어 초기 포스터 사진 작동 안함 테스트 진행
onClick={onClick} onClick={onClick}
//onEnded={() => handleVideo()} // 플레이어 끝났을 이벤트 //onEnded={() => handleVideo()} // 플레이어 끝났을 이벤트
/> />