1 line
15 KiB
JSON
1 line
15 KiB
JSON
{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\Administrator\\\\Desktop\\\\Project\\\\Test\\\\live-streaming\\\\client\\\\src\\\\components\\\\LivePlayer.jsx\",\n _s = $RefreshSig$();\nimport { useEffect, useRef, useState } from 'react';\nimport flvjs from 'flv.js';\nimport Hls from 'hls.js';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\nfunction LivePlayer({\n room\n}) {\n _s();\n const videoRef = useRef(null);\n const playerRef = useRef(null);\n const [error, setError] = useState(null);\n const [playerType, setPlayerType] = useState(null);\n useEffect(() => {\n if (!(room !== null && room !== void 0 && room.isLive) || !(room !== null && room !== void 0 && room.streamUrls)) return;\n const video = videoRef.current;\n const {\n flv: flvUrl,\n hls: hlsUrl\n } = room.streamUrls;\n\n // 优先使用 FLV (低延迟)\n if (flvjs.isSupported()) {\n console.log('使用 FLV 播放器');\n setPlayerType('FLV');\n const player = flvjs.createPlayer({\n type: 'flv',\n url: flvUrl,\n isLive: true\n }, {\n enableWorker: true,\n enableStashBuffer: false,\n stashInitialSize: 128\n });\n player.attachMediaElement(video);\n player.load();\n player.play().catch(console.error);\n player.on(flvjs.Events.ERROR, (type, detail) => {\n console.error('FLV 错误:', type, detail);\n setError('播放出错，正在重试...');\n // 3秒后重试\n setTimeout(() => {\n player.unload();\n player.load();\n player.play().catch(console.error);\n setError(null);\n }, 3000);\n });\n playerRef.current = player;\n }\n // 降级到 HLS\n else if (Hls.isSupported()) {\n console.log('使用 HLS 播放器');\n setPlayerType('HLS');\n const hls = new Hls({\n liveSyncDurationCount: 3,\n liveMaxLatencyDurationCount: 6\n });\n hls.loadSource(hlsUrl);\n hls.attachMedia(video);\n hls.on(Hls.Events.MANIFEST_PARSED, () => {\n video.play().catch(console.error);\n });\n hls.on(Hls.Events.ERROR, (event, data) => {\n console.error('HLS 错误:', data);\n if (data.fatal) {\n setError('播放出错');\n }\n });\n playerRef.current = hls;\n }\n // 原生 HLS (Safari)\n else if (video.canPlayType('application/vnd.apple.mpegurl')) {\n console.log('使用原生 HLS');\n setPlayerType('Native HLS');\n video.src = hlsUrl;\n video.play().catch(console.error);\n }\n return () => {\n if (playerRef.current) {\n if (playerRef.current.destroy) {\n playerRef.current.destroy();\n } else if (playerRef.current.unload) {\n playerRef.current.unload();\n playerRef.current.detachMediaElement();\n }\n playerRef.current = null;\n }\n };\n }, [room]);\n if (!(room !== null && room !== void 0 && room.isLive)) {\n return /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"player-container\",\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n style: {\n height: 400,\n background: '#1a1a1a',\n borderRadius: 8,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexDirection: 'column',\n color: '#666'\n },\n children: [/*#__PURE__*/_jsxDEV(\"span\", {\n style: {\n fontSize: 48,\n marginBottom: 20\n },\n children: \"\\uD83D\\uDCFA\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 109,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"p\", {\n children: \"\\u4E3B\\u64AD\\u6682\\u672A\\u5F00\\u64AD\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 110,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 99,\n columnNumber: 9\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 98,\n columnNumber: 7\n }, this);\n }\n return /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"player-container\",\n children: [/*#__PURE__*/_jsxDEV(\"video\", {\n ref: videoRef,\n controls: true,\n autoPlay: true,\n muted: true,\n style: {\n width: '100%',\n background: '#000',\n borderRadius: 8\n }\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 118,\n columnNumber: 7\n }, this), error && /*#__PURE__*/_jsxDEV(\"p\", {\n style: {\n color: '#ff4757',\n marginTop: 10\n },\n children: error\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 125,\n columnNumber: 17\n }, this), playerType && /*#__PURE__*/_jsxDEV(\"p\", {\n style: {\n color: '#666',\n fontSize: 12,\n marginTop: 5\n },\n children: [\"\\u64AD\\u653E\\u5668: \", playerType]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 127,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 117,\n columnNumber: 5\n }, this);\n}\n_s(LivePlayer, \"tCor1TfIXxlbHS7FbcIyUbBfL/U=\");\n_c = LivePlayer;\nexport default LivePlayer;\nvar _c;\n$RefreshReg$(_c, \"LivePlayer\");","map":{"version":3,"names":["useEffect","useRef","useState","flvjs","Hls","jsxDEV","_jsxDEV","LivePlayer","room","_s","videoRef","playerRef","error","setError","playerType","setPlayerType","isLive","streamUrls","video","current","flv","flvUrl","hls","hlsUrl","isSupported","console","log","player","createPlayer","type","url","enableWorker","enableStashBuffer","stashInitialSize","attachMediaElement","load","play","catch","on","Events","ERROR","detail","setTimeout","unload","liveSyncDurationCount","liveMaxLatencyDurationCount","loadSource","attachMedia","MANIFEST_PARSED","event","data","fatal","canPlayType","src","destroy","detachMediaElement","className","children","style","height","background","borderRadius","display","alignItems","justifyContent","flexDirection","color","fontSize","marginBottom","fileName","_jsxFileName","lineNumber","columnNumber","ref","controls","autoPlay","muted","width","marginTop","_c","$RefreshReg$"],"sources":["C:/Users/Administrator/Desktop/Project/Test/live-streaming/client/src/components/LivePlayer.jsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\r\nimport flvjs from 'flv.js';\r\nimport Hls from 'hls.js';\r\n\r\nfunction LivePlayer({ room }) {\r\n const videoRef = useRef(null);\r\n const playerRef = useRef(null);\r\n const [error, setError] = useState(null);\r\n const [playerType, setPlayerType] = useState(null);\r\n\r\n useEffect(() => {\r\n if (!room?.isLive || !room?.streamUrls) return;\r\n\r\n const video = videoRef.current;\r\n const { flv: flvUrl, hls: hlsUrl } = room.streamUrls;\r\n\r\n // 优先使用 FLV (低延迟)\r\n if (flvjs.isSupported()) {\r\n console.log('使用 FLV 播放器');\r\n setPlayerType('FLV');\r\n \r\n const player = flvjs.createPlayer({\r\n type: 'flv',\r\n url: flvUrl,\r\n isLive: true\r\n }, {\r\n enableWorker: true,\r\n enableStashBuffer: false,\r\n stashInitialSize: 128\r\n });\r\n\r\n player.attachMediaElement(video);\r\n player.load();\r\n player.play().catch(console.error);\r\n\r\n player.on(flvjs.Events.ERROR, (type, detail) => {\r\n console.error('FLV 错误:', type, detail);\r\n setError('播放出错，正在重试...');\r\n // 3秒后重试\r\n setTimeout(() => {\r\n player.unload();\r\n player.load();\r\n player.play().catch(console.error);\r\n setError(null);\r\n }, 3000);\r\n });\r\n\r\n playerRef.current = player;\r\n } \r\n // 降级到 HLS\r\n else if (Hls.isSupported()) {\r\n console.log('使用 HLS 播放器');\r\n setPlayerType('HLS');\r\n \r\n const hls = new Hls({\r\n liveSyncDurationCount: 3,\r\n liveMaxLatencyDurationCount: 6\r\n });\r\n\r\n hls.loadSource(hlsUrl);\r\n hls.attachMedia(video);\r\n hls.on(Hls.Events.MANIFEST_PARSED, () => {\r\n video.play().catch(console.error);\r\n });\r\n\r\n hls.on(Hls.Events.ERROR, (event, data) => {\r\n console.error('HLS 错误:', data);\r\n if (data.fatal) {\r\n setError('播放出错');\r\n }\r\n });\r\n\r\n playerRef.current = hls;\r\n }\r\n // 原生 HLS (Safari)\r\n else if (video.canPlayType('application/vnd.apple.mpegurl')) {\r\n console.log('使用原生 HLS');\r\n setPlayerType('Native HLS');\r\n video.src = hlsUrl;\r\n video.play().catch(console.error);\r\n }\r\n\r\n return () => {\r\n if (playerRef.current) {\r\n if (playerRef.current.destroy) {\r\n playerRef.current.destroy();\r\n } else if (playerRef.current.unload) {\r\n playerRef.current.unload();\r\n playerRef.current.detachMediaElement();\r\n }\r\n playerRef.current = null;\r\n }\r\n };\r\n }, [room]);\r\n\r\n if (!room?.isLive) {\r\n return (\r\n <div className=\"player-container\">\r\n <div style={{ \r\n height: 400, \r\n background: '#1a1a1a', \r\n borderRadius: 8,\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n flexDirection: 'column',\r\n color: '#666'\r\n }}>\r\n <span style={{ fontSize: 48, marginBottom: 20 }}>📺</span>\r\n <p>主播暂未开播</p>\r\n </div>\r\n </div>\r\n );\r\n }\r\n\r\n return (\r\n <div className=\"player-container\">\r\n <video \r\n ref={videoRef} \r\n controls \r\n autoPlay \r\n muted\r\n style={{ width: '100%', background: '#000', borderRadius: 8 }}\r\n />\r\n {error && <p style={{ color: '#ff4757', marginTop: 10 }}>{error}</p>}\r\n {playerType && (\r\n <p style={{ color: '#666', fontSize: 12, marginTop: 5 }}>\r\n 播放器: {playerType}\r\n </p>\r\n )}\r\n </div>\r\n );\r\n}\r\n\r\nexport default LivePlayer;\r\n"],"mappings":"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","ignoreList":[]},"metadata":{},"sourceType":"module","externalDependencies":[]} |