Merge pull request #155 from Music-Bot-for-Jitsi/dev

Fix connectivity issues, switch from http-bind to websocket

README.md

@@ -61,7 +61,7 @@ At the moment Jimmi only supports simple music playback but he already has an ex
 
 # :rocket: Get started!
 
-Caused by the [Cross-Origin Resource Sharing (CORS)](https://developer.mozilla.org/de/docs/Web/HTTP/CORS) restrictions you need a browser extension to load external YouTube videos into your session and, depending on their configuration, connect to a foreign Jitsi instance.
+Caused by the [Cross-Origin Resource Sharing (CORS)](https://developer.mozilla.org/de/docs/Web/HTTP/CORS) restrictions you need a browser extension to load external YouTube videos into your session.
 
 There have been approaches to circumvent this CORS issues, e.g. the [v2 release of Jimmi](https://github.com/Music-Bot-for-Jitsi/Jimmi/releases/tag/v2.0.0) that you can treet like an April Fool because it was unmaintainable and very resource intensive. For the sake of simplicity and security, it has been decided to deal with the CORS restrictions using the declarativeNetRequest feature of Manifest V3.
 

browser/manifest.json

@@ -1,6 +1,6 @@
 {
     "name": "JIMMI Media",
-    "version": "1.0",
+    "version": "1.1",
     "declarative_net_request": {
         "rule_resources": [
             {
@@ -15,8 +15,7 @@
     ],
     "host_permissions": [
         "https://app.jimmi.party/*",
-        "https://*.googlevideo.com/*",
-        "https://*/http-bind*"
+        "https://*.googlevideo.com/*"
     ],
     "manifest_version": 3
 }

browser/rules.json

@@ -23,32 +23,5 @@
                 "media"
             ]
         }
-    },
-    {
-        "id": 2,
-        "priority": 1,
-        "action": {
-            "type": "modifyHeaders",
-            "responseHeaders": [
-                {
-                    "header": "access-control-allow-origin",
-                    "operation": "set",
-                    "value": "https://app.jimmi.party"
-                },
-                {
-                    "header": "access-control-allow-headers",
-                    "operation": "set",
-                    "value": "*"
-                },
-                {
-                    "header": "access-control-allow-methods",
-                    "operation": "set",
-                    "value": "GET, POST, OPTIONS"
-                }
-            ]
-        },
-        "condition": {
-            "urlFilter": "*http-bind"
-        }
     }
 ]

frontend/package.json

@@ -20,7 +20,7 @@
     "tailwindcss": "^3.3.5",
     "tslib": "^2.6.2",
     "typescript": "^5.2.2",
-    "vite": "^4.5.0"
+    "vite": "^4.5.2"
   },
   "dependencies": {
     "qs": "^6.11.2",

frontend/src/components/Jitsi.svelte

@@ -156,9 +156,9 @@
   /**
    * Called when connection fails
    */
-  function onConnectionFailed() {
-    alert("Connection failed! Please report this issue");
-    console.error("Connection Failed!");
+  function onConnectionFailed(err) {
+    alert(`Connection failed (${err})! Please report this issue`);
+    console.error("Connection failed!", err);
   }
 
   /**

frontend/src/routes/Bot.svelte

@@ -50,10 +50,11 @@
   onMount(async () => {
     const options = {
       hosts: {
+        anonymousdomain: `guest.${params.instance}`,
         domain: params.instance,
         muc: `conference.${params.instance}`, // FIXME: use XEP-0030
       },
-      bosh: `https://${params.instance}/http-bind?room=${params.room}`,
+      serviceUrl: `wss://${params.instance}/xmpp-websocket?room=${params.room}`,
     };
     await jitsi.joinConference(options); // jimmiApi is initialized during function call