Thay đổi về âm thanh trên web
Tại Google, chúng tôi yêu thích các tiêu chuẩn. Chúng tôi thực hiện sứ mệnh xây dựng nền tảng Web được xác định theo các tiêu chuẩn. Một trong những vấn đề nhỏ về vấn đề đó trong một thời gian là việc triển khai Web Audio API có tiền tố webkit (đặc biệt là đối tượng webkitAudioContext) và một số đoạn âm thanh trên web không dùng nữa mà chúng tôi vẫn tiếp tục hỗ trợ.
Theo dự định ban đầu, Chrome 36 sẽ ngừng hỗ trợ webkitAudioContext có tiền tố, vì chúng tôi đã bắt đầu hỗ trợ đối tượng AudioContext chưa có tiền tố. Điều này hoá ra lại rắc rối hơn dự kiến, vì vậy Chrome 36 hỗ trợ cả hai loại tiền tố và tiền tố – tuy nhiên, ngay cả trong webkitAudioContext được giới thiệu lại, một số phương thức và thuộc tính cũ như createGainNode và createJavaScriptNode đã bị xoá. Tóm lại, trong Chrome 36, webkitAudioContext và AudioContext là bí danh của nhau; không có sự khác biệt về chức năng giữa hai bí danh.
Chúng tôi sẽ ngừng hỗ trợ hoàn toàn tiền tố này sau Chrome 36, có thể trong một vài bản phát hành. Chúng tôi sẽ thông báo tại đây khi thay đổi này sắp xảy ra, đồng thời sẽ tiếp tục liên hệ với các tác giả để khắc phục lỗi ứng dụng Web Audio của họ.
Tại sao chúng tôi thực hiện việc này thay vì hoàn nguyên về cách triển khai trước đó? Chà, một phần, chúng tôi đã kiên quyết lùi lại quá nhiều; chúng tôi đã loại bỏ các API đó và như một hiệu ứng phụ tuyệt vời cho hiện tượng răng cưa này, các ứng dụng sau đó có thể hoạt động tốt trên Firefox, vốn chưa bao giờ hỗ trợ đối tượng AudioContext có tiền tố (và cũng khá đúng!) trong hỗ trợ Web Audio ban đầu được phát hành vào mùa thu năm ngoái.
Phần còn lại của bản cập nhật này sẽ hướng dẫn cách khắc phục những vấn đề có thể bị hỏng trong mã do thay đổi này. Điều tuyệt vời khi khắc phục những vấn đề này là mã của bạn có thể cũng hoạt động tốt trong Firefox! (Tôi đã nghĩ rất lâu rằng ứng dụng Vocoder của mình đã bị hỏng do quá trình triển khai của Firefox, nhưng hoá ra đó là một trong những vấn đề này!)
Nếu chỉ muốn thiết lập và chạy ứng dụng, bạn nên xem thư viện monkey-patch mà tôi đã viết cho các ứng dụng được viết bằng mã Web Audio cũ. Thư viện này có thể giúp bạn thiết lập và chạy trong khoảng thời gian tối thiểu, vì thư viện này sẽ tạo bí danh cho các đối tượng và phương thức. Thực sự, các bản vá mà thư viện liệt kê là một chỉ dẫn hữu ích về những nội dung đã thay đổi.
Đầu tiên và quan trọng nhất
Mọi tham chiếu đến window.webkitAudioContext nên được chuyển đến window.AudioContext. Thông thường, lỗi này đã được khắc phục bằng một:
window.AudioContext = window.AudioContext || window.webkitAudioContext;
Nếu ứng dụng của bạn phản hồi bằng nội dung như “Rất tiếc, trình duyệt của bạn không hỗ trợ Web âm thanh. Vui lòng sử dụng Chrome hoặc Safari.” – khả năng cao là ứng dụng này đang tìm kiếm webkitAudioContext một cách rõ ràng. Nhà phát triển tệ! Lẽ ra bạn đã có thể hỗ trợ Firefox trong nhiều tháng!
Tuy nhiên, vẫn còn một vài trường hợp xoá mã khác tinh tế hơn, có thể khó nhận ra hơn.
- Hằng số kiểu được liệt kê trong BiquadFilter cho thuộc tính
.type(hiện là một chuỗi) không còn xuất hiện trên đối tượngBiquadFilterNodevà chúng tôi không hỗ trợ các hằng số đó trên thuộc tính.type. Vì vậy, bạn không sử dụng.LOWPASS(hoặc 0) nữa – bạn đặt giá trị này thành “thấp thông”. - Ngoài ra, thuộc tính
Oscillator.typecũng tương tự như kiểu được liệt kê dưới dạng chuỗi – không còn là.SAWTOOTHnữa. PannerNode.typehiện cũng là một kiểu được liệt kê dạng chuỗi.PannerNode.distanceModelhiện cũng là một kiểu được liệt kê dạng chuỗi.createGainNodeđã được đổi tên thànhcreateGain.createDelayNodeđã được đổi tên thànhcreateDelay.createJavaScriptNodeđã được đổi tên thànhcreateScriptProcessor.AudioBufferSourceNode.noteOn()hiện được thay thế bằngstart()AudioBufferSourceNode.noteGrainOn()hiện cũng được thay thế bằngstart()AudioBufferSourceNode.noteOff()được đổi tên thànhstop().OscillatorNode.noteOn()được đổi tên thànhstart().OscillatorNode.noteOff()được đổi tên thànhstop().AudioParam.setTargetValueAtTime()được đổi tên thànhsetTargetAtTime().AudioContext.createWaveTable()vàOscillatorNode.setWaveTable()hiện được đổi tên thànhcreatePeriodicWave() andsetPeriodicWave()”.AudioBufferSourceNode.loopingđã bị xoá, thay vào đó là.loopAudioContext.createBuffer(ArrayBuffer, boolean)để giải mã đồng bộ một blob dữ liệu âm thanh được mã hoá đã bị xoá. Các lệnh gọi đồng bộ mất nhiều thời gian để hoàn tất là phương pháp lập trình kém; thay vào đó, hãy sử dụng lệnh gọi filterAudioData không đồng bộ. Đây là một trong những thay đổi khó khăn hơn – bạn cần phải thực sự thay đổi luồng logic – nhưng là một phương pháp hay hơn nhiều. Ehsan Angkari của Mozilla đã viết một ví dụ hay về cách thực hiện việc này trong bài đăng về việc chuyển đổi sang âm thanh web tiêu chuẩn.
Nhiều lỗi trong số này (như đổi tên createGainNode và xoá bộ giải mã đồng bộ trong createBuffer) rõ ràng sẽ hiển thị lỗi trong bảng điều khiển công cụ dành cho nhà phát triển. Tuy nhiên, một số lỗi khác ví dụ như cách sử dụng này:
MULTI_LINE_CODE_PLACEHOLDER_1
sẽ hoàn toàn không hiển thị và tự động không thành công (myFilterNode.BANDPASS bây giờ sẽ chuyển thành không xác định và việc cố gắng đặt .type thành không xác định sẽ đơn giản là không tạo ra bất kỳ hiệu quả nào. Nhân tiện, đây chính là nguyên nhân khiến trình mã hoá bị lỗi.) Tương tự, chỉ cần gán filter.type cho một số dùng để làm việc:
myFilterNode.type = 2;
Nhưng giờ đây, bạn cần sử dụng bảng liệt kê chuỗi:
myFilterNode.type = “bandpass”;
Vì vậy, bạn có thể muốn grep mã của mình cho các cụm từ sau:
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(đúng vậy, trường hợp này sẽ có nhiều kết quả dương tính giả, nhưng đó là cách duy nhất để xem ví dụ cuối cùng ở trên!)
Một lần nữa, nếu bạn đang vội và muốn thiết lập và chạy, chỉ cần lấy bản sao thư viện monkeypatch webkitAudioContext của tôi và đưa vào ứng dụng của bạn. Chúc mừng việc xâm nhập âm thanh thành công!