chrisryn/camera-viewer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add go2rtc proxy to fix CORS-blocked WebRTC/MSE streams

Browse Source
This commit is contained in:
root
2026-02-25 22:11:56 -06:00
parent da5637fbdb
commit ba2824ec56
4 changed files with 78 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
frontend/src/services/go2rtc.ts
View File

@@ -1,13 +1,13 @@
// All requests go through backend proxy to avoid CORS issues
export class Go2RTCWebRTC {
private pc: RTCPeerConnection | null = null;
private mediaStream: MediaStream | null = null;
private streamName: string;
private go2rtcUrl: string;
private onTrackCb: ((stream: MediaStream) => void) | null = null;
constructor(streamName: string, go2rtcUrl: string) {
constructor(streamName: string, _go2rtcUrl?: string) {
this.streamName = streamName;
this.go2rtcUrl = go2rtcUrl;
}
async connect(onTrack: (stream: MediaStream) => void): Promise<void> {
@@ -24,9 +24,7 @@ export class Go2RTCWebRTC {
}
};
this.pc.onicecandidate = () => {
// go2rtc handles ICE internally via the initial SDP exchange
};
this.pc.onicecandidate = () => {};
this.pc.addTransceiver('video', { direction: 'recvonly' });
this.pc.addTransceiver('audio', { direction: 'recvonly' });
@@ -34,7 +32,8 @@ export class Go2RTCWebRTC {
const offer = await this.pc.createOffer();
await this.pc.setLocalDescription(offer);
const url = `${this.go2rtcUrl}/api/webrtc?src=${encodeURIComponent(this.streamName)}`;
// Use backend proxy instead of direct go2rtc
const url = `/api/go2rtc/webrtc?src=${encodeURIComponent(this.streamName)}`;
const res = await fetch(url, {
method: 'POST',
headers: { 'Content-Type': 'application/sdp' },
@@ -67,13 +66,11 @@ export class Go2RTCMSE {
private sourceBuffer: SourceBuffer | null = null;
private ws: WebSocket | null = null;
private streamName: string;
private go2rtcUrl: string;
private videoElement: HTMLVideoElement | null = null;
private queue: ArrayBuffer[] = [];
constructor(streamName: string, go2rtcUrl: string) {
constructor(streamName: string, _go2rtcUrl?: string) {
this.streamName = streamName;
this.go2rtcUrl = go2rtcUrl;
}
async connect(videoElement: HTMLVideoElement): Promise<void> {
@@ -85,7 +82,9 @@ export class Go2RTCMSE {
this.mediaSource!.addEventListener('sourceopen', () => resolve(), { once: true });
});
const wsUrl = `${this.go2rtcUrl.replace('http', 'ws')}/api/ws?src=${encodeURIComponent(this.streamName)}`;
// Use backend proxy WebSocket
const proto = location.protocol === 'https:' ? 'wss:' : 'ws:';
const wsUrl = `${proto}//${location.host}/api/go2rtc/ws?src=${encodeURIComponent(this.streamName)}`;
this.ws = new WebSocket(wsUrl);
this.ws.binaryType = 'arraybuffer';