ghaymah_dev/codepill-sfu
2
0
نسخ 0
الشفرة المشكلات طلبات السحب Actions Packages المشاريع الإصدارات الويكي النشاط

[mirotalksfu] - allow RTMP stream from all major browser

تصفح المصدر
هذا الالتزام موجود في:
Miroslav Pejic
2024-07-07 16:04:46 +02:00
الأصل ebbb4edef5
التزام 8ce19c20bb
11 ملفات معدلة مع 59 إضافات و79 حذوفات
تنزيل ملف التصحيح تنزيل ملف الاختلاف توسيع جميع الملفات طي جميع الملفات

1
app/src/RtmpStreamer.js
عرض الملف

@@ -24,7 +24,6 @@ class RtmpStreamer {
this.ffmpegStream = ffmpeg()
.input(this.stream)
.inputOptions('-re')
.inputFormat('webm')
.videoCodec('libx264')
.videoBitrate('3000k')
.size('1280x720')

2
app/src/Server.js
عرض الملف

@@ -44,7 +44,7 @@ dependencies: {
* @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
* @version 1.4.87
* @version 1.4.88
*
*/

2
package.json
عرض الملف

@@ -1,6 +1,6 @@
{
"name": "mirotalksfu",
"version": "1.4.87",
"version": "1.4.88",
"description": "WebRTC SFU browser-based video calls",
"main": "Server.js",
"scripts": {

4
public/js/Room.js
عرض الملف

@@ -11,7 +11,7 @@ if (location.href.substr(0, 5) !== 'https') location.href = 'https' + location.h
* @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
* @version 1.4.87
* @version 1.4.88
*
*/
@@ -4092,7 +4092,7 @@ function showAbout() {
imageUrl: image.about,
customClass: { image: 'img-about' },
position: 'center',
title: 'WebRTC SFU v1.4.87',
title: 'WebRTC SFU v1.4.88',
html: `
<br />
<div id="about">

2
public/js/RoomClient.js
عرض الملف

@@ -9,7 +9,7 @@
* @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
* @version 1.4.87
* @version 1.4.88
*
*/

43
public/js/RtmpStreamer.js
عرض الملف

@@ -54,33 +54,6 @@ function showError(message) {
showPopup(message, 'error');
}
function isChromeBased() {
const parser = new UAParser();
const browser = parser.getBrowser();
const browserName = browser.name.toLowerCase();
// List of known Chrome-based browser names
const chromeBasedBrowsers = ['chrome', 'chromium', 'opera', 'edge', 'brave', 'samsung internet'];
return chromeBasedBrowsers.includes(browserName);
}
function checkBrowserSupport() {
const userAgent = navigator.userAgent.toLowerCase();
console.log('UserAgent', userAgent);
if (isChromeBased()) {
console.log('Browser is Chrome-based. Proceed with functionality.');
} else {
toggleButtons(true);
alert(
'This application requires a Chrome-based browser (Chrome, Edge Chromium, etc.). Please switch to a supported browser.',
);
// window.open('about:blank', '_self').close();
}
}
function checkRTMPEnabled() {
axios
.get('/rtmpEnabled')
@@ -97,10 +70,7 @@ function checkRTMPEnabled() {
});
}
window.onload = function () {
checkBrowserSupport();
checkRTMPEnabled();
};
window.onload = checkRTMPEnabled;
async function startCapture(constraints) {
try {
@@ -219,6 +189,13 @@ function stopStreaming() {
stopButton.disabled = true;
}
function getSupportedMimeTypes() {
const possibleTypes = ['video/webm;codecs=vp8,opus', 'video/mp4'];
return possibleTypes.filter((mimeType) => {
return MediaRecorder.isTypeSupported(mimeType);
});
}
async function startStreaming(stream) {
if (!stream) return;
@@ -228,7 +205,9 @@ async function startStreaming(stream) {
return;
}
mediaRecorder = new MediaRecorder(stream, { mimeType: 'video/webm; codecs=vp8,opus' });
const supportedMimeTypes = getSupportedMimeTypes();
console.log('MediaRecorder supported options', supportedMimeTypes);
mediaRecorder = new MediaRecorder(stream, { mimeType: supportedMimeTypes[0] });
mediaRecorder.ondataavailable = async (event) => {
if (event.data.size > 0) {

3
public/views/RtmpStreamer.html
عرض الملف

@@ -49,9 +49,6 @@
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<!-- UAParser -->
<script defer src="https://cdn.jsdelivr.net/npm/ua-parser-js@latest/dist/ua-parser.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/xss/dist/xss.min.js"></script>
<!-- JS scripts -->

41
rtmpServers/demo/client-server-axios/client/client.js
عرض الملف

@@ -45,18 +45,6 @@ function showError(message) {
showPopup(message, 'error');
}
function checkBrowserSupport() {
const userAgent = navigator.userAgent.toLowerCase();
if (userAgent.includes('chrome') && !userAgent.includes('edge') && !userAgent.includes('opr')) {
console.log('Browser is Chrome-based. Proceed with functionality.');
} else {
showError(
'This application requires a Chrome-based browser (Chrome, Edge Chromium, etc.). Please switch to a supported browser.',
);
toggleButtons(true);
}
}
function checkRTMPEnabled() {
axios
.get('/rtmpEnabled')
@@ -73,15 +61,12 @@ function checkRTMPEnabled() {
});
}
window.onload = function () {
checkBrowserSupport();
checkRTMPEnabled();
};
window.onload = checkRTMPEnabled;
async function startCapture(constraints) {
try {
const stream = await navigator.mediaDevices.getUserMedia(constraints);
videoElement.srcObject = stream;
attachMediaStream(stream);
return stream;
} catch (err) {
console.error('Error accessing media devices.', err);
@@ -92,7 +77,7 @@ async function startCapture(constraints) {
async function startScreenCapture(constraints) {
try {
const stream = await navigator.mediaDevices.getDisplayMedia(constraints);
videoElement.srcObject = stream;
attachMediaStream(stream);
return stream;
} catch (err) {
console.error('Error accessing screen media.', err);
@@ -100,6 +85,15 @@ async function startScreenCapture(constraints) {
}
}
function attachMediaStream(stream) {
videoElement.srcObject = stream;
videoElement.playsInline = true;
videoElement.autoplay = true;
videoElement.muted = true;
videoElement.volume = 0;
videoElement.controls = false;
}
async function initRTMP(stream) {
const apiSecret = apiSecretInput.value;
try {
@@ -190,6 +184,13 @@ function stopStreaming() {
stopButton.disabled = true;
}
function getSupportedMimeTypes() {
const possibleTypes = ['video/webm;codecs=vp8,opus', 'video/mp4'];
return possibleTypes.filter((mimeType) => {
return MediaRecorder.isTypeSupported(mimeType);
});
}
async function startStreaming(stream) {
if (!stream) return;
@@ -199,7 +200,9 @@ async function startStreaming(stream) {
return;
}
mediaRecorder = new MediaRecorder(stream, { mimeType: 'video/webm; codecs=vp8,opus' });
const supportedMimeTypes = getSupportedMimeTypes();
console.log('MediaRecorder supported options', supportedMimeTypes);
mediaRecorder = new MediaRecorder(stream, { mimeType: supportedMimeTypes[0] });
mediaRecorder.ondataavailable = async (event) => {
if (event.data.size > 0) {

1
rtmpServers/demo/client-server-axios/server/RtmpStreamer.js
عرض الملف

@@ -19,7 +19,6 @@ class RtmpStreamer {
this.ffmpegStream = ffmpeg()
.input(this.stream)
.inputOptions('-re')
.inputFormat('webm')
.videoCodec('libx264')
.videoBitrate('3000k')
.size('1280x720')

38
rtmpServers/demo/client-server-socket/client/client.js
عرض الملف

@@ -46,24 +46,10 @@ function showError(message) {
showPopup(message, 'error');
}
function checkBrowserSupport() {
const userAgent = navigator.userAgent.toLowerCase();
if (userAgent.includes('chrome') && !userAgent.includes('edge') && !userAgent.includes('opr')) {
console.log('Browser is Chrome-based. Proceed with functionality.');
} else {
showError(
'This application requires a Chrome-based browser (Chrome, Edge Chromium, etc.). Please switch to a supported browser.',
);
toggleButtons(true);
}
}
window.onload = checkBrowserSupport;
async function startCapture(constraints) {
try {
const stream = await navigator.mediaDevices.getUserMedia(constraints);
videoElement.srcObject = stream;
attachMediaStream(stream);
return stream;
} catch (err) {
console.error('Error accessing media devices.', err);
@@ -74,7 +60,7 @@ async function startCapture(constraints) {
async function startScreenCapture(constraints) {
try {
const stream = await navigator.mediaDevices.getDisplayMedia(constraints);
videoElement.srcObject = stream;
attachMediaStream(stream);
return stream;
} catch (err) {
console.error('Error accessing screen media.', err);
@@ -82,6 +68,15 @@ async function startScreenCapture(constraints) {
}
}
function attachMediaStream(stream) {
videoElement.srcObject = stream;
videoElement.playsInline = true;
videoElement.autoplay = true;
videoElement.muted = true;
videoElement.volume = 0;
videoElement.controls = false;
}
async function initRTMP() {
const apiSecret = apiSecretInput.value;
socket.emit('initRTMP', { apiSecret });
@@ -154,10 +149,19 @@ async function startStreaming(stream) {
}
}
function getSupportedMimeTypes() {
const possibleTypes = ['video/webm;codecs=vp8,opus', 'video/mp4'];
return possibleTypes.filter((mimeType) => {
return MediaRecorder.isTypeSupported(mimeType);
});
}
async function startMediaRecorder(stream) {
if (!stream) return;
mediaRecorder = new MediaRecorder(stream, { mimeType: 'video/webm; codecs=vp8,opus' });
const supportedMimeTypes = getSupportedMimeTypes();
console.log('MediaRecorder supported options', supportedMimeTypes);
mediaRecorder = new MediaRecorder(stream, { mimeType: supportedMimeTypes[0] });
mediaRecorder.ondataavailable = async (event) => {
if (event.data.size > 0) {

1
rtmpServers/demo/client-server-socket/server/RtmpStreamer.js
عرض الملف

@@ -19,7 +19,6 @@ class RtmpStreamer {
this.ffmpegStream = ffmpeg()
.input(this.stream)
.inputOptions('-re')
.inputFormat('webm')
.videoCodec('libx264')
.videoBitrate('3000k')
.size('1280x720')