This week, I thought of a cool idea for my chat app. The idea was to allow a user to watch Netflix with other people in an online room, and chat with them at the same time. It turns out, Netflix had closed their public API a few years ago. After doing some Googling, I found out that some other independent developers have managed to find ways around the issue, so I was persistent on getting this awesome idea I had working.
For hours on end, I searched with web, looking for ideas on how I could it all work. The only workarounds I could find were ugly “hacks” at best, such as triggering mouse events on the Netflix video player element, allowing the script to pause and play the video on command. I probably would have been able to make my project work using those methods, but there was something else that stood in my way.
The security on browsers does not allow cross-domain scripting. What this means, is that if my code was hosted on “netflix.com”, it would have worked perfectly. Anywhere else, and my script would not work. This feature in browsers prevents sites from doing malicious things to typically safe sites, such as stealing your banking information straight from your bank’s website when you click the login button. It’s an important and necessary feature, but it’s something that hadn’t even crossed my mind until it slapped me in the face.
Eventually, after I seeing how complicated the process was getting, I decided against using Netflix as a whole. I did not want to give up on the video streaming idea, but since Netflix is so big in that industry, thinking of an alternative service was difficult. I would need to find one that is more open to letting developers like me have access to their services. For a little while, I was using the library “video.js”, along with an extension to it called “VideoJS HLS” to allow support for arbitrary streams. Using some example stream URLs, I was able to verify that it worked. The next step was to actually find the streams that it would play.
If I can’t find a movie or show on Netflix, I use the media center “Kodi”. If I could find out where the video add-ons I use supply their streams, I’d be all set. So I spent another few hours looking but it seemed that there was nothing to be found. I kept writing down ideas in my notebook, trying to think of a way to get around all these obstacles. Some of the ideas included using a PHP script to parse HTML and extract any video sources. That didn’t work, as it used methods that are usually blocked by web hosts. After that, I started looking for a way to just share your browser window with someone else. At this point is when I realized it was time to take a break, as I was losing touch with the original idea.
The only thing I haven’t tried yet was writing a bookmarklet or Chrome extension to allow my code to interface with Netflix’s player. This would help me get around the cross-domain scripting issue I mentioned earlier. Unfortunately, things were starting to fall out of the scope of the project. The final product wouldn’t have been what I’d originally envisioned. With so many limitations imposed, I decided that this idea is something I’ll just have to come back to when I have more time to work on it, and some new ideas for how to go about executing the idea. I’m still going to be working on a similar idea for the project, but instead of allowing users to watch streams together, it will let them watch YouTube videos. They will be able to add several videos to a queue, and have them play in order. Thankfully, YouTube’s API lets me do everything that I need.
Though it was frustrating, I’m glad that I went through this process. I learned some valuable things about browser security that will affect my projects in the future. Next time I have an idea that involves working with another service, I’ll know what I can and cannot do.