Adding playback restrictions to secure video playback
-
–
Whilst it's all good being able to play videos, it's not good if some body can -
–
copy the video -
–
attack from your web page, put it on their own web pages, and then begin -
–
streaming your -
–
content, especially if you're placing this content behind a paywall and require -
–
customers -
–
to purchase access in order to view it. -
–
To combat this, Mux allows you to create playback restrictions. -
–
At their simplest, playback restrictions specify the hostnames that a video can be -
–
watched, so -
–
if you have a website foo.com and you add a playback restriction for foo.com, -
–
the video -
–
would not play on a web page host doing a bar.com or indeed any other domain. -
–
We can create playback restrictions via the Mux API. -
–
This is something you'll only need to do once, so this makes a good candidate -
–
for an -
–
Artisan command. -
–
Let's create a new Artisan command, called "CreateMuxPlaybackRestrictionCommand". -
–
We'll use the playback restrictions API class from the Mux SDK, so we'll need -
–
to -
–
again go back to our Mux service provider class and add a binding for this, -
–
just like -
–
we did with the configuration and direct uploads API. -
–
If we go back to our Artisan command class, we can now type hint this class in a -
–
constructor. -
–
We need to create a new "CreatePlaybackRestrictionRequest" instance. -
–
We'll set the "allowed_domains" as an argument. -
–
And also set "allow_no_referrer" to "false". -
–
For the "allowed_domains", we can accept this as an argument from the command. -
–
Let's also update our command signature. -
–
And add that argument. -
–
Now that we have the request, let's send it to Mux. -
–
And if the request was successful, let's print the ID of the newly-created -
–
playback restriction. -
–
Let's run the command. -
–
We also need to specify a hostname as an argument, so far we've been using -
–
localhost to access -
–
our application. -
–
However, we're going to need to use the IP address 127.0.0.1 instead, as Mux -
–
playback restrictions -
–
don't allow the hostname localhost. -
–
Run the command. -
–
And it looks like we forgot to call the parent constructor in our command's -
–
constructor. -
–
Let's go fix that. -
–
Simply add "parent::__construct". -
–
Try running the command again. -
–
And you see we've now got a playback restriction ID. -
–
Let's copy this into a new environment variable. -
–
We'll call it "MUX_PLAYBACK_RESTRICTION_ID" and paste that. -
–
And as before, let's map this to a configuration value. -
–
Open your config/services.php file. -
–
And add "playback_restriction_id". -
–
Reference in the "MUX_PLAYBACK_RESTRICTION_ID" environment variable. -
–
If you look at the Mux docs, it says that we should pass the playback -
–
restriction ID -
–
in our JWT payloads, so we'll update the playback method in our JwtFactory -
–
class to -
–
include this parameter. -
–
In your JwtFactory class, simply add this as a new claim. -
–
And reference the new configuration value. -
–
We could add this additional claim to the "thumbnail" method as well, but that -
–
would prevent -
–
third-party access where it's actually wanted, such as for building with social -
–
media previews -
–
when sharing pages on websites like Facebook, LinkedIn, and Twitter. -
–
If we added playback restrictions to thumbnail URLs, then those services would -
–
not be able -
–
to load the image due to requesting it from a different domain. -
–
If we go back to the browser and refresh, we shouldn't see any differences when -
–
trying to -
–
watch the video from the domain included in the playback restriction. -
–
However, if we try and view the video from a different domain, i.e. one -
–
generated by -
–
sail:share, then playback should fail as the exposed URL is not 127.0.0.1 that -
–
we included -
–
in the playback restriction.