Webaudio-wijzigingen in m36

Chris Wilson
Chris Wilson

Webaudio-wijzigingen

Bij Google houden we van standaarden. We zijn op een missie om het door standaarden gedefinieerde webplatform uit te bouwen. Een van de kleine problemen op dat gebied is al enige tijd de webkit-prefix-implementatie van de Web Audio API (met name het webkitAudioContext-object) en enkele van de verouderde stukjes Web Audio die we zijn blijven ondersteunen.

Oorspronkelijk was het de bedoeling dat Chrome 36 de ondersteuning voor het vooraf ingestelde webkitAudioContext zou verwijderen, aangezien we begonnen waren met het ondersteunen van het niet-vooraf ingestelde AudioContext-object. Dit bleek lastiger dan verwacht, dus Chrome 36 ondersteunt zowel unprefixed als prefixed - maar zelfs in de opnieuw geïntroduceerde webkitAudioContext zijn verschillende oudere methoden en attributen zoals createGainNode en createJavaScriptNode verwijderd. Kortom, in Chrome 36 zijn webkitAudioContext en AudioContext aliassen van elkaar; er is geen verschil in functionaliteit tussen de twee.

We zullen de ondersteuning voor het voorvoegsel volledig verwijderen na Chrome 36, waarschijnlijk in een aantal releases. We zullen hier een aankondiging doen wanneer de verandering op handen is, en we blijven contact opnemen met auteurs om hun Web Audio-applicaties te repareren.

Waarom hebben we dit gedaan, in plaats van terug te keren naar de vorige implementatie? Welnu, gedeeltelijk zijn we terughoudend geweest om te ver achteruit te gaan; we hebben die API's al verwijderd, en als mooi neveneffect van deze aliasing kunnen applicaties dan goed werken in Firefox, dat nooit een vooraf ingesteld AudioContext-object heeft ondersteund (en terecht ook!) in hun Web Audio-ondersteuning die aanvankelijk werd uitgebracht laatste val.

De rest van deze update biedt een handleiding voor het repareren van zaken die mogelijk defect zijn in uw code als gevolg van deze wijziging. Het mooie van het oplossen van deze problemen is dat uw code dan zeer waarschijnlijk ook gewoon in Firefox werkt! (Ik dacht lange tijd dat mijn Vocoder-applicatie kapot was vanwege de implementatie van Firefox, maar het bleek een van deze problemen te zijn!)

Als je gewoon aan de slag wilt, wil je misschien eens kijken naar een monkey-patch- bibliotheek die ik heb geschreven voor applicaties die zijn geschreven naar de oude Web Audio-code - dit kan je helpen om in een minimum van tijd aan de slag te gaan. tijd, omdat het de objecten en methoden op de juiste manier van een alias zal voorzien. De patches die in de bibliotheek worden vermeld, zijn inderdaad een goede leidraad voor de dingen die zijn veranderd.

Eerst en vooral

Eventuele verwijzingen naar window.webkitAudioContext moeten in plaats daarvan worden gemaakt naar window.AudioContext . Vaak is dit opgelost met een simpele:

window.AudioContext = window.AudioContext || window.webkitAudioContext;

Als uw app reageert met iets als 'Helaas ondersteunt uw browser geen webaudio. Gebruik alstublieft Chrome of Safari.” - het zoekt waarschijnlijk expliciet naar webkitAudioContext . Slechte ontwikkelaar! Je had Firefox al maanden kunnen ondersteunen!

Maar er zijn nog een paar andere, subtielere codeverwijderingen, waarvan sommige minder voor de hand liggend kunnen zijn.

  • De door BiquadFilter opgesomde typeconstanten voor het .type attribuut (dat nu een tekenreeks is) verschijnen niet langer op het BiquadFilterNode object en we ondersteunen ze niet op het .type attribuut. Je gebruikt dus niet meer .LOWPASS (of 0) - je stelt het in op “lowpass”.
  • Bovendien is het Oscillator.type attribuut nu op dezelfde manier een door een string opgesomd type - niet meer .SAWTOOTH .
  • PannerNode.type is nu ook een door strings opgesomd type.
  • PannerNode.distanceModel is nu ook een door strings opgesomd type.
  • createGainNode is hernoemd naar createGain
  • createDelayNode is hernoemd naar createDelay
  • createJavaScriptNode is hernoemd naar createScriptProcessor
  • AudioBufferSourceNode.noteOn() is nu vervangen door start()
  • AudioBufferSourceNode.noteGrainOn() is nu ook vervangen door start()
  • AudioBufferSourceNode.noteOff() is hernoemd naar stop()
  • OscillatorNode.noteOn() is hernoemd naar start()
  • OscillatorNode.noteOff() is hernoemd naar stop()
  • AudioParam.setTargetValueAtTime() is hernoemd naar setTargetAtTime()
  • AudioContext.createWaveTable() en OscillatorNode.setWaveTable() zijn nu hernoemd naar createPeriodicWave() and setPeriodicWave()`.
  • AudioBufferSourceNode.looping is verwijderd ten gunste van .loop
  • AudioContext.createBuffer(ArrayBuffer, boolean) voor het synchroon decoderen van een klodder gecodeerde audiogegevens is verwijderd. Synchrone oproepen die veel tijd in beslag nemen, zijn slechte codeerpraktijken; gebruik in plaats daarvan de asynchrone decodeAudioData-aanroep. Dit is een van de meer uitdagende veranderingen – je moet de logicastroom daadwerkelijk veranderen – maar een veel betere praktijk. Ehsan Angkari van Mozilla schreef een mooi voorbeeld van hoe je dit kunt doen in hun bericht over het converteren naar standaard webaudio .

Veel hiervan (zoals het hernoemen van createGainNode en het verwijderen van de synchrone decodering in createBuffer) zullen uiteraard als een fout in de console voor ontwikkelaarstools verschijnen - maar sommige anderen, zoals dit gebruik:

MULTI_LINE_CODE_PLACEHOLDER_1

zal helemaal niet verschijnen en zal stilzwijgend mislukken (myFilterNode.BANDPASS zal nu worden omgezet in ongedefinieerd, en de poging om .type in te stellen op ongedefinieerd zal eenvoudigweg geen enkel effect opleveren. Dit was overigens de oorzaak dat de vocoder fail.) Op dezelfde manier werkte het toewijzen van filter.type aan een nummer:

myFilterNode.type = 2;

Maar nu moet je de stringopsomming gebruiken:

myFilterNode.type = “bandpass”;

Het kan dus zijn dat u uw code wilt gebruiken voor de volgende termen:

  • webkitAudioContext
  • .LOWPASS
  • .HIGHPASS
  • .BANDPASS
  • .LOWSHELF
  • .HIGHSHELF
  • .PEAKING
  • .NOTCH
  • .ALLPASS
  • .SINE
  • .SQUARE
  • .SAWTOOTH
  • .TRIANGLE
  • .noteOn
  • .noteGrainOn
  • .noteOff
  • .setWaveTable
  • .createWaveTable
  • .looping
  • .EQUALPOWER
  • .HRTF
  • .LINEAR
  • .INVERSE
  • .EXPONENTIAL
  • createGainNode
  • createDelayNode
  • .type (ja, dit zal veel valse positieven bevatten - maar het is de enige manier om het laatste voorbeeld hierboven te vangen!)

Nogmaals, als je haast hebt en aan de slag wilt, pak dan gewoon een kopie van mijn monkeypatch webkitAudioContext-bibliotheek en neem deze op in je applicatie. Veel audiohackplezier!