Explanation and Working with CSP: media-src in HTTP

csp http media src guide
10 November 2024

Hello! Today we want to talk about Content Security Policy or CSP, which is a very important security layer that helps protect your website and users. If you are developing a web application, it is essential to be familiar with this topic. One of the important features of CSP is media-src.

The media-src directive allows you to specify where media such as video and audio can be loaded from. This can restrict media sources to be more controlled and secure. For example, you can specify that only media from your own domain is allowed to be loaded.

Suppose you have a site that loads some videos only from YouTube or your own domain. By using CSP, this can easily be accomplished, ensuring that nothing is loaded from untrusted sources.

In this way, when someone visits your page, the browser will only allow media to be loaded from specified sources. This helps ensure that your site is protected against certain attacks such as XSS.

Example of Using media-src in CSP


Content-Security-Policy: media-src http://example.com https://www.youtube.com;

Details of the Above Code

Content-Security-Policy: This part specifies the CSP and tells the browser which security policies to apply.
media-src: This directive states from where media resources can be loaded.
http://example.com: This address indicates that media can be loaded from the domain example.com.
https://www.youtube.com: This also indicates that media from YouTube can be loaded.

FAQ

?

Why should I use media-src in CSP?

?

Why is CSP important?

?

Is media-src the only way to limit media sources?