Media session Feature ใหม่ที่จะช่วยให้ทำให้เว็บของคุณแปลงร่างเป็น App ฟังเพลงได้

ตั้งแต่ Chrome version 57 บน android เป็นต้นมา หากในหน้าเว็บไซต์ของคุณมีวิดิโอหรือเพลงถูกเล่นอยู่ แต่ browser ถูกปิดลง จะเห็นได้ว่า วิดิโอหรือเพลงนั้นยังจะเล่นต่อไป แล้วคุณก็สามารถควบคุมมันได้ผ่าน notification bar ของมือถือ ได้ หน้าตาประมาณนี้

ถ้าเขียนมาเพื่อบอกแค่นี้ก็คงแปลกอยู่เพราะจริงๆแล้ว เราสามารถ customize เจ้าแถบที่โชว์ บน notification ได้ โดยที่เราสามารถปรับได้หลายส่วนมากตามภาพนี้

ซึ่งวิธีง่ายมากๆคือ เราแค่เพิ่ม code แบบนี้เข้าไปในเว็บของเรา

https://gist.github.com/thangman22/a2f72017f104b539c96ad989bdd030a7

ซึ่งในตรงส่วนของ setActionHandler เรายังสามารถทำให้ตัว video เปลี่ยน track ไปมาด้วยการ set src ใหม่กับ element video ได้ด้วย ประมาณนี้

navigator.mediaSession.setActionHandler(‘nexttrack’, function() {
   let audio = document.querySelector(‘audio’);
   audio.src = ‘newsource/path’
});

โดยสรุปเลยคือ Feature นี้เหมาะมากกับใครที่ทำเว็บ podcast หรือ ใครกำลังทำ app ฟังเพลง ( ถูกกฏหมายบน platform เว็บ ก็ลองไปเล่นกันดูนะครับ)