Im trying to add JWPlayer to my React component, i know in a static/server rendered webpage you can simply add the script tag, and then you can use the component but in react its a different story.
for example in a server rendered language like php rendering a JWPlayer component looks as follows:
<script src="location of jwplayer library cdn"></script>
</head>
<body>
<div id="myElement"></div>
<script type="text/JavaScript">
jwplayer("myElement").setup({
"playlist": [{
"file": "<?php echo $videourl; ?>"
}]
});
</script>
this is easy, and there is ample documentation on how to make this work. but i want to be able to use the CDN from JWPlayer in react as well, and the most popular react package has been deprecated, and is no longer being supported. I feel like i should be able to add to the DOM the cdn, and then be able to use that to be able to finish the rest of this.
for example i have:
useEffect(() => {
const JWPlayerScript = async () => {
const script = document.createElement("script");
script.type = "text/javascript";
script.src = "location of jwplayer library cdn";
script.async = true;
document.body.appendChild(script);
};
JWPlayerScript()},[])
This works, however i still dont have access to any of the javascript in the cdn, my console just keeps stating that jwplayer() has not been defined, and its correct. it hasnt but i dont know how to extract that from the cdn to gain access to those javascript functions.