WebAudioAPI4 [자바스크립트] MediaElementAudioSourceNode 음원 파일(mp3, wav 등) 사용 방법 Web Audi API는 음원의 타입(파일, 버퍼, 스트림 등)에 따라 소스Node와 작업 방식이 조금씩 다르다. 45초 이상의 긴 음원 파일(mp3, wav)을 다루기 위해서는 MediaElementAudioSourceNode를 소스Node로 이용해야 한다. 이 글에서는 MediaElementAudioSourceNode를 통해 mp3 등의 음원파일을 다루는 방법을 정리한다. ※ Web Audio API의 기본 사용 방법은 아래 글 참고 [자바스크립트] Web Audio API 기본 원리와 예제 코드 ※ 45초 이하의 짧은 음원을 다루는 AudioBufferSourceNode는 아래 글 참고 [자바스크립트] AudioBuffer, AudioBufferSourceNode 사용 방법 & 예제 코드 # Med.. 2022. 1. 20. [자바스크립트] AudioBuffer, AudioBufferSourceNode 사용 방법 & 예제 코드 자바스크립트 Web Audio API는 "짧은 오디오 데이터"를 다룰 때 AudioBufferSourceNode 객체를 이용한다. 이 글에서는 AudioBufferSourceNode를 통해 1) 개발자가 생성한 오디오 데이터, 2) mp4, wav 등의 파일로 된 짧은 음원 등을 다루는 방법을 정리한다. 글의 가장 하단에는 각각에 대한 예제 코드를 정리해두었다. Web Audio API의 기초에 대해서는 아래 글을 참고하자. [자바스크립트] Web Audio API 기본 원리와 예제 코드 # AudioBufferSourceNode 란? AudioBufferSourceNode는 AudioBuffer를 음원으로 입력받는 소스Node 객체이다. 주로 45초 이내의 짧은 오디오를 단 1회 재생하는 용도로 사용된.. 2022. 1. 19. [자바스크립트] Oscillator Node 사용 방법 & 예제코드 자바스크립트 Web Audio API를 이용하면 다양한 소스의 음원을 다룰 수 있다. 이번 글에서는 개발자가 직접 소리를 만들 수 있는 Oscillator Node에 대한 기초 사용 방법을 정리한다. 구체적으로 아래와 같이 특정 파형/주파수의 소리를 만들어 낼 수 있다. (실제로 작동한다. 재생 버튼을 눌러보자. 코드 전문은 글 하단에 작성해두었다.) 2022. 1. 18. [자바스크립트] Web Audio API 기본 원리와 예제 코드 # Web Audio API란? Web Audio API란 오디오 데이터를 입력받아, 각종 처리 및 분석을 수행할 수 있게 해주는 API이다. Web Audio API에서 다룰 수 있는 소리 데이터는 아래의 4가지가 있다. 1) Oscillator: 주파수, 볼륨, 파형을 계산해 만들어내는 소리 2) AudioBuffer: 짧은 오디오 데이터 3) MediaElement: mp3, wav 등의 오디오 파일 4) MediaStream: 마이크 등을 통해 들어오는 스트림 객체 # Web Audio API가 필요한 이유? HTML에서 태그를 이용하면, 오디오를 재생/정지하고 볼륨을 조정할 수 있다. 물론 오디오의 재생위치를 조정하고, 재생완료 등의 이벤트 처리도 가능하다. 하지만 딱 거기까지다. 이게 끝이다... 2022. 1. 10. 이전 1 다음
