Recorder.js를 이용하여 브라우저에서 녹음하다

브라우저에서 소리를 녹음하고 소리 파일을 다운로드하다


GitHub Pages 공개된 페이지에서 구현할 수 있습니다.
도서관 Recorder로서js를 사용하고 있습니다.

Recorder.js 소개


Recorder.jsWeb Audio API란 자바스크립트 API로 싸서 이 사운드 파일을 간단하게 녹음하고 출력할 수 있는 자바스크립트 프로그램 라이브러리다.
HTML 내에서 이 라이브러리를 읽으면 PC의 마이크를 사용하여 브라우저에서 녹음하고 사운드 파일을 다운로드할 수 있다.
GiitHub에 공개된 원시 창고를 수정 중입니다.
수정된 창고는 여기.입니다.또한 사용 예GitHub Pages로 브라우저에서 녹음하고 소리 파일을 다운로드할 수 있다.
사실 나는 프로그램 라이브러리를 수정하고 싶은 것이 아니라 브라우저를 이용하여 녹음하여 파일을 텍스트Amazon Transcribe로 처리하는 웹 서비스를 만들고 싶었지만 시간을 내지 못했다.

포크 원 Recorder.질문


포크 원 Recorder.2019년 12월까지 js의 개발이 중단되어 계속 사용할 수 없어서 유감입니다.
  • AudioContext.resume() 호출되지 않음
  • Navigator.getUserMedia() 이용
  • AudioContext.resume가 호출되지 않았습니다.


    AudioContext.resume()네...잘 모르겠어요.
    설명에서 중간에 멈춘 소리를 재생하기 위해 사용한 것 같은데, 오디오 콘텍스트의 초기화가 필요할 것 같은데요?
    이 방법을 추가하지 않으면 녹음할 수 없기 때문에 먼저 추가했다.

    Navigator.getUserMedia 사용()


    Navigator.getUserMedia() 추천하지 않습니다.따라서 일부 브라우저(Safari 등)는 API를 통해 작동할 수 없습니다.
    대체MediaDevices.getUserMedia()를 권장합니다.
    이번에 MediaDevices.getUserMedia() 실복 변경으로 사파리도 녹음할 수 있게 됐다.

    브라우저의 사용 예


    GitHub Pages 공개된 페이지에서 구현할 수 있습니다.
    마이크를 사용할 수 있고, 리코더 단추로 녹음을 시작합니다.
    stop을 누르면 녹음을 멈추고 소리 파일을 보여 줍니다. 브라우저에서 파일을 재생하거나 다운로드할 수 있습니다.
    다시 record,stop을 하면 소리 파일이 추가됩니다.
    (버튼이 촌스러워 보이고 개선된 점이 있다)

    끝말


    처음에 나도 썼는데 Amazon Transcribe 일본어에 대응하여 소리에서 텍스트를 녹음할 수 있기 때문이다
    나는 간단한 녹음과 텍스트화 서비스를 제공할 계획이다.
    AWS에서 자바스크립트 SDK가 공개됐는데, 시행 사례가 많아 어렵지 않을 것 같다.
    나는 시간이 있을 때 도전하고 싶다.

    좋은 웹페이지 즐겨찾기