I'm trying to stream a video from a proxy server, both the proxy server and the streaming server are in the same host but the streaming server is not exposed to the public so I have to call it through a proxy, both client and proxy server are running in the same port:
client (port 3000):
<video src="/stream"></video>
proxy server (port 3000):
router.get('/stream', async (req, res) => {
try {
const stream = await axios.get('/getstream', {
responseType: 'stream'
});
res.writeHead(stream.status, stream.headers)
stream.data.pipe(res)
} catch (err) {
...
}
})
streaming server (port 3001, not exposed to the public):
app.get('/getstream', async (req, res) => {
console.log('conection is working!')
try {
const { headers, videoStream } = await streamVideo(req);
res.writeHead(206, headers)
videoStream.pipe(res)
} catch (err) {
...
}
})
The connection between the three is working without errors (I'm seeing 'connection is working!' in the stream server logs) but I'm not getting the video chunk in the client, if I inspect the network tab from the browser I can find the call to the proxy server but the all the tabs (headers, cookies, request, response, timings) are empty.
In development (my local pc) if I call directly the streaming server from the client itself it works just fine and the video is streamed without issues but this will not work in production because as I said the streaming server is not exposed to the public.
Any clues for why I'm not getting video chunks in the client despite the connection with the streaming server (through the proxy) being establish?
I found the issue, the proxy server was not sending the range header to the streaming server. I wasn't aware of that because I wasn't properly handling errors on the streaming server, I even set a specific error for that case but I wasn't doing anything of the correspondent catch block, so the error never found its way to the proxy server.
Now it make sense that I can stream the video just fine I the client calls the streaming server directly, because then the client will sent the range header and the streaming server will act accordingly.
However If the client make first a request to the proxy server then I have to manually send the range header there which I wasn't.
So, using axios it will be: