trying to fix turn server for firefox

This commit is contained in:
Klemek
2025-03-18 18:00:22 +01:00
parent fa4e6391e3
commit 7de550b63b
+86 -47
View File
@@ -12,15 +12,24 @@ const utils = {
},
userAgent(raw) {
// https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/Browser_detection_using_the_user_agent#which_part_of_the_user_agent_contains_the_information_you_are_looking_for
const userAgents = ['Seamonkey','Firefox','Chromium','Edg.*', 'Chrome', 'Safari', 'OPR', 'Opera'];
for (let index = 0; index < userAgents.length; index+=1) {
const userAgents = [
"Seamonkey",
"Firefox",
"Chromium",
"Edg.*",
"Chrome",
"Safari",
"OPR",
"Opera",
];
for (let index = 0; index < userAgents.length; index += 1) {
const userAgent = userAgents[index];
const result = new RegExp(`(${userAgent}\\/\\d+\\.\\d+)`, 'iu').exec(raw);
const result = new RegExp(`(${userAgent}\\/\\d+\\.\\d+)`, "iu").exec(raw);
if (result) {
return result[0];
}
}
return 'Unknown'
return "Unknown";
},
prettyBytes(byteCount) {
let size = byteCount / 1000;
@@ -41,14 +50,21 @@ const utils = {
return `<1s`;
}
if (time < 60) {
return `${Math.floor(time).toFixed(0).padStart(2, '0')}s`;
return `${Math.floor(time).toFixed(0).padStart(2, "0")}s`;
}
time /= 60;
if (time < 60) {
return `${Math.floor(time).toFixed(0).padStart(2, '0')}m${((time * 60) % 60).toFixed(0).padStart(2, '0')}s`;
return `${Math.floor(time).toFixed(0).padStart(2, "0")}m${(
(time * 60) %
60
)
.toFixed(0)
.padStart(2, "0")}s`;
}
time /= 60;
return `${Math.floor(time).toFixed(0).padStart(2, '0')}h${((time * 60) % 60).toFixed(0).padStart(2, '0')}m`;
return `${Math.floor(time).toFixed(0).padStart(2, "0")}h${((time * 60) % 60)
.toFixed(0)
.padStart(2, "0")}m`;
},
};
@@ -123,44 +139,46 @@ const app = createApp({
return this.error;
}
if (!this.canConnect) {
return 'Acquiring ID...';
return "Acquiring ID...";
}
if (this.isServer) {
if (! this.server.data) {
return 'Waiting for file upload';
if (!this.server.data) {
return "Waiting for file upload";
}
return 'Ready to send file';
return "Ready to send file";
}
if (! this.client.connected) {
return 'Connecting to peer...';
if (!this.client.connected) {
return "Connecting to peer...";
}
if (this.readyToDownload) {
return 'Ready to download';
return "Ready to download";
}
if (! this.downloading) {
return 'Waiting for file info...';
if (!this.downloading) {
return "Waiting for file info...";
}
if (this.client.downloadEnd) {
return 'File downloaded';
return "File downloaded";
}
return 'Downloading...';
return "Downloading...";
},
prettyFileSize() {
return utils.prettyBytes(this.fileSize);
},
prettyDownloadSpeed() {
if (! this.client.downloadStart) {
return '';
if (!this.client.downloadStart) {
return "";
}
const time = (this.client.downloadEnd ?? (new Date())) - this.client.downloadStart;
const speed = 1000 * this.downloadProgress / time;
const time =
(this.client.downloadEnd ?? new Date()) - this.client.downloadStart;
const speed = (1000 * this.downloadProgress) / time;
return `${utils.prettyBytes(speed)}/s`;
},
prettyRemainingTime() {
if (! this.client.downloadStart || this.client.downloadEnd) {
return '';
if (!this.client.downloadStart || this.client.downloadEnd) {
return "";
}
const time = (this.client.downloadEnd ?? (new Date())) - this.client.downloadStart;
const time =
(this.client.downloadEnd ?? new Date()) - this.client.downloadStart;
const speed = this.downloadProgress / time;
const remainingBytes = this.downloadTotal - this.downloadProgress;
const remainingTime = remainingBytes / speed;
@@ -188,8 +206,9 @@ const app = createApp({
},
initClient() {
const url = new URL(window.location);
const remoteId = url.searchParams.get("s") ?? '';
const uuidRegex = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-5][0-9a-f]{3}-[089ab][0-9a-f]{3}-[0-9a-f]{12}$/iu;
const remoteId = url.searchParams.get("s") ?? "";
const uuidRegex =
/^[0-9a-f]{8}-[0-9a-f]{4}-[0-5][0-9a-f]{3}-[089ab][0-9a-f]{3}-[0-9a-f]{12}$/iu;
if (uuidRegex.test(remoteId)) {
this.isServer = false;
this.client.remoteId = remoteId;
@@ -203,11 +222,18 @@ const app = createApp({
secure: true,
config: {
iceServers: [
{ url: 'stun:stun.l.google.com:19302' },
{
urls: [`turn:klemek.fr:3478`, `turns:klemek.fr:5349`],
username: "username",
credential: "credential",
urls: ["stun:klemek.fr:3478"],
},
{
urls: ["turns:klemek.fr:5349"],
username: "anonymous",
credential: "anonymous",
},
{
urls: ["turn:klemek.fr:3478"],
username: "anonymous",
credential: "anonymous",
},
],
},
@@ -219,16 +245,24 @@ const app = createApp({
this.peer.on("error", this.onPeerError);
},
initServerConnection(conn) {
const index = this.server.clients.length;
this.server.clients.push({
let index = this.server.clients.findIndex(
(client) => client.id === conn.peer
);
const clientData = {
connection: conn,
id: conn.peer,
done: false,
sent: 0,
connected: false,
status: 'Connecting...',
status: "Connecting...",
userAgent: null,
});
};
if (index === -1) {
index = this.server.clients.length;
this.server.clients.push(clientData);
} else {
this.server.clients[index] = clientData;
}
conn.on("open", () => this.onServerConnectionOpen(index));
conn.on("close", () => this.onServerConnectionClose(index));
conn.on("data", (data) => this.onServerConnectionData(index, data));
@@ -259,7 +293,7 @@ const app = createApp({
},
clientOpenConnection() {
this.initClientConnection(
this.peer.connect(this.client.remoteId, { reliable: false }),
this.peer.connect(this.client.remoteId, { reliable: false })
);
},
// PEER EVENTS
@@ -297,7 +331,7 @@ const app = createApp({
onServerConnectionOpen(index) {
console.log("onServerConnectionOpen", index);
this.server.clients[index].connected = true;
this.server.clients[index].status = 'Connected';
this.server.clients[index].status = "Connected";
this.sendServerInfo(index);
},
onServerConnectionData(index, data) {
@@ -319,11 +353,11 @@ const app = createApp({
},
onServerConnectionClose(index) {
console.log("onServerConnectionClose", index);
this.server.clients[index].status = 'Disconnected';
this.server.clients[index].status = "Disconnected";
},
onServerConnectionError(index, err) {
console.log("onServerConnectionError", index, err);
this.server.clients[index].status = 'Error';
this.server.clients[index].status = "Error";
},
// CLIENT CONNECTION EVENTS
onClientConnectionOpen() {
@@ -354,7 +388,7 @@ const app = createApp({
},
onClientConnectionError(err) {
console.log("onClientConnectionError", err);
this.error = `Connection failed: ${err.type}. Reconnecting...`
this.error = `Connection failed: ${err.type}. Reconnecting...`;
setTimeout(this.clientOpenConnection, 1000);
},
// EXCHANGES
@@ -381,7 +415,7 @@ const app = createApp({
handleServerChunk(data) {
new Uint8Array(this.client.buffer).set(
new Uint8Array(data.bytes),
data.index,
data.index
);
this.client.received.push(data.index);
},
@@ -389,7 +423,6 @@ const app = createApp({
this.server.clients[index].connection.send({
type: MESSAGE_TYPE.ServerDone,
});
},
handleServerDone() {
const indexes = [];
@@ -427,7 +460,11 @@ const app = createApp({
setTimeout(() => this.sendServerChunk(index, chunkIndex));
});
} else {
for (let chunkIndex = 0; chunkIndex < this.fileSize; chunkIndex += MAX_CHUNK_SIZE) {
for (
let chunkIndex = 0;
chunkIndex < this.fileSize;
chunkIndex += MAX_CHUNK_SIZE
) {
setTimeout(() => this.sendServerChunk(index, chunkIndex));
}
}
@@ -441,7 +478,7 @@ const app = createApp({
handleClientDone(index) {
this.server.clients[index].connection.close();
this.server.clients[index].done = true;
this.server.clients[index].status = 'Done';
this.server.clients[index].status = "Done";
},
// UI EVENTS
onFileChange(event) {
@@ -470,13 +507,15 @@ const app = createApp({
navigator.share({
url: this.server.url,
title: window.title,
})
});
} else {
navigator.clipboard.writeText(this.server.url);
this.server.copied = true;
setTimeout(() => {this.server.copied = false;}, 5000);
setTimeout(() => {
this.server.copied = false;
}, 5000);
}
}
},
},
});