Amazon Prime Video Player Investigation

Today I had an hour of my free time to learn how Amazon Prime Video Player is working. I’ll show you my small investigation of what I found.

Where is the main script

  1. Pause the player
Amazon Video Player which is paused at the moment

2. Find<video> tag in DevTools > Elements

It could be 2 video elements, you need the one which is both 100% width and height

3. You need DevTools > Console to mock standard play method having current video$ = () => { debugger; }

4. Then you try to play video using player controls

5. Having Call Stack you can go to the file, which initiated a method play

6. You now know the main script name, which Amazon Prime pointed at the moment of the debugging to blob:, you can see it in Sources > Page

What can you find interesting inside the script

Private properties

State Machine

Key is the current state, values are the states which are available for the current state to have a transition to

Loading a bundle

In WebLoader there is hardcoded AppLoaderConfig. After reloading several times I couldn’t find a difference. Looks like config of stable version of modules which are used for different purposes. The config looks like that:

Configuration object within WebLoader.js

A bundle which we had a look into was loaded from ATVWebPlayer.js as a string of 6MB size!!! The string is taken from IndexedDB. The object after completed transaction is the following:

From the given string we can create a Blob, create object url as a script:

And we come back to the script which code initiated play when we debugged it in the first section. The name of the module is ATVWebCascadesPlayer

Alexey Berezin,
Front-end Developer from Yandex