שינוי התקן הפלט של היעד ב-Web Audio

François Beaufort
François Beaufort

עד עכשיו, אפשר היה להגדיר את מכשיר פלט האודיו של היעד רק ב-<video> וב-<audio> באמצעות HTMLMediaElement.setSinkId(). ב-Web Audio, ה-AudioContext השתמש במכשיר ברירת המחדל, והמשתמש היה צריך לשנות את המכשיר להשמעת האודיו במערכת באופן ידני.

החל מגרסה 110 של Chrome, אפשר להשתמש ב-AudioContext.setSinkId() כדי לנתב באופן פרוגרמטי את פלט האודיו ב-Web Audio לכל מכשיר מורשה.

האפשרות הזו שימושית במיוחד במגוון תרחישים של תקשורת בזמן אמת. לדוגמה, אפליקציית אינטרנט יכולה להשתמש באפשרות הזו כדי להפנות את הפלט באופן פרוגרמטי למכשיר ספציפי להצגת מידע של אודיו, כמו אוזניות Bluetooth או דיבורית.

ניתוב פלט האודיו למכשיר ספציפי

קודם כול, צריך את המזהה של מכשיר פלט האודיו שבו רוצים להשתמש כיעד. מקבלים את רשימת מכשירי המדיה הזמינים באמצעות navigator.mediaDevices.enumerateDevices(), מסננים לפי מכשירי פלט אודיו בלבד ומקבלים את המאפיין deviceId של מכשיר פלט האודיו שבחרתם. אפשר להשתמש גם במחרוזת הריקה "" כמכשיר ברירת המחדל של deviceId.

אחרי שמקבלים את המזהה של מכשיר הפלט של האודיו, יוצרים AudioContext ומפעילים את audioContext.setSinkId(deviceId). אם הפעולה מסתיימת בהצלחה, ההבטחה שמוחזרת מתבטלת כשהאודיו מנותב להתקן הפלט המחובר שנבחר. הפונקציה עלולה להיכשל אם ה-AudioContext סגור.

בדוגמה הבאה מוסבר איך לבקש גישה למיקרופון במקרה הצורך ולהפנות את פלט האודיו ב-Web Audio למכשיר הפלט הראשון שזמין.

const permission = await navigator.permissions.query({ name: "microphone" });
if (permission.state == "prompt") {
  // More audio outputs are available when user grants access to the mic.
  const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
  stream.getTracks().forEach((track) => track.stop());
}

// Request a list of media devices and filter audio output devices.
const devices = await navigator.mediaDevices.enumerateDevices();
const audioOutputs = devices.filter(device => device.kind == "audiooutput");

const audioContext = new AudioContext();

// Pick the first available audio output.
const deviceId = audioOutputs[0].deviceId;
await audioContext.setSinkId(deviceId);

שימו לב שאפשר גם להעביר את deviceId כפרמטר sinkId כשיוצרים AudioContext.

const audioContext = new AudioContext({ sinkId: deviceId });

עיבוד אודיו עם AudioContext מושתק

עכשיו אפשר לציין 'מכשיר פלט שקט' ב-Web Audio כדי לצמצם את צריכת החשמל. הפעם, במקום ערך מחרוזת, מעבירים את { type: "none" } אל AudioContext.setSinkId().

חשוב לדעת ששעון האודיו שאפשר לגשת אליו דרך audioContext.currentTime עדיין ימשיך להתקדם כדי להציג את תרשים האודיו. המטרה העיקרית של AudioContext המושתק הזה היא ליצור את גרף האודיו בלי ליצור צליל שניתן לשמוע. תרחיש לדוגמה: ניתוח קלט מהמיקרופון בלי להפיק צלילים.

// Silent Web Audio output.
await audioContext.setSinkId({ type: "none" });

זיהוי תכונות

כדי לבדוק אם יש תמיכה ב-AudioContext.setSinkId(), משתמשים ב-:

if ("setSinkId" in AudioContext.prototype) {
  // AudioContext.setSinkId() is supported.
}

דוגמה

דמו זמין בכתובת https://sinkid.glitch.me/ כדי לשחק עם AudioContext.setSinkId().

תמיכה בדפדפנים

AudioContext.setSinkId() זמין ב-Chrome בגרסה 110 ואילך.

משוב

צוות Chrome וקהילת תקני האינטרנט רוצים לשמוע על החוויה שלכם עם AudioContext.setSinkId(). אפשר לשלוח משוב על ידי הוספת תגובה לבעיות קיימות ב-GitHub או דיווח על בעיות חדשות.

תודות

תודה לHongchan Choi ולMichael Wilson על בדיקת המאמר.

תמונת הרקע של יומן Google היא צילום של Steve Harvey ב-Unsplash.