mirror of
https://github.com/MercuryWorkshop/adrift.git
synced 2025-05-12 13:50:01 -04:00
POC for firebase peer discovery
This commit is contained in:
parent
68d5601c3c
commit
091339a8a0
9 changed files with 6839 additions and 183 deletions
1
.gitignore
vendored
1
.gitignore
vendored
|
@ -1,3 +1,4 @@
|
||||||
node_modules
|
node_modules
|
||||||
dist.js
|
dist.js
|
||||||
dist.js.map
|
dist.js.map
|
||||||
|
dist.html
|
||||||
|
|
|
@ -2,6 +2,10 @@ import { openWindow, deleteWindow } from "corium";
|
||||||
import { h, render, Component, Fragment } from 'preact';
|
import { h, render, Component, Fragment } from 'preact';
|
||||||
import { RTCConnection } from "./rtc";
|
import { RTCConnection } from "./rtc";
|
||||||
|
|
||||||
|
|
||||||
|
import { setOffer, setCallback } from "./firebase";
|
||||||
|
|
||||||
|
|
||||||
export default class App extends Component {
|
export default class App extends Component {
|
||||||
rtc = new RTCConnection({
|
rtc = new RTCConnection({
|
||||||
onmessage: console.log,
|
onmessage: console.log,
|
||||||
|
@ -21,17 +25,19 @@ export default class App extends Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
render(props, state) {
|
render(props, state) {
|
||||||
|
setCallback(this.rtc.answer.bind(this.rtc));
|
||||||
return <>
|
return <>
|
||||||
<div>
|
<div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button onClick={async () => {
|
<button onClick={async () => {
|
||||||
console.log("whra");
|
|
||||||
let offer = await this.rtc.createOffer();
|
let offer = await this.rtc.createOffer();
|
||||||
|
console.log("offer created", offer);
|
||||||
|
|
||||||
console.log("hra");
|
setOffer(JSON.stringify(offer));
|
||||||
this.setState(prev => ({ ...prev, offer: JSON.stringify(offer) }));
|
|
||||||
|
// this.setState(prev => ({ ...prev, offer: JSON.stringify(offer) }));
|
||||||
|
|
||||||
|
|
||||||
}}>create offer</button>
|
}}>create offer</button>
|
||||||
|
|
33
client/firebase.ts
Normal file
33
client/firebase.ts
Normal 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);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<link rel="icon" href="/icon.png">
|
<link rel="icon" href="/icon.png">
|
||||||
<link href="style.css" rel="stylesheet">
|
<link href="style.css" rel="stylesheet">
|
||||||
<script defer src="dist.js"></script>
|
<script src="dist.js"></script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
|
@ -3,8 +3,9 @@ import { h, render } from 'preact'
|
||||||
import 'preact/devtools';
|
import 'preact/devtools';
|
||||||
import App from "./App";
|
import App from "./App";
|
||||||
|
|
||||||
|
window.addEventListener("load", () => {
|
||||||
const container = document.getElementById("app") as HTMLElement;
|
const container = document.getElementById("app") as HTMLElement;
|
||||||
let app = <App />;
|
let app = <App />;
|
||||||
console.log(app);
|
console.log(app);
|
||||||
render(<App />, container);
|
render(<App />, container);
|
||||||
|
});
|
||||||
|
|
20
firebase-config.ts
Normal file
20
firebase-config.ts
Normal 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
6914
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
@ -14,6 +14,7 @@
|
||||||
"corium": "file:corium",
|
"corium": "file:corium",
|
||||||
"dotenv": "^16.3.1",
|
"dotenv": "^16.3.1",
|
||||||
"esbuild": "0.19.0",
|
"esbuild": "0.19.0",
|
||||||
|
"firebase": "^10.1.0",
|
||||||
"preact": "^10.16.0",
|
"preact": "^10.16.0",
|
||||||
"wrtc": "^0.4.7"
|
"wrtc": "^0.4.7"
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,16 @@
|
||||||
import dotenv from "dotenv";
|
import dotenv from "dotenv";
|
||||||
import * as wrtc from "wrtc";
|
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 = {
|
const configuration = {
|
||||||
iceServers: [
|
iceServers: [
|
||||||
{
|
{
|
||||||
|
@ -48,7 +58,9 @@ async function connect(offer, candidates) {
|
||||||
answer: peer.localDescription,
|
answer: peer.localDescription,
|
||||||
candidates: localCandidates,
|
candidates: localCandidates,
|
||||||
};
|
};
|
||||||
console.log(JSON.stringify(payload));
|
let string = JSON.stringify(payload)
|
||||||
|
|
||||||
|
set(reff, string);
|
||||||
};
|
};
|
||||||
await peer.setRemoteDescription(offer);
|
await peer.setRemoteDescription(offer);
|
||||||
let answer = await peer.createAnswer();
|
let answer = await peer.createAnswer();
|
||||||
|
@ -57,7 +69,15 @@ async function connect(offer, candidates) {
|
||||||
await peer.addIceCandidate(candidate);
|
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);
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue