feat: add crossOrigin prop to allow users to configure for cross-orig…

…in subtitle resources
DTS-STN · Jun 6, 2023 · 5c8a1bc · 5c8a1bc
1 parent ff9411e
commit 5c8a1bc
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 2 deletions.
diff --git a/src/components/Media/VideoPlayer/Video.js b/src/components/Media/VideoPlayer/Video.js
@@ -18,7 +18,7 @@ import { Image } from "../../Image/Image";
 import "../styles.css";
 
 export function Video(props) {
-  const { id, videoURL, poster, description, trackProps } = props;
+  const { id, videoURL, poster, description, trackProps, crossOrigin } = props;
   const [state, setState] = React.useState({
     pausePlay: false,
     mute: false,
@@ -180,7 +180,12 @@ export function Video(props) {
               onEnded={handleEnd}
               config={{
                 file: {
-                  attributes: { poster: poster, crossOrigin: "anonymous" },
+                  attributes: {
+                    poster: poster,
+                    crossOrigin: `${
+                      crossOrigin === true ? "anonymous" : false
+                    }`,
+                  },
                   tracks: [
                     {
                       kind: trackProps.kind,
@@ -435,6 +440,10 @@ export function Video(props) {
   );
 }
 
+Video.defaultProps = {
+  crossOrigin: false,
+};
+
 Video.propTypes = {
   /**
    * component id
@@ -468,4 +477,9 @@ Video.propTypes = {
     srcLang: PropTypes.oneOf(["en", "fr"]),
     kind: PropTypes.string,
   }),
+
+  /**
+   * Allow cross-origin requests for subtitle/caption tracks (false by default)
+   */
+  crossOrigin: PropTypes.bool,
 };
diff --git a/src/components/Media/VideoPlayer/Video.stories.js b/src/components/Media/VideoPlayer/Video.stories.js
@@ -33,4 +33,5 @@ VideoPlayer.args = {
     src: exampleCaps,
     srcLang: "en",
   },
+  crossOrigin: false,
 };