เปิดใช้อินพุตเสียงบนเว็บแบบสดแล้ว

Chris Wilson
Chris Wilson

เราตื่นเต้นมากกับฟีเจอร์ใหม่ที่เพิ่มลงในบิลด์ Chrome Canary เมื่อวานนี้ (23.0.1270.0) ซึ่งก็คือความสามารถในการเข้าถึงเสียงสดจากไมโครโฟนหรืออินพุตเสียงอื่นๆ ใน OSX ที่มีเวลาในการตอบสนองต่ำ (ฟีเจอร์นี้ยังไม่พร้อมใช้งานใน Windows แต่ไม่ต้องกังวล เรากำลังดำเนินการอยู่)

หากต้องการเปิดใช้ฟีเจอร์นี้ คุณต้องไปที่ chrome://flags/ แล้วเปิดใช้รายการ "อินพุตเสียงบนเว็บ" ที่อยู่ใกล้กับด้านล่าง จากนั้นเปิดเบราว์เซอร์อีกครั้ง คุณก็พร้อมใช้งาน

คุณสามารถทดสอบอินพุตเสียงแบบสดได้โดยดูสเปกตรัมของอินพุตโดยใช้โปรแกรมแสดงภาพอินพุตแบบสด

สำหรับโปรแกรมเมอร์ Web Audio ทั้งหลาย ต่อไปนี้คือวิธีขอสตรีมอินพุตเสียงและรับโหนดเพื่อเชื่อมต่อกับกราฟการประมวลผลที่ต้องการ

// success callback when requesting audio input stream
function gotStream(stream) {
    window.AudioContext = window.AudioContext || window.webkitAudioContext;
    var audioContext = new AudioContext();

    // Create an AudioNode from the stream.
    var mediaStreamSource = audioContext.createMediaStreamSource( stream );

    // Connect it to the destination to hear yourself (or any other node for processing!)
    mediaStreamSource.connect( audioContext.destination );
}

navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
navigator.getUserMedia( {audio:true}, gotStream );

อินพุตเสียงที่มีเวลาในการตอบสนองต่ำมีหลากหลายรูปแบบ โดยเฉพาะอย่างยิ่งในด้านดนตรี คุณดูตัวอย่างวิธีใช้ประโยชน์จากโมเดลนี้ได้ในเครื่องตรวจระดับเสียงแบบง่ายที่เราประกอบขึ้นมา ลองเสียบกีตาร์ หรือแม้แต่แค่ผิวปากใส่ไมโครโฟน

และตามที่ได้สัญญาไว้ เราได้เพิ่มเสียงสดเป็นแหล่งข้อมูลอินพุตใน Vocoder ที่เราเขียนขึ้นสำหรับ Google IO แล้ว เพียงเลือก "อินพุตสด" ในส่วน Modulator คุณอาจต้องปรับค่าเกนโมดูเลเตอร์และระดับซินธ์ เกิดความล่าช้าเล็กน้อยเนื่องจากการประมวลผล (ไม่ใช่ความล่าช้าในการป้อนข้อมูล) ตอนนี้ฉันมีอินพุตเสียงแบบสดแล้ว ถึงเวลาปรับแต่งกันอีกรอบ

สุดท้ายนี้ คุณอาจต้องดูคอลเล็กชันเดโมเสียงบนเว็บของฉันด้วย เมื่อคุณอ่านข้อความนี้ เราอาจเพิ่มเดโมเสียงแบบสดอีก