react-player icon indicating copy to clipboard operation
react-player copied to clipboard

Published 20 hours ago • verified publisher icon cookpete

Subresouce integrity? Runtime CDN as opt-in? Should CDN even be used?

Open toastal opened this issue 2 years ago • 0 comments

Current Behavior

Arbitrary scripts I didn't consent to are injected into my application. I did not expect this nor do should I trust an arbitrary script, or the CDN it comes from--especially without the subresource integrity check.

Expected Behavior

This is a three-parter moving out philosophically:

  1. The integrity attribute should be added to all CDN script requests. 5+ years after #527 was closed, the issue is not addressed. Reasons why integrity should exist are well known, and the bug mentioned it could be done but never was implemented as far as I can tell.
  2. Runtime script injections should be opt-in. When I include a library into my project, I do not want random scripts to appear without my consent. This is not the same as being able to look through the package.lock and see if there are security issues. The documentation explains how to opt-out of this behavior, not opt-in. I believe the documentation should say to add hls.js to the project, or how to enable the automatic runtime script injection (e.g. <ReactPlayer automaticScriptInjection={true} />). I think runtime script inject, while well-intentioned, is trying too hard to be "easy" while not considering simplicity or security.
  3. CDNs maybe shouldn't be used at all. I'm assuming hls.js, et.al. are not already compiled in as requirements to reduce the size of the project :+1:, however ReactPlayer could just throw an error for missing library linking to the documentation on how these libraries are added. This would be a simple solution that would leave the project with less lines of code, no or less need to manually manage the versioning of these scripts compatible versions, and providing better security.

I am open to being wrong in the sense that no. 3 does not align with some usability goals of the project. If that's true, I'm likely better off building this in myself and not using ReactPlayer project, however I do think 1 is a requirement and 2 is a good idea.

Steps to Reproduce

I've come into a fresh project and I'm seeing this in the <head> injected from ReactPlayer:

<script type="text/javascript" charset="utf8" async="" src="https://cdn.jsdelivr.net/npm/[email protected]/dist/hls.min.js"></script>

Environment

  • URL attempting to play: N/A
  • Browser: Firefox 98
  • Operating system: NixOS
  • jsFiddle example: N/A

Other Information

This whole issue is prompted by me trying to enumerate which domains were needed to support for CSP (content security policy). I do not want CDNs to have my users' data metadata wherever possible nor the stability or security issues of when these CDNs go down or get hacked. Seeing scripts injected by a React component at runtime was a unwelcome surprise. I can move forward easily by now including my own hls.js, but I disagree the current setup and default behavior.

toastal avatar Feb 22 '22 09:02 toastal