I am getting a CORS error when I give an m3u8 src file to react-video-js-play. Any ideas on how to fix this?
<VideoPlayer
className="videoPlayerRow"
controls={true}
src="https://pl.crunchyroll.com/evs3/92407c75eba573edaef323770da9b8cb/assets/1929c2ac66d38ae1c069c1879bda96cf_4033984.mp4/index-v1-a1.m3u8?Expires=1656894361&Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9wbC5jcnVuY2h5cm9sbC5jb20vZXZzMy85MjQwN2M3NWViYTU3M2VkYWVmMzIzNzcwZGE5YjhjYi9hc3NldHMvMTkyOWMyYWM2NmQzOGFlMWMwNjljMTg3OWJkYTk2Y2ZfKi5tM3U4PyoiLCJDb25kaXRpb24iOnsiRGF0ZUxlc3NUaGFuIjp7IkFXUzpFcG9jaFRpbWUiOjE2NTY4OTQzNjF9fX1dfQ__&Signature=nAGdrOC1FW24K70P75JczK~ZaxietPXEnjd-CsdtN-2qQ3xjIUUjSWL6A0nsT8gnY2BoLBUEbEF7Yc4Jsnb5ai0ueVtuubvBxuBRsYnPugqi23srd3eoJj6lrzjRRwhJHt2eTlx7uh9S0ZOLQkWtndZy5YWek9PxpdhuzkBGKEY7RzG9mriKEIq7wvf2JMasI8Gnjj7dQvWXJNvZmiUMpgLKuYPGzAhY1cM6h4C6ihTPNO861W82jjzkDC12-Hss-NfZWDVZvi2oF0IJlAeybNqjo2ck-HQYs58GhErTh1VnSj-YPHd1pSQKucH~zk6JyCpoSvz33UdoayEDLUGhDA__&Key-Pair-Id=APKAJMWSQ5S7ZB3MF5VA&cdn=akamai-prod"
height="480"
crossOrigin="use-credentials"
play
/>
Any help is appreciated.
CORS errors occur when one computer is requesting data from another. You may not be sending the correct headers in your request, or the site you're requesting data from may be rejecting your request altogether.
I'd check your headers first, then check and see if the site lets you get data from its servers (check the docs if you're using an API).