Can I stream a static image feed into a video with Node.js? - node.js

I want to create a small PoC where I can stream a static image source into a video. The idea behind that is that I have an (old) IP camera that only serves snapshots on an HTTP endpoint. When calling that endpoint, you get a static JPEG picture. Let's say, the URL I want to "convert" is: http://mycamera.local/live.jpg
Now, I want to create a script using Node.js to quickly call that URL over and over in order to form some sort of video stream. I'm not an expert into media encoding and stuff, but I guess that the variable refresh rate induced by HTTP latency, the camera's FPS... would make it a bit trickier to pipe images into a video response?
I thought I'd go with Express and Axios to serve and query HTTP content. I've also read that FFmpeg could play a role in there. But, I am open to any suggestion. I could even switch languages if that's required. This question is so specific I think, that any response would do.
A couple of requirements I cannot change:
The camera can only serve static pictures on a single endpoint.
I have no other protocol than HTTP on the camera.
I am not buying or modifying the existing hardware, even though I know there are very cheap units out there.
My server must serve a live video that could be streamed by VLC for instance.

Related

How can I Record video from webcam on client with lossless frame pixels through browser?

I need to build a website which recording the person from the camera (he must allow the camera first), but I need the record frame by frame with lossless pixels.
I tried to figure this out with some options:
opencv.js - didn't figure it, it is using the browser video element, this is changing the pixels by compressions right?
ngx-webcame - I read it using capturing lossless images but not video
Now the other issue that I need to send the frames to the server?
should I save the frames on client process it on client computer and then send the result to the server?
Is there an option to send the video data frame to the server for future use?
Someone told me to build an agent that will do this actions and send the data on chunks but in that case I don't know really how to do it and I need clarification on that and some instruction on how to start build something like that.
If anyone have an example codes or anything that can direct me to the solution it will be very helpful.
I've created something similar befor using RecordRTC.
It takes advantageg of WebRTC. It works pretty straitforward. Record the video localy and upload it as a file.
https://github.com/muaz-khan/RecordRTC

Use Google Cloud Storage to Host Audio Files for Streaming but not Downloading

I have a bunch of audio files that I want people to be able to listen to. My website has an audio player so that people can listen to them. My audio player looks something like this (though this is simplified):
<audio>
<source src="https://storage.googleapis.com/my-bucket/my-file.mp3">
</audio>
The problem is that it would take almost no work for someone to just grab all of those MP3 urls and download the files.
Is there a way that I can make it so that it's only accessible for streaming, but not for downloading?
How do sites like SoundCloud handle this problem?
For example, SoundCloud lets you play people's songs. However, when I look in Firefox's Network tab I see that when playing a single song it's sending many requests to different MP3 files such as:
/media/3831430/3943025/c9OpfFFp3iYQ.128.mp3
/media/3192789/3352448/c9OpfFFp3iYQ.128.mp3
/media/3033128/3192788/c9OpfFFp3iYQ.128.mp3
Does anyone know what type of system they have going on there? Is this a common anti-piracy pattern for MP3 files that I could, perhaps, implement?
I was hit by the same problem, and I secured my storage bucket from the world by creating a middleware/pass-through service. Now this service has token validation of header and thus wont let your stream until you are authenticated. I used node pipe to achieve this, I hope this help. Here is sample code in js.
const http = require('http');
http.createServer(function(request, response) {
require('request')
.get("https://gcpmusicbucket.com/mp3/My-Song-1.mp3")
.pipe(response);
})
.listen(3000)

Nest Camera Video Streaming in VLC player

I have got a public share nest camera address from my friend.
Instead of using a web browser for seeing the video, I want to use a VLC player to video stream. This way allows me to use many other features of VLC to do video analytics on the video.
How to do it?
I was able to do this in these steps:
Go to the public video share URL. It should be something like this:http://video.nest.com/live/pSgnOZ0s4t
If you use developer tool on chrome and see network traffic ....look for a URL with .m3u8 in the end... it will be something like this:https://stream-delta.dropcam.com/nexus_aac/37451e60aeac457f9800704f1662147e/playlist.m3u8
Once you get that open that file in a text editor....you will get something like this inside the file
#EXTM3U
#EXT-X-VERSION:3
#EXT-X-STREAM-INF:BANDWIDTH=400816,CODECS="avc1.77.31,mp4a.40.2",RESOLUTION=1280x720
chunklist_w391480529.m3u8
The stream URL is then
https://stream-delta.dropcam.com/nexus_aac/37451e60aeac457f9800704f1662047e/chunklist_w391480529.m3u8
Once you have this then install livestreamer to extract video like this:
livestreamer "hls://https://stream-delta.dropcam.com/nexus_aac/37451e60aeac457f9800704f1662047e/chunklist_w391480509.m3u8" best -o nest_video.ts
This will save the file to your disk.
I used this to avoid nest aware subscription. Unfortunately, they charge so much for that service. When someone can just save the video to a disk and upload to a cheap cloud option...
I wrote a page that takes a public Nest video url and returns an HLS media .m3u8 streaming url
get media url for nest/ dropcam cameras

Manage security on file upload to nodejs

I have an image upload view on my client (ember.js) that send the resized image to nodejs rest api;
it works well but it is easy for someone expert to force upload of a non-resized image;
I would like to keep the resize process on the client because this allows users to select heavy-weight images, that are resized locally and uploaded only after that, when they are lightweight;
If someone else uses something like this, I'm interested on how it is possible to make this as safe as possible;
As a rule of thumb when developing web applications is never ever trust any data coming from the client side, always try to do a check in your server side!
Use authentication, this ensures that user only allow to upload data to their own account and not fiddling others files.
Add a special message passing between your server and client, a simple example would be
i. send a post API request first (that contains the image information and targeted compressed size) to your server indicating that your client is starting to compress the picture
ii. when uploading, add a metadata to include the complete compressed image, and check the uploaded image with your server if it is within the accepted threshold, else discard it
You could enhance the security of the message passing to be more complicated!
This would be my simple security, anyone else got better solution? :)
Approaches here also work for file uploads. You can use a combination of checking:
content-length header and/or (i.e. req.headers['content-length'] > x)
reading stream size as it's being read by server. (i.e req.on('data'))
If the stream data exceeds a certain size you can respond accordingly. Check out something like Multer for file uploads, specifically the limits section. Best approach would probably the second option.

Record Screen's Happenings(Audio+Video)

i am new baby in WebRTC and want to implement system like video conferencing , live streaming or you can skype using WebRTC and NodeJS.
i am confused with one thing , as its our one of client's requirement , suppose on page whatever is happening it may be video conferencing say one moderator answering to many audiences one by one , so there should be one video created , which continuously recording all this stuff together and sending live stream to server to save in our database.
is this kind of stuff implementable or not?
any help please.
You can capture video through grabbing Jpeg images from a canvas element. You could also capture the entire page(if numerous videos in the same page) through grabbing the page itself through chrome.
For audio, recording remote audio with the Audio API is still an issue but locally grabbed audio is not an issue.
RecordRTC and my Modified Version for recording streams either to file or through websockets respectively.
Capture a page to a stream on how to record or screenShare an entire page of Chrome.
If you have multiple different videos not all in the same page but want to combine them all, I would suggest recording them as above and then combining and syncing them up server side(not in javascript but probably in C or C++).
If you MUST record remote audio, then I would suggest that you have those particular pages send their audio data over websockets themselves so that you can sync them up with their video and with the other sessions.

Resources