HTML5 오디오
"오늘의AI위키"의 AI를 통해 더욱 풍부하고 폭넓은 지식 경험을 누리세요.
1. 개요
HTML5 오디오는 HTML5에서 소리 또는 오디오 스트림을 나타내는 `
| 형식 | 컨테이너 | MIME 유형 | 크롬 | 인터넷 익스플로러 | 엣지 | 파이어폭스 | 오페라 | 사파리 |
|---|---|---|---|---|---|---|---|---|
| PCM | WAV | audio/wav | ||||||
| MP3 | MP3 | audio/mpeg | [8] | [9] | [8] | |||
| AAC | MP4 | audio/mp4 | ||||||
| ADTS | audio/aac audio/aacp | [11][12] | ||||||
| Vorbis | Ogg | audio/ogg | [13][14] | [15] | ||||
| WebM | audio/webm | [13][14] | [16] | |||||
| Opus | Ogg | audio/ogg | [17][14] | [18] | ||||
| WebM | audio/webm | [17][14] | [19] | |||||
| CAF | audio/x-caf | |||||||
| FLAC | FLAC | audio/flac | [22] | [23] | [24] | [25] | ||
| Ogg | audio/ogg | [22] | [26][14] | [24] |
4. Web Audio API
W3C에서 개발한 Web Audio API는 웹 애플리케이션에서 오디오를 처리하고 합성하기 위한 고수준 자바스크립트 API이다.[27] 오디오 노드를 연결하여 오디오 라우팅 그래프를 구성하는 방식으로 작동한다. 실제 처리는 주로 최적화된 어셈블리/C/C++ 코드로 구현되지만, 자바스크립트를 이용한 직접 처리 및 합성도 지원된다.[27]
모질라 파이어폭스 브라우저는 2010년에 유사한 오디오 데이터 API를 구현하여 2011년 출시된 버전 4부터 제공했지만,[28] 모질라는 이것이 표준이 아니며 사용 중단되었음을 알리고, 대신 Web Audio API를 사용할 것을 권장한다.[29] [https://oampo.github.com/Audiolet/ Audiolet]과 같은 일부 자바스크립트 오디오 처리 및 합성 라이브러리는 두 API를 모두 지원한다.
W3C 오디오 작업 그룹은 모질라에서 개발한 미디어 스트림 처리 API 명세 또한 고려하고 있다.[30] 이 API는 오디오 믹싱 및 처리 외에도 HTML 요소와의 동기화, 오디오 및 비디오 스트림 캡처, 그리고 이러한 미디어 스트림의 피어 투 피어 라우팅을 포함하는 보다 일반적인 미디어 스트리밍을 다룬다.[31]
4. 1. 지원 브라우저
| 환경 | 브라우저 | 버전 | 비고 |
|---|---|---|---|
| PC | 구글 크롬 | 10[32] | 14부터 기본 활성화[33] |
| 파이어폭스 | 23 | 25부터 기본 활성화 | |
| 오페라 | 15 | ||
| 사파리 | 6 | ||
| 마이크로소프트 엣지 | 12 | ||
| 오페라 GX | 36 | ||
| 모바일 | 구글 크롬 for 안드로이드 | 28 | 29부터 기본 활성화 |
| 사파리 | 6 | 사용에 제한이 있음 (사용자가 호출하지 않는 한 음소거) | |
| 파이어폭스 | 23 | 25부터 기본 활성화 | |
| 타이젠 |
5. Web Speech API
웹 음성 API는 웹 애플리케이션에 음성 인식 및 음성 합성 기능을 제공하는 API이다. 음성 인식은 사용자의 음성을 텍스트로 변환하고, 음성 합성은 텍스트를 음성으로 변환하여 재생한다.
웹 음성 API는 키보드 사용 없이 웹 애플리케이션에 대한 대체 입력 방법을 제공하는 것을 목표로 한다. 개발자는 이 API를 통해 웹 앱에 컴퓨터 마이크에서 음성을 텍스트로 변환하는 기능을 제공할 수 있다. 녹음된 오디오는 텍스트 변환을 위해 음성 서버로 전송되며, 이후 텍스트가 사용자에게 표시된다. API 자체는 기반 음성 인식 구현에 관계없이 서버 기반 인식기와 내장 인식기 모두를 지원할 수 있다.[34]
'''HTML 음성 인큐베이터 그룹'''은 브라우저에서 오디오-음성 기술을 균일하고 플랫폼 간 API 형태로 구현할 것을 제안했다. API는 음성 입력 API와 텍스트 음성 변환 API를 모두 포함한다.[35]
구글은 2011년 3월 이 기능을 구글 크롬에 통합했다.[36]
5. 1. 지원 브라우저
웹 음성 API는 음성 합성 및 음성 인식으로 구성되며, 키보드나 마우스 이외의 입출력 수단을 제공한다.[48][49][50]| 기능 | 플랫폼 | 지원 브라우저 및 버전 |
|---|---|---|
| 음성 합성 | PC | 구글 크롬 33, 모질라 파이어폭스 49, 마이크로소프트 엣지, 오페라 21, 사파리 7 이상 |
| 모바일 | 구글 크롬 Android 33, 모질라 파이어폭스 61 (62부터 기본 설정으로 활성화), 마이크로소프트 엣지, iOS 사파리 7.1, Android WebView 33 이상 | |
| 음성 인식 | PC | 구글 크롬 25 ("webkit" 벤더 접두사 필요, 웹 서버를 통해 제공되지 않으면 사용 불가), 모질라 파이어폭스 44 (기본 설정에서는 비활성화) 이상 |
| 모바일 | 구글 크롬 Android ("webkit" 벤더 접두사 필요, 웹 서버를 통해 제공되지 않으면 사용 불가) 이상 |
참조
[1]
웹사이트
MP4 container · Issue #95 · karlheyes/icecast-kh
https://github.com/k[...]
2022-11-18
[2]
웹사이트
Technical Note TN2236: High-Efficiency Advanced Audio Coding (HE-AAC)
https://developer.ap[...]
[3]
웹사이트
1224887 – Implement OpenMax IL AAC audio decoding client
https://bugzilla.moz[...]
[4]
웹사이트
Media type and format guide: image, audio, and video content – Web media technologies | MDN
https://developer.mo[...]
[5]
웹사이트
September 11, 2012: Opus audio codec is now RFC6716, Opus 1.0.1 reference source released
https://www.xiph.org[...]
[6]
웹사이트
It's Opus, it rocks and now it's an audio codec standard! – Mozilla Hacks – the Web developer blog
https://hacks.mozill[...]
[7]
웹사이트
WebM, VP9 and Opus Support in Microsoft Edge – Microsoft Edge Dev BlogMicrosoft Edge Dev Blog
https://blogs.window[...]
2017-03-22
[8]
웹사이트
Enable mp3 support in Chromium
https://bugs.chromiu[...]
Google
2018-05-01
[9]
웹사이트
Firefox 71.0 release notes
https://www.mozilla.[...]
Mozilla
2019-12-03
[10]
웹사이트
Media type and format guide: image, audio, and video content
https://developer.mo[...]
Mozilla
2019-12-06
[11]
웹사이트
1190341 - audio/aacp shoutcast is not supported
https://bugzilla.moz[...]
[12]
웹사이트
1169212 - Create ADTSDemuxer, a MediaDataDemuxer
https://bugzilla.moz[...]
[13]
웹사이트
Platform Status – Microsoft Edge Developer
https://developer.mi[...]
[14]
웹사이트
Introducing the Web Media Extension Package with OGG Vorbis and Theora support for Microsoft Edge
https://blogs.window[...]
Microsoft
2017-12-05
[15]
웹사이트
Firefox Notes - Desktop
https://website-arch[...]
[16]
웹사이트
Firefox Notes - Desktop
https://website-arch[...]
[17]
웹사이트
Platform Status – Microsoft Edge Developer
https://developer.mi[...]
[18]
웹사이트
Firefox Notes - Desktop
https://website-arch[...]
[19]
웹사이트
Firefox 28.0, See All New Features, Updates and Fixes
https://www.mozilla.[...]
[20]
웹사이트
New WebKit Features in Safari 15
https://webkit.org/b[...]
2021-10-26
[21]
웹사이트
Apple Developer Documentation
https://developer.ap[...]
[22]
웹사이트
FLAC codec support for <audio> and WebAudio
https://www.chromest[...]
2016-12-27
[23]
웹사이트
Platform Status – Microsoft Edge Developer
https://developer.mi[...]
[24]
웹사이트
Firefox 51 for developers
https://developer.mo[...]
2016-12-27
[25]
웹사이트
Apple reportedly adds support for FLAC lossless audio in iOS 11
https://www.theverge[...]
2017-06-06
[26]
웹사이트
Platform Status – Microsoft Edge Developer
https://developer.mi[...]
[27]
웹사이트
Web Audio API
https://dvcs.w3.org/[...]
W3C
2012-07-04
[28]
웹사이트
Audio Data API
https://wiki.mozilla[...]
[29]
웹사이트
Introducing the Audio API extension
https://web.archive.[...]
Mozilla
2012-07-04
[30]
웹사이트
Audio Processing API
http://www.w3.org/TR[...]
W3C
2012-07-04
[31]
웹사이트
MediaStream Processing API
http://www.w3.org/TR[...]
W3C
2012-07-04
[32]
웹사이트
Web Audio API is now available in Chrome from Chris Rogers on 2011-02-01 (public-xg-audio@w3.org from February 2011)
https://lists.w3.org[...]
2022-11-18
[33]
웹사이트
Chrome 14 Adds Better Audio, 'Native Client' Support
http://www.webmonkey[...]
Wired
2012-07-04
[34]
웹사이트
API draft
http://lists.w3.org/[...]
2012-01-28
[35]
웹사이트
HTML5 Speech API
https://wiki.mozilla[...]
2012-01-28
[36]
웹사이트
Talking to your computer
http://chrome.blogsp[...]
2012-01-28
[37]
웹사이트
Web Speech API – Web APIs · MDN
https://developer.mo[...]
2024-05-20
[38]
웹사이트
Firefox 49 for developers – Mozilla · MDN
https://developer.mo[...]
2024-05-20
[39]
웹사이트
Web Speech API – Web APIs · MDN
https://developer.mo[...]
2024-05-20
[40]
문서
About HTML5 Audio and Video - Safari HTML5 Audio and Video Guide
http://developer.app[...]
[41]
웹사이트
https://developer.mo[...]
[42]
웹사이트
https://www.xiph.org[...]
[43]
웹사이트
https://hacks.mozill[...]
[44]
웹사이트
Web Audio API
https://dvcs.w3.org/[...]
W3C
2012-03-15
[45]
웹사이트
MediaStream Processing API
https://www.w3.org/T[...]
W3C
2012-05-31
[46]
웹사이트
Web Audio API is now available in Chrome
http://lists.w3.org/[...]
[47]
웹사이트
Chrome 14 Adds Better Audio, ‘Native Client’ Support
http://www.webmonkey[...]
Wired
2011-09-19
[48]
웹사이트
mdn/browser-compat-data
https://github.com/m[...]
2018-06-13
[49]
웹사이트
mdn/browser-compat-data
https://github.com/m[...]
2018-06-13
[50]
웹사이트
Web Speech API
https://developer.mo[...]
2018-06-13
[51]
웹인용
HTML5 audio element – W3C
http://www.w3.org/TR[...]
2013-07-02
[52]
웹인용
TechFans.net – Technology and Business News blog
https://www.techfans[...]
2022-11-18
[53]
웹인용
MP4 container · Issue #95 · karlheyes/icecast-kh
https://github.com/k[...]
2022-11-18
[54]
웹인용
Technical Note TN2236: High-Efficiency Advanced Audio Coding (HE-AAC)
https://developer.ap[...]
[55]
웹인용
1224887 – Implement OpenMax IL AAC audio decoding client
https://bugzilla.moz[...]
[56]
웹인용
Media type and format guide: image, audio, and video content – Web media technologies · MDN
https://developer.mo[...]
[57]
웹인용
September 11, 2012: Opus audio codec is now RFC6716, Opus 1.0.1 reference source released
https://www.xiph.org[...]
[58]
웹인용
It's Opus, it rocks and now it's an audio codec standard! – Mozilla Hacks – the Web developer blog
https://hacks.mozill[...]
[59]
웹인용
WebM, VP9 and Opus Support in Microsoft Edge – Microsoft Edge Dev BlogMicrosoft Edge Dev Blog
https://blogs.window[...]
2016-04-18
본 사이트는 AI가 위키백과와 뉴스 기사,정부 간행물,학술 논문등을 바탕으로 정보를 가공하여 제공하는 백과사전형 서비스입니다.
모든 문서는 AI에 의해 자동 생성되며, CC BY-SA 4.0 라이선스에 따라 이용할 수 있습니다.
하지만, 위키백과나 뉴스 기사 자체에 오류, 부정확한 정보, 또는 가짜 뉴스가 포함될 수 있으며, AI는 이러한 내용을 완벽하게 걸러내지 못할 수 있습니다.
따라서 제공되는 정보에 일부 오류나 편향이 있을 수 있으므로, 중요한 정보는 반드시 다른 출처를 통해 교차 검증하시기 바랍니다.
문의하기 : help@durumis.com