다른 웹사이트에서 mp3 파일을 재생하는 CORS 오류 수정

Question

제가 겪고 있는 문제는 내 React 앱이 다른 소스의 오디오를 재생하지 않고 CORS 오류가 발생한다는 것입니다. 예: https://audio.podigee-cdn.net/1041740-m-0fcf92e897e7cd93200a43cf103a75fb.mp3

이상한 점은 https://www.w3schools.com/tags/tag_audio.asp 접속 시 위의 URL을 입력하고 재생을 클릭한다는 점입니다.

내 로컬 React 앱에서 302 상태와 리디렉션을 받습니다. 오디오 태그에는 crossOrigin="anonymous"와 src 요소의 URL이 포함되어 있습니다.

W3Schools에서는 어떻게든 리디렉션되고 리디렉션된 URL에서만 상태 206을 얻습니다.

재현 방법:

1. git 클론 https://github.com/SamTV12345/PodFetch.git
2. "빌드" 섹션의 README 지침을 따르세요
3. git checkout 원산지/개발
4. 에피소드가 5개 이상인 팟캐스트를 추가하세요.
5. CloudIcon을 클릭하세요

Answer 1

CORS를 방지하려면 new Audio(url) 而不是 XMLHttpRequest를 통해 mp3 URL을 가져와야 합니다. 예:

으아악 으아악