שינויים ב-Web Audio
ב-Google אנחנו אוהבים תקנים. המשימה שלנו היא לפתח את פלטפורמת האינטרנט שמוגדרת לפי תקנים. אחד מהחסרונות הקטנים של ה-API הזה היה במשך זמן מה ההטמעה עם הקידומת webkit של Web Audio API (במיוחד האובייקט webkitAudioContext), וחלק מהקטעים של Web Audio שהוצאו משימוש ואנחנו ממשיכים לתמוך בהם.
במקור, התכנון היה להסיר את התמיכה ב-webkitAudioContext עם הקידומת ב-Chrome 36, כי התחלנו לתמוך באובייקט AudioContext ללא הקידומת. התברר שהפעולה הזו הייתה בעייתית יותר מהצפוי, ולכן ב-Chrome 36 יש תמיכה גם ב-webkitAudioContext ללא קידומת וגם ב-webkitAudioContext עם קידומת. עם זאת, גם ב-webkitAudioContext שהוצג מחדש הוסרו כמה שיטות ומאפיינים מדור קודם, כמו createGainNode ו-createJavaScriptNode. בקצרה, ב-Chrome 36, webkitAudioContext ו-AudioContext הם כינויים זה לזה. אין הבדל בפונקציונליות בין השניים.
נפסיק את התמיכה בתחילית לגמרי אחרי Chrome 36, כנראה בעוד כמה גרסאות. נודיע כאן כשהשינוי יהיה קרוב, ונמשיך לפנות למפתחים כדי שיתקנו את האפליקציות שלהם ל-Web Audio.
למה עשינו זאת במקום לחזור להטמעה הקודמת? חלק מהסיבה לכך היא שחששנו לחזור אחורה יותר מדי. כבר הסרנו את ממשקי ה-API האלה, וכתוצאה מכך האפליקציות יכולות לפעול בצורה טובה ב-Firefox, שמעולם לא תמך באובייקט AudioContext עם קידומת (ובצדק!). התמיכה של Firefox ב-Web Audio הושקה בסתיו האחרון.
בהמשך העדכון הזה מפורט מדריך לתיקון בעיות שעשויות להיווצר בקוד עקב השינוי הזה. היתרון הגדול של תיקון הבעיות האלה הוא שסביר להניח שהקוד יפעל גם ב-Firefox. (חשבתי במשך זמן רב שאפליקציית ה-Vocoder שלי לא תקינה בגלל ההטמעה של Firefox, אבל התברר שזו אחת מהבעיות האלה!)
אם אתם רוצים להתחיל לעבוד, כדאי לעיין בספרייה של תיקון 'קוף' שכתבתי לאפליקציות שנכתבו בקוד הקודם של Web Audio. היא יכולה לעזור לכם להתחיל לעבוד בזמן קצר, כי היא תיצור כתובות חלופיות לעצמים ולשיטות בצורה מתאימה. אכן, התיקונים שמפורטים בספרייה הם מדריך טוב לשינויים.
קודם כול
כל הפניות אל window.webkitAudioContext צריכות להפנות אל window.AudioContext במקום זאת. בדרך כלל, הבעיה נפתרה באמצעות:
window.AudioContext = window.AudioContext || window.webkitAudioContext;
אם האפליקציה מגיבה בתשובה כמו "לצערנו, הדפדפן שלך לא תומך ב-Web Audio. יש להשתמש ב-Chrome או ב-Safari", סביר להניח שהיא מחפשת באופן מפורש את webkitAudioContext. מפתח גרוע! יכול להיות שתמכו ב-Firefox כבר חודשים!
אבל יש כמה הסרות קוד נוספות, עדינות יותר, שחלקן עשויות להיות פחות ברורות.
- קבועי הסוג המנויים של BiquadFilter למאפיין
.type(שהפך למחרוזת) לא מופיעים יותר באובייקטBiquadFilterNode, ואין לנו תמיכה בהם במאפיין.type. לכן, כבר לא משתמשים ב-.LOWPASS(או ב-0) – מגדירים אותו כ-'lowpass'. - כמו כן, המאפיין
Oscillator.typeהוא עכשיו מסוג מחרוזת עם ערכים ממוספרים – אין יותר.SAWTOOTH. - עכשיו גם
PannerNode.typeהוא סוג מחרוזת ממוספר. - עכשיו גם
PannerNode.distanceModelהוא סוג מחרוזת ממוספרת. - השם של
createGainNodeהשתנה ל-createGain - השם של
createDelayNodeהשתנה ל-createDelay - השם של
createJavaScriptNodeהשתנה ל-createScriptProcessor - השדה
AudioBufferSourceNode.noteOn()הוחלף עכשיו על ידיstart() - השדה
AudioBufferSourceNode.noteGrainOn()הוחלף עכשיו גם ב-start() - השם של
AudioBufferSourceNode.noteOff()השתנה ל-stop() - השם של
OscillatorNode.noteOn()השתנה ל-start() - השם של
OscillatorNode.noteOff()השתנה ל-stop() - השם של
AudioParam.setTargetValueAtTime()השתנה ל-setTargetAtTime() - השם של
AudioContext.createWaveTable()ו-OscillatorNode.setWaveTable()השתנה ל-createPeriodicWave() andsetPeriodicWave()`. AudioBufferSourceNode.loopingהוסר לטובת.loopAudioContext.createBuffer(ArrayBuffer, boolean)כדי לפענח באופן סינכרוני blob של נתוני אודיו קודדים הוסרה. שימוש בקריאות סינכרוניות שנמשכות זמן רב הוא תרגול תכנות לקוי. במקום זאת, כדאי להשתמש בקריאה האסינכרונית decodeAudioData. זהו אחד מהשינויים המורכבים יותר – צריך לשנות את זרימת הלוגיקה בפועל – אבל זו שיטה טובה בהרבה. Ehsan Angkari מ-Mozilla כתב דוגמה יפה לאופן שבו עושים זאת בפוסט שלו על המרה ל-Web Audio רגיל.
ברור שרבים מהם (כמו שינוי השם של createGainNode והסרת הפענוח הסינכרוני ב-createBuffer) יופיעו במסוף הכלים למפתחים כשגיאה – אבל חלק אחרים, כמו השימוש הזה:
MULTI_LINE_CODE_PLACEHOLDER_1
לא יופיע בכלל וייכשל בשקט (myFilterNode.BANDPASS יפתר עכשיו ל-undefined, והניסיון להגדיר את .type ל-undefined פשוט לא יניב אפקט כלשהו. דרך אגב, זה מה שגרם לקודק הקול להיכשל). באופן דומה, הקצאת filter.type למספר מסוים פעלה בעבר:
myFilterNode.type = 2;
אבל עכשיו צריך להשתמש בספירת המחרוזות:
myFilterNode.type = “bandpass”;
לכן, כדאי לבצע חיפוש grep בקוד שלכם כדי לאתר את המונחים הבאים:
webkitAudioContext.LOWPASS.HIGHPASS.BANDPASS.LOWSHELF.HIGHSHELF.PEAKING.NOTCH.ALLPASS.SINE.SQUARE.SAWTOOTH.TRIANGLE.noteOn.noteGrainOn.noteOff.setWaveTable.createWaveTable.looping.EQUALPOWER.HRTF.LINEAR.INVERSE.EXPONENTIALcreateGainNodecreateDelayNode.type(כן, האפשרות הזו תגרום להרבה תוצאות חיוביות שגויות – אבל זו הדרך היחידה לזהות את הדוגמה האחרונה שלמעלה!)
שוב, אם אתם ממהרים ואתם רוצים להתחיל לעבוד, פשוט תוכלו להוריד עותק של ספריית ה-monkeypatch webkitAudioContext שלי ולכלול אותה באפליקציה. שתהיה לכם עבודה מהנה בפריצה לאודיו!