حتى الآن، لم يكن من الممكن ضبط جهاز إخراج الصوت الوجهة إلا لأجهزة <video> و<audio> باستخدام HTMLMediaElement.setSinkId(). في Web Audio، كان AudioContext يستخدم الجهاز التلقائي، ما يترك للمستخدم إمكانية تغيير جهاز إخراج صوت النظام يدويًا.
اعتبارًا من الإصدار 110 من Chrome، يمكنك استخدام AudioContext.setSinkId() لتوجيه إخراج الصوت في Web Audio آليًا إلى أي جهاز مسموح به.
ويُعدّ ذلك مفيدًا بشكل خاص في مجموعة متنوعة من سيناريوهات التواصل في الوقت الفعلي. على سبيل المثال، يمكن لتطبيق الويب استخدام هذا الإجراء لتوجيه الإخراج آليًا إلى جهاز إخراج صوت معيّن، مثل سماعة رأس بلوتوث أو مكبّر صوت.
توجيه إخراج الصوت إلى جهاز معيّن
أولاً، تحتاج إلى معرّف جهاز إخراج الصوت الذي تريد استخدامه كوجهة. يمكنك الحصول على قائمة بأجهزة الوسائط المتاحة باستخدام navigator.mediaDevices.enumerateDevices()، والفلترة حسب أجهزة إخراج الصوت فقط، والحصول على سمة deviceId لجهاز إخراج الصوت الذي تختاره. يمكن أيضًا استخدام القيمة الفارغة "" كجهاز تلقائي لـ deviceId.
بعد الحصول على معرّف جهاز إخراج الصوت، أنشئ AudioContext واتصل برقم audioContext.setSinkId(deviceId). عند نجاح العملية، يتم حلّ الوعد الذي تم إرجاعه عند توجيه الصوت إلى جهاز الإخراج المتصل الذي تم اختياره. يمكن أن يتعذّر إكمالها إذا كان سياق الصوت مغلقًا.
يوضّح لك المثال أدناه كيفية طلب الوصول إلى الميكروفون إذا لزم الأمر وتوجيه إخراج الصوت في 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() في الإصدار 110 من Chrome أو الإصدارات الأحدث.
ملاحظات
يريد فريق Chrome ومجتمع معايير الويب معرفة تجاربك مع AudioContext.setSinkId(). يُرجى تقديم الملاحظات من خلال التعليق على مشاكل GitHub الحالية أو الإبلاغ عن مشاكل جديدة.
روابط مفيدة
- مواصفات WebAudio
- مراجعة علامة Google
- العرض التوضيحي | مصدر العرض التوضيحي
- خطأ في Chromium
- إدخال ChromeStatus.com
الشكر والتقدير
نشكر Hongchan Choi وMichael Wilson على مراجعة هذه المقالة.
صورة التقويم من تصوير Steve Harvey على Unsplash.