Streaming audio without download
I'm sure many of you have often wondered how companies allow you to listen to audio or watch video, but don't allow you to right click and download, or even simply specify the URL and download it that way.
I'm sure some of you naughty people out there have found ways around that and can still download streamed audio or video, which understandably happens, but at least you've been poking around to work out how to do it.
However, not all systems will allow that, unless you're able to get the stream directly.
A long time ago in a company long now closed I did something similar using VB, ASP (no not .Net it was too long ago), where I had to hide the actual document URLs from the users so that I could put security around who could view what, without knowing where it really was. Trust me, back then with Microsoft products it was a pain, as even changing the HTTP response didn't guarantee the user was going to be able to see the document without a pop up. But these days, it has got a lot better, and as for a long time I like my Unix and Linux systems, way more.
Having recently updated the company web site, which lost the ability to stream audio without download, due to the original company changing it's plans., decided that I'd write my own version.
The components used to implement the secure stream and prevent download are;
- Google reCaptcha v1 - Validation
- node.js - Back-end
- ReactJS - Front-end
- Express
- JSON
The URL that we're talking about is https://www.therapypages.com/player
The page you'll notice has the Google reCaptcha logo, meaning you're letting me know you've been to the page as a human being, less the faff (technical word, in this case meaning you don't have to click on silly pictures or type in some random text). Without a reCaptcha token the list of files will not appear, since it is checked by the back-end node.js server to ensure that the token is valid during the API call. If valid the server returns a JSON list back to the ReactJS code to provide the pull down list.
On selecting the track to play and clicking the Play Audio another call to the back-end server API is made sending the token and the track to the server, which then buffers the track and returns as a stream of data, rather than an audio file, by changing the content header in the HTTP response and content disposition to in-line before using fs.createReadStream to stream the file. The ReactJS front-end uses useRef to play the stream.
With the API only streaming the file content, no URL is available to access the file directly, so no straight forward URL to pop into a browser, or command line tool. When reviewing the developer tools you will only see the call to the API.
It's not a guaranteed prevention to stop downloading, as those clever folks out there will work out how to craft the right action to get the stream from the API server, but it works in a similar way to those other companies that charge a lot of money to perform similar features to not right click on your media.
Where there is a stream, there will always be a way to download media content, as long as you know the format that is being streamed and how to decode it.
As long as you have your own web servers that allow you to write the code you can mostly protect the content from everyday use.
The code for this is not publicly available, but you can work out how to implement your own semi-secure media player using Internet searches and or Copilot. You won't get a complete solution, so you will need to know how to put it together, as Copilot will show you old code, and you'll need to understand how to use the validation methods, such as reCaptcha through documentation.
If you're interested in having something like this developed, or interested in how it was coded send me an Email through the contact form on the web site.
