CN-JS-HuiBai/Media-Coding-Web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

添加RKMPP

Browse Source
This commit is contained in:
CN-JS-HuiBai
2026-04-03 21:31:38 +08:00
parent 2288370976
commit d5b70833e6
4 changed files with 101 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
public/js/main.js
View File

@@ -10,8 +10,10 @@ document.addEventListener('DOMContentLoaded', () => {
const loginPasswordInput = document.getElementById('login-password');
const loginBtn = document.getElementById('login-btn');
const loginError = document.getElementById('login-error');
const codecSelect = document.getElementById('codec-select');
const decoderSelect = document.getElementById('decoder-select');
const encoderSelect = document.getElementById('encoder-select');
const decoderLabel = document.querySelector('label[for="decoder-select"]');
const encoderLabel = document.querySelector('label[for="encoder-select"]');
const playerOverlay = document.getElementById('player-overlay');
const transcodingOverlay = document.getElementById('transcoding-overlay');
const videoPlayer = document.getElementById('video-player');
@@ -89,6 +91,12 @@ document.addEventListener('DOMContentLoaded', () => {
if (playbackSpeed) {
videoPlayer.playbackRate = parseFloat(playbackSpeed.value) || 1;
}
if (decoderLabel) {
decoderLabel.textContent = '视频解码器：';
}
if (encoderLabel) {
encoderLabel.textContent = '视频编码器：';
}
const formatBytes = (bytes) => {
if (!bytes || bytes === 0) return '0 B';
@@ -114,11 +122,30 @@ document.addEventListener('DOMContentLoaded', () => {
const createStreamSessionId = () => `${Date.now()}-${Math.random().toString(36).slice(2, 10)}`;
const populateSelect = (selectEl, options, fallbackValue) => {
if (!selectEl) return;
selectEl.innerHTML = '';
(options || []).forEach((item) => {
const option = document.createElement('option');
option.value = item.value;
option.textContent = item.label || item.value;
selectEl.appendChild(option);
});
const preferredValue = options?.some((item) => item.value === fallbackValue)
? fallbackValue
: options?.[0]?.value;
if (preferredValue) {
selectEl.value = preferredValue;
}
};
const buildStreamUrl = (targetSeconds = null) => {
const codec = codecSelect?.value || 'h264';
const encoder = encoderSelect?.value || 'software';
const decoder = decoderSelect?.value || 'auto';
const encoder = encoderSelect?.value || 'h264_rkmpp';
const streamSessionId = createStreamSessionId();
let streamUrl = `/api/stream?bucket=${encodeURIComponent(selectedBucket)}&key=${encodeURIComponent(selectedKey)}&codec=${encodeURIComponent(codec)}&encoder=${encodeURIComponent(encoder)}&streamSessionId=${encodeURIComponent(streamSessionId)}`;
let streamUrl = `/api/stream?bucket=${encodeURIComponent(selectedBucket)}&key=${encodeURIComponent(selectedKey)}&decoder=${encodeURIComponent(decoder)}&encoder=${encodeURIComponent(encoder)}&streamSessionId=${encodeURIComponent(streamSessionId)}`;
if (typeof targetSeconds === 'number' && Number.isFinite(targetSeconds) && targetSeconds > 0) {
streamUrl += `&ss=${targetSeconds}`;
}
@@ -584,6 +611,8 @@ document.addEventListener('DOMContentLoaded', () => {
topBanner.textContent = title;
topBanner.classList.remove('hidden');
document.title = title;
populateSelect(decoderSelect, data.videoDecoders || [], data.defaultVideoDecoder || 'auto');
populateSelect(encoderSelect, data.videoEncoders || [], data.defaultVideoEncoder || 'h264_rkmpp');
} catch (err) {
console.error('Config load failed:', err);
}
@@ -908,8 +937,6 @@ document.addEventListener('DOMContentLoaded', () => {
transcodingOverlay.classList.remove('hidden');
try {
const codec = codecSelect?.value || 'h264';
const encoder = encoderSelect?.value || 'software';
if (!selectedBucket) throw new Error('No bucket selected');
const streamUrl = buildStreamUrl();
videoPlayer.src = streamUrl;