[mirotalksfu] - add roomsAllowed, fix, update dep

miroslavpejic85 · Oct 18, 2024 · c29e777 · c29e777
1 parent d177bbb
commit c29e777
Show file tree

Hide file tree

Showing 8 changed files with 133 additions and 35 deletions.
diff --git a/app/src/Server.js b/app/src/Server.js
@@ -55,7 +55,7 @@ dev 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.5.88
+ * @version 1.5.89
  *
  */
 
@@ -141,6 +141,7 @@ const hostCfg = {
     user_auth: config.host.user_auth,
     users_from_db: config.host.users_from_db,
     users_api_room_allowed: config.host.users_api_room_allowed,
+    users_api_rooms_allowed: config.host.users_api_rooms_allowed,
     users_api_endpoint: config.host.users_api_endpoint,
     users_api_secret_key: config.host.users_api_secret_key,
     users: config.host.users,
@@ -647,15 +648,18 @@ function startServer() {
                       config.presenters.list.includes(username).toString();
 
             const token = encodeToken({ username: username, password: password, presenter: isPresenter });
-            return res.status(200).json({ message: token });
+            const allowedRooms = await getUserAllowedRooms(username, password);
+
+            return res.status(200).json({ message: token, allowedRooms: allowedRooms });
         }
 
         if (isPeerValid) {
             log.debug('PEER LOGIN OK', { ip: ip, authorized: true });
             const isPresenter =
                 config.presenters && config.presenters.list && config.presenters.list.includes(username).toString();
             const token = encodeToken({ username: username, password: password, presenter: isPresenter });
-            return res.status(200).json({ message: token });
+            const allowedRooms = await getUserAllowedRooms(username, password);
+            return res.status(200).json({ message: token, allowedRooms: allowedRooms });
         } else {
             return res.status(401).json({ message: 'unauthorized' });
         }
@@ -1254,10 +1258,9 @@ function startServer() {
                         });
                         return cb('unauthorized');
                     }
+                } else {
+                    if (!hostCfg.users_from_db) return cb('unauthorized');
                 }
-                // else {
-                //     return cb('unauthorized');
-                // }
 
                 if (!hostCfg.users_from_db) {
                     const roomAllowedForUser = isRoomAllowedForUser('[Join]', peer_name, room.id);
@@ -2949,6 +2952,48 @@ function startServer() {
         return allowRoomAccess;
     }
 
+    async function getUserAllowedRooms(username, password) {
+        // Gel user allowed rooms from db...
+        if (hostCfg.protected && hostCfg.users_from_db && hostCfg.users_api_rooms_allowed) {
+            try {
+                // Using either email or username, as the username can also be an email here.
+                const response = await axios.post(
+                    hostCfg.users_api_rooms_allowed,
+                    {
+                        email: username,
+                        username: username,
+                        password: password,
+                        api_secret_key: hostCfg.users_api_secret_key,
+                    },
+                    {
+                        timeout: 5000, // Timeout set to 5 seconds (5000 milliseconds)
+                    },
+                );
+                const allowedRooms = response.data ? response.data.message : {};
+                log.debug('AXIOS getUserAllowedRooms', allowedRooms);
+                return allowedRooms;
+            } catch (error) {
+                log.error('AXIOS getUserAllowedRooms error', error.message);
+                return {};
+            }
+        }
+
+        // Get allowed rooms for user from config.js file
+        if (hostCfg.protected && !hostCfg.users_from_db) {
+            const isOIDCEnabled = config.oidc && config.oidc.enabled;
+
+            const user = hostCfg.users.find((user) => user.displayname === username || user.username === username);
+
+            if (!isOIDCEnabled && !user) {
+                log.debug('getUserAllowedRooms - user not found', username);
+                return false;
+            }
+            return user.allowed_rooms;
+        }
+
+        return ['*'];
+    }
+
     async function isRoomAllowedForUser(message, username, room) {
         const logData = { message, username, room };
 

diff --git a/app/src/config.template.js b/app/src/config.template.js
@@ -174,8 +174,10 @@ module.exports = {
         users_from_db: false, // if true ensure that api.token is also set to true.
         users_api_endpoint: 'http://localhost:9000/api/v1/user/isAuth',
         users_api_room_allowed: 'http://localhost:9000/api/v1/user/isRoomAllowed',
+        users_api_rooms_allowed: 'http://localhost:9000/api/v1/user/roomsAllowed',
         //users_api_endpoint: 'https://webrtc.mirotalk.com/api/v1/user/isAuth',
         //users_api_room_allowed: 'https://webrtc.mirotalk.com/api/v1/user/isRoomAllowed',
+        //users_api_rooms_allowed: 'https://webrtc.mirotalk.com/api/v1/user/roomsAllowed',
         users_api_secret_key: 'mirotalkweb_default_secret',
         users: [
             {

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "mirotalksfu",
-    "version": "1.5.88",
+    "version": "1.5.89",
     "description": "WebRTC SFU browser-based video calls",
     "main": "Server.js",
     "scripts": {
@@ -73,11 +73,11 @@
         "js-yaml": "^4.1.0",
         "jsdom": "^25.0.1",
         "jsonwebtoken": "^9.0.2",
-        "mediasoup": "3.14.15",
+        "mediasoup": "3.14.16",
         "mediasoup-client": "3.7.17",
         "ngrok": "^5.0.0-beta.2",
         "nodemailer": "^6.9.15",
-        "openai": "^4.67.3",
+        "openai": "^4.68.1",
         "qs": "6.13.0",
         "socket.io": "4.8.0",
         "swagger-ui-express": "5.0.1",

diff --git a/public/css/landing.css b/public/css/landing.css
@@ -2106,3 +2106,11 @@ main {
 /* #roomName {
     text-align: left;
 } */
+
+/*--------------------------------------------------------------
+# Login and Join ROOM
+--------------------------------------------------------------*/
+
+#joinRoomForm {
+    display: none;
+}
diff --git a/public/js/Login.js b/public/js/Login.js
@@ -4,8 +4,13 @@ console.log(window.location);
 
 const usernameInput = document.getElementById('username');
 const passwordInput = document.getElementById('password');
+const loginForm = document.getElementById('loginForm');
 const loginBtn = document.getElementById('loginButton');
 
+const joinRoomForm = document.getElementById('joinRoomForm');
+const selectRoom = document.getElementById('selectRoom');
+const joinSelectRoomBtn = document.getElementById('joinSelectRoomButton');
+
 usernameInput.onkeyup = (e) => {
     if (e.keyCode === 13) {
         e.preventDefault();
@@ -23,6 +28,10 @@ loginBtn.onclick = (e) => {
     login();
 };
 
+joinSelectRoomBtn.onclick = (e) => {
+    join();
+};
+
 function login() {
     const username = filterXSS(document.getElementById('username').value);
     const password = filterXSS(document.getElementById('password').value);
@@ -50,6 +59,21 @@ function login() {
                 const token = response.data.message;
                 window.sessionStorage.peer_token = token;
 
+                // Allowed rooms
+                const allowedRooms = response.data.allowedRooms;
+                if (allowedRooms && !allowedRooms.includes('*')) {
+                    console.log('User detected with limited join room access!', allowedRooms);
+                    loginForm.style.display = 'none';
+                    joinRoomForm.style.display = 'block';
+                    allowedRooms.forEach((room) => {
+                        const option = document.createElement('option');
+                        option.value = room;
+                        option.text = room;
+                        selectRoom.appendChild(option);
+                    });
+                    return;
+                }
+
                 if (room) {
                     return (window.location.href = '/join/' + window.location.search);
                     // return (window.location.href = '/join/?room=' + room + '&token=' + token);
@@ -80,3 +104,10 @@ function login() {
         return;
     }
 }
+
+function join() {
+    //window.location.href = '/join/' + selectRoom.value;
+    const username = filterXSS(document.getElementById('username').value);
+    const roomId = filterXSS(document.getElementById('selectRoom').value);
+    window.location.href = '/join/?room=' + roomId + '&name=' + username + '&token=' + window.sessionStorage.peer_token;
+}
diff --git a/public/js/Room.js b/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.5.88
+ * @version 1.5.89
  *
  */
 
@@ -4500,7 +4500,7 @@ function showAbout() {
         imageUrl: image.about,
         customClass: { image: 'img-about' },
         position: 'center',
-        title: 'WebRTC SFU v1.5.88',
+        title: 'WebRTC SFU v1.5.89',
         html: `
         <br />
         <div id="about">

diff --git a/public/js/RoomClient.js b/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.5.88
+ * @version 1.5.89
  *
  */
 

diff --git a/public/views/login.html b/public/views/login.html
@@ -42,6 +42,20 @@
         <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans:400,600" />
         <link rel="stylesheet" type="text/css" href="../css/landing.css" />
 
+        <!-- Bootstrap 5 -->
+
+        <link
+            href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
+            rel="stylesheet"
+            integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
+            crossorigin="anonymous"
+        />
+        <script
+            src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
+            integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
+            crossorigin="anonymous"
+        ></script>
+
         <!-- Js scripts -->
 
         <script defer src="../js/Brand.js"></script>
@@ -63,24 +77,7 @@
             <header class="site-header">
                 <div class="container">
                     <div class="site-header-inner">
-                        <div class="brand header-brand">
-                            <h1 class="m-0">
-                                <a href="/">
-                                    <img
-                                        class="header-logo-image"
-                                        src="../images/logo.svg"
-                                        alt="mirotalksfu-webrtc-logo"
-                                    />
-                                    <!-- <img
-                                        class="header-logo-image reveal-from-left"
-                                        src="../images/mirotalk-mc.png"
-                                        alt="mirotalksfu-webrtc-logo"
-                                        width="96"
-                                        height="auto"
-                                    /> -->
-                                </a>
-                            </h1>
-                        </div>
+                        <div class="brand header-brand"></div>
                     </div>
                 </div>
             </header>
@@ -119,6 +116,25 @@ <h1 class="m-0">
                                         </button>
                                     </div>
                                 </div>
+                                <!-- Join Room Section hidden -->
+                                <div id="joinRoomForm" class="mb-12">
+                                    <div class="hero-copy reveal-from-bottom">
+                                        <h1 class="hero-title mt-0">
+                                            Pick name. <br />
+                                            Share URL. <br />
+                                            Start conference.
+                                        </h1>
+                                    </div>
+                                    <br />
+                                    <div class="mb-12">
+                                        <select id="selectRoom" class="form-select text-light bg-dark"></select>
+                                    </div>
+                                    <div class="mt-24 mb-32">
+                                        <button id="joinSelectRoomButton" class="button button-primary button-block">
+                                            JOIN ROOM
+                                        </button>
+                                    </div>
+                                </div>
                             </div>
                             <div class="hero-figure anime-element">
                                 <svg class="placeholder" width="528" height="396" viewBox="0 0 528 396">
@@ -143,11 +159,7 @@ <h1 class="m-0">
             <footer id="footer" class="site-footer">
                 <div class="container">
                     <div class="site-footer-inner">
-                        <div class="brand footer-brand">
-                            <a href="/">
-                                <img class="header-logo-image" src="../images/logo.svg" alt="Logo" />
-                            </a>
-                        </div>
+                        <div class="brand footer-brand"></div>
                         <ul class="footer-links list-reset">
                             <li>
                                 <a href="/about">About</a>