Skip to content

Content Security Policy (CSP) requirements for Able Player #731

@courtneyr-dev

Description

@courtneyr-dev

Document the Content-Security-Policy header directives required for Able Player to function correctly, particularly when using YouTube and Vimeo sources. Site administrators enforcing CSP headers need to know which domains and directive values Able Player requires, but this information isn't currently documented anywhere.

Instruction Steps

  1. When a site enforces a Content-Security-Policy header, Able Player's YouTube integration fails because it loads the YouTube IFrame API as an external script (www.youtube.com/iframe_api). This requires www.youtube.com (and www.youtube-nocookie.com if the nocookie option is enabled) in the script-src directive.
  2. Standard YouTube iframe embeds still work on the same page because they only need frame-src, which is commonly configured. The issue is specific to Able Player's use of the JavaScript IFrame API.
  3. A documentation page should list the minimum CSP directives needed, including:
    • script-src: 'self' 'unsafe-inline' 'unsafe-eval' www.youtube.com www.youtube-nocookie.com
    • frame-src: www.youtube.com youtube.com player.vimeo.com
    • Any additional directives for core Able Player functionality (fonts, styles, etc.)

Screenshots

Image

Additional context
Related to #619, which discusses unsafe-inline and unsafe-eval requirements. This request covers the additional third-party domain requirements for YouTube.

A live example is at https://courtneyr.dev/2015/02/09/wordpress-4-1/ where an Able Player YouTube embed and a standard YouTube embed are on the same page. The standard embed works; the Able Player embed fails with the browser console error:

Refused to load the script 'https://www.youtube.com/iframe_api' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-inline' 'unsafe-eval' [other domains]"

In my case, the enforcing CSP is injected by a Sucuri WAF (web application firewall) and can't be modified from within WordPress. I've opened a support ticket with Sucuri to add [www.youtube.com](http://www.youtube.com/) and [www.youtube-nocookie.com](http://www.youtube-nocookie.com/) to the WAF's script-src directive. However, this highlights the need for documented CSP requirements -- without documentation, site admins using WAFs or strict CSP policies have no reference for what Able Player needs to function.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions