POC for firebase peer discovery

This commit is contained in:
CoolElectronics 2023-08-10 21:28:15 -04:00
parent 68d5601c3c
commit 091339a8a0
No known key found for this signature in database
GPG key ID: F63593D168636C50
9 changed files with 6839 additions and 183 deletions

1
.gitignore vendored
View file

@ -1,3 +1,4 @@
node_modules
dist.js
dist.js.map
dist.html

View file

@ -2,6 +2,10 @@ import { openWindow, deleteWindow } from "corium";
import { h, render, Component, Fragment } from 'preact';
import { RTCConnection } from "./rtc";
import { setOffer, setCallback } from "./firebase";
export default class App extends Component {
rtc = new RTCConnection({
onmessage: console.log,
@ -21,17 +25,19 @@ export default class App extends Component {
}
render(props, state) {
setCallback(this.rtc.answer.bind(this.rtc));
return <>
<div>
</div>
<button onClick={async () => {
console.log("whra");
let offer = await this.rtc.createOffer();
console.log("offer created", offer);
console.log("hra");
this.setState(prev => ({ ...prev, offer: JSON.stringify(offer) }));
setOffer(JSON.stringify(offer));
// this.setState(prev => ({ ...prev, offer: JSON.stringify(offer) }));
}}>create offer</button>

33
client/firebase.ts Normal file
View file

@ -0,0 +1,33 @@
import "../firebase-config";
import { getDatabase, ref, onValue, set } from "firebase/database";
const db = getDatabase();
console.log(db);
let reff = ref(db, "/peers/demo");
// onValue(reff, (snapshot) => {
// const data = snapshot.val();
// console.log(data);
// });
var callback;
export function setCallback(call) {
callback = call;
}
export function setOffer(offer: string) {
set(reff, offer);
}
onValue(reff, (snapshot) => {
const data = snapshot.val();
console.log(data);
if (data && data.answer && data.candidates) {
set(reff, null);
const { answer, candidates } = JSON.parse(data);
callback(answer, candidates);
}
});

View file

@ -8,7 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="/icon.png">
<link href="style.css" rel="stylesheet">
<script defer src="dist.js"></script>
<script src="dist.js"></script>
</head>
<body>

View file

@ -3,8 +3,9 @@ import { h, render } from 'preact'
import 'preact/devtools';
import App from "./App";
const container = document.getElementById("app") as HTMLElement;
let app = <App />;
console.log(app);
render(<App />, container);
window.addEventListener("load", () => {
const container = document.getElementById("app") as HTMLElement;
let app = <App />;
console.log(app);
render(<App />, container);
});

20
firebase-config.ts Normal file
View file

@ -0,0 +1,20 @@
// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "AIzaSyCs1LOqsbrAjymIcjvbKxPhFQWXlSPiLTs",
authDomain: "adrift-6c1f6.firebaseapp.com",
projectId: "adrift-6c1f6",
storageBucket: "adrift-6c1f6.appspot.com",
messagingSenderId: "175846512414",
appId: "1:175846512414:web:5c6e06d231ab58e9029b0f",
measurementId: "G-L0P2EF6Q72"
};
// Initialize Firebase
export const app = initializeApp(firebaseConfig);
// export const analytics = getAnalytics(app);

6914
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -14,6 +14,7 @@
"corium": "file:corium",
"dotenv": "^16.3.1",
"esbuild": "0.19.0",
"firebase": "^10.1.0",
"preact": "^10.16.0",
"wrtc": "^0.4.7"
}

View file

@ -1,6 +1,16 @@
import dotenv from "dotenv";
import * as wrtc from "wrtc";
import { app } from "../firebase-config";
console.log(app);
import { getDatabase, ref, onValue, set } from "firebase/database";
const db = getDatabase();
let reff = ref(db, "/peers/demo");
const configuration = {
iceServers: [
{
@ -48,7 +58,9 @@ async function connect(offer, candidates) {
answer: peer.localDescription,
candidates: localCandidates,
};
console.log(JSON.stringify(payload));
let string = JSON.stringify(payload)
set(reff, string);
};
await peer.setRemoteDescription(offer);
let answer = await peer.createAnswer();
@ -57,7 +69,15 @@ async function connect(offer, candidates) {
await peer.addIceCandidate(candidate);
}
}
onValue(reff, (snapshot) => {
const rawdata = snapshot.val();
let data = JSON.parse(rawdata);
console.log(data);
if (data && data.offer && data.localCandidates) {
const { offer, localCandidates } = data;
connect(offer, localCandidates);
}
});
const { offer, localCandidates } =
{ "offer": { "type": "offer", "sdp": "v=0\r\no=- 4586812759771523024 2 IN IP4 127.0.0.1\r\ns=-\r\nt=0 0\r\na=group:BUNDLE 0\r\na=extmap-allow-mixed\r\na=msid-semantic: WMS\r\nm=application 9 UDP/DTLS/SCTP webrtc-datachannel\r\nc=IN IP4 0.0.0.0\r\na=ice-ufrag:c7ST\r\na=ice-pwd:gYK+MUVTy//4PeDk5hF7MPvG\r\na=ice-options:trickle\r\na=fingerprint:sha-256 74:57:8A:5F:E1:83:09:7F:56:5E:99:03:A7:2A:5D:0C:42:AC:8D:EB:00:33:43:E7:2B:3C:60:64:CD:B1:65:01\r\na=setup:actpass\r\na=mid:0\r\na=sctp-port:5000\r\na=max-message-size:262144\r\n" }, "localCandidates": [{ "candidate": "candidate:3436378122 1 udp 2113937151 152aa36b-1063-48ea-9d3d-0785d6d70eca.local 45909 typ host generation 0 ufrag c7ST network-cost 999", "sdpMid": "0", "sdpMLineIndex": 0, "usernameFragment": "c7ST" }, { "candidate": "candidate:3063087197 1 udp 1677729535 172.100.111.196 44745 typ srflx raddr 0.0.0.0 rport 0 generation 0 ufrag c7ST network-cost 999", "sdpMid": "0", "sdpMLineIndex": 0, "usernameFragment": "c7ST" }] }
connect(offer, localCandidates);