Skip to content

getting error while trying to play Audio from URL in chrome extension

I tried many ways to play a sound from the URL but it isn’t working.

When I inspected the page have errors console:

chrome-extension://invalid/:1 GET chrome-extension://invalid/ net::ERR_FAILED

Uncaught (in promise) DOMException: Failed to load because no supported source was found.

manifest.json:

"options_page": "./html/content.html",
"permissions": [
    "activeTab",
    "storage",
    "contextMenus",
    "http://*/*",
    "https://*/*",
    "tabs"
],
"web_accessible_resources": [
    "*.mp3",
    "*.ogg"
]

I’m doing this in options_page that is content.html. I have also given ‘web_accessible_resources’ permission to the script, but still no success. All the audio links are stored in chrome storage.

Script that’s attached in content.html:

document.addEventListener('click', function (e) { 
e.preventDefault();
if (e.target.matches('.audioBtn')) {   
    chrome.storage.local.get({ meanifyWords: [] }, (result) => { 
        let getWordsObj = result.meanifyWords;
        let getAudio = getWordsObj[e.target.id].audio;  //getAudio="//ssl.gstatic.com/dictionary/static/sounds/20200429/experience--_gb_1.8.mp3"
        let sound = new Audio(getAudio);
        sound.play();
    })
}
});

Please point me to any changes in the above code that will solve this problem. Thanks in advance.

Answer

Add schema to URL:

let getAudio = "https:" + getWordsObj[e.target.id].audio;