Wayne Barron
asked on
Cannot read property 'addEventListener' of undefined --- navigator.serviceWorker.register('worker.js')
I am trying to get a javascript to work, however. It is giving me some issues.
The demo of the working script from the author is here.
https://toohotradio.net/metadata/
I am using the same code he has on his demo page.
I downloaded the worker.js and have it stored in my JS folder.
So it looks like this in the code.
Here is the script from the link above.
I've gone through his code and replaced every section with his domain, to point to mine.
This is the source link for the javascript function.
Source Code for Javascript
Can someone please assist me in getting this working?
Thank you.
Wayne
The demo of the working script from the author is here.
https://toohotradio.net/metadata/
I am using the same code he has on his demo page.
I downloaded the worker.js and have it stored in my JS folder.
So it looks like this in the code.
if ('serviceWorker' in navigator) { var iceworker = navigator.serviceWorker.register('worker.js')
//I get this error in Google Chrome
Uncaught TypeError: Cannot read property 'addEventListener' of undefined
//For this line.
navigator.serviceWorker.addEventListener('message', event => {
Here is the script from the link above.
<audio preload="none" id="aud" controls src="https://toohotradio.net/metadata/icy/" type="audio/mpeg">
</audio>
<div></div>
<ul>
</ul>
<script>
if ('serviceWorker' in navigator) {
var iceworker = navigator.serviceWorker.register('metadataworker.js')
.then(function(reg) {
console.log('Icecast service worker registered');
addItem('Icecast service worker registered. Click play to start the stream.');
}).catch(function(error) {
console.warn('Error ' + error);
addItem('Error ' + error);
});
}
var delay = 8000;
navigator.serviceWorker.addEventListener('message', event => {
if(event.origin != 'https://toohotradio.net'){
return;
}
setTimeout(function(){
document.querySelector('div').innerText = event.data.msg.substring(event.data.msg.indexOf("'") + 1,event.data.msg.lastIndexOf("'"));
},delay);
console.log(event.data.msg);
addItem('Message from service worker ' + event.data.msg);
});
document.querySelector('audio').addEventListener('play', event => {
performance.mark('play');
addItem("Measuring buffering time...");
})
document.querySelector('audio').addEventListener('playing', event => {
performance.mark('playing');
performance.measure('delay','play','playing');
var measures = performance.getEntriesByName("delay");
delay = measures[0].duration;
addItem("Buffering took " + (delay/1000).toFixed(2) + " seconds");
addItem("Setting metadata update delay to " + (delay/1000).toFixed(2) + " seconds");
})
document.querySelector('audio').addEventListener('pause', event => {
navigator.serviceWorker.controller.postMessage('message');
document.querySelector('audio').src = document.querySelector('audio').src;
})
function addItem(text) {
var node = document.createElement("li");
var textnode = document.createTextNode(text);
node.appendChild(textnode);
document.querySelector('ul').appendChild(node);
}
</script>
I've gone through his code and replaced every section with his domain, to point to mine.
This is the source link for the javascript function.
Source Code for Javascript
Can someone please assist me in getting this working?
Thank you.
Wayne
since he is using icecast why not go to the source https://icecast.org/
ASKER
I am using Icecast as well.
All my information is nearly identical to his.
I've posted the issue to GitHub about the issue, but he has not responded.
I have this topic on another board as well, and a user had me to move the
Getting close to it.
All my information is nearly identical to his.
I've posted the issue to GitHub about the issue, but he has not responded.
I have this topic on another board as well, and a user had me to move the
navigator.serviceWorker.addEventListener('message', event => {
Into theif ('serviceWorker' in navigator) {
I now get.Measuring buffering time...
Buffering took 6.36 seconds
Setting metadata update delay to 6.36 seconds
But nothing else is showing, no data for the music files.Getting close to it.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.