Howler에 대해 자세히 설명합니다.js 웹 오디오 재생 궁극의 솔루션

앞말
많은 사람들이 모바일 오디오 재생을 쓸 때 많은 구덩이를 밟았다고 믿습니다. 특히 복잡한 오디오 프로젝트는 여러 가지 장치를 호환할 때 더욱 당신을 미치게 합니다. 예를 들어 ios 단말기는 처음부터 오디오를 재생할 수 없고 반드시 사용자가 조작해야 합니다...
우연히 모든 장치와 브라우저를 호환하는 오디오 엔진 Howler를 알게 되었다.js를 사용해봤는데 완벽해요.
Howler.js는 새로운 자바스크립트 라이브러리로 웹의 오디오를 처리하는 데 사용됩니다. 이 라이브러리는 처음에 HTML5 게임 엔진을 위해 개발되었지만 다른 웹 프로젝트, Howler에도 사용할 수 있습니다.js는 Google의 웹 Audio API를 기반으로 하여 빠르고 간단하며 전면적으로 오디오를 제어할 수 있습니다.
특징 및 호환성

Howler.js는 기본적으로 웹 오디오를 사용하지만 IE에서 자동으로 HTML 5 오디오로 전환할 수 있습니다.이 점은 아주 마음에 들어요.

이동단의 사파리와 크롬은 웹 페이지에서 자동으로 소리를 재생하는 것을 금지하고 사용자의 조작, 터치, 클릭 등을 통해 촉발해야 한다.Howler.js는 사용자 동작을 자동으로 포착하여 소리 재생을 활성화(해제)하도록 설정할 수 있습니다

Howler.js는 다양한 브라우저를 호환하기 위해 많은 소리 형식을 지원합니다.MP3, MPEG, OPUS, OGG, OGA, WAV, AAC, CAF, M4A, MP4, WEBA, WEBM, DOLBY, FLAC.거의 모든 형식을 포괄했다

3D 게임 지원

자동 캐시

페이드 아웃 효과 지원

경량

순수 JS

제3자 의존이 없다

모듈화

"더 많은 기능은 Github에서 확인할 수 있습니다Howler.js"
사용 방법
홈페이지에 소개가 되어 있는데 토론이 많아요.

import {Howl, Howler} from 'howler';

//  
const sound = new Howl({
 src: ['sound.webm', 'sound.mp3']
});

//  
sound.play();

//  
Howler.volume(0.5);

//  
const sound = new Howl({
 src: ['sound.webm', 'sound.mp3'],
 volume:0.5
});

Howler를 사용합니다.js
가장 기본적인 MP3 재생:

var sound = new Howl({
 urls: ['sound.mp3']
}).play();

추가 재생 옵션:

var sound = new Howl({
 urls: ['sound.mp3', 'sound.ogg', 'sound.wav'],
 autoplay: true,
 loop: true,
 volume: 0.5,
 onend: function() {
  console.log('Finished!');
 }
});

일부 오디오 정의 및 재생

var sound = new Howl({
 urls: ['sounds.mp3', 'sounds.ogg'],
 sprite: {
  blast: [0, 1000],
  laser: [2000, 3000],
  winner: [4000, 7500]
 }
});

// shoot the laser!
sound.play('laser');

총결산
자체 봉인된 오디오 라이브러리가 얼마나 많든 적든 성능과 호환 문제가 있을 수 있다. 예를 들어 오디오가 순환 재생될 때 Howler가 아주 잘 처리되어 절단된 느낌이 나지 않는다.
이 부분에서 Howler에 대해 상세하게 설명합니다.js 웹 오디오 재생 궁극적 해결 방안에 대한 기사는 여기에 소개되어 있습니다.js 웹 오디오 재생 내용은 저희 이전의 글을 검색하거나 아래의 관련 글을 계속 찾아보세요. 앞으로 많이 사랑해 주세요!