Skip to content

MediaElement does not work with CSP without 'unsafe-inline' specified for style-src #2729

@yippibrian

Description

@yippibrian

If I set up my "Content-Security-Policy" (CSP) header as follows (using Apache .htaccess format) then MediaElementJS works fine.

Header always set Content-Security-Policy "default-src 'self'; style-src 'self' 'unsafe-inline'"

If I remove the 'unsafe-inline' from the end of the above line, then the play/pause button and the volume button on the player disappear as shown in the following image. This indicates that some stylesheets used by MediaElementJS has inline <script> elements, javascript: URLs, inline event handlers, or inline <style> elements.

It would be better security if MediaElementJS worked with the more strict CSP setting where you do not specify 'unsafe-inline' and it should be possible to rework the code to support this.

Here is some information about CSP for reference: https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP

ME-error

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions