How to play music from local folder in html audio control?

Question

Here is the audio control. When I put the path in browser nothing is showing.

    <audio  controls="controls">
        <source src="E:/Songs/ROCK ON2/Rock On 2/You Know What I Mean(Mr-Jatt.com).mp3" />
    </audio>

score 0 · Answer 1 · answered Oct 27 '17 at 16:43

0

You will need to url encode your file path. It doesn't know what to do with the spaces in your file name. So either encode it or remove all the spaces from every part of that path.

answered Oct 27 '17 at 16:43

jmargolisvt

5,722
4
29
46

If I remove the spaces from the path, the path will be changed. – Swadesh Oct 27 '17 at 16:47
Well, yes. That's exactly what I'm saying here. You need to conform that path somehow, either by hand or using `encodeURI`. – jmargolisvt Oct 27 '17 at 16:50
I have given src="E:/Lean On-(Mr-Jatt.com).mp3" which is the correct path.But still it is unable to play the song. And how to use encodeURI?? – Swadesh Oct 27 '17 at 16:52
Check the link in my answer. – jmargolisvt Oct 27 '17 at 16:53

guest271314 · Answer 2 · 2017-10-27T16:55:35.667

0

If you are trying to play local files you can use <input type="file"> to get file as a File object and create a Blob URL of file to set at .src of <audio> element at change event of <input type="file"> element.

<input type="file">
<audio controls></audio>
<script>
var input = document.querySelector("input[type=file]");
var audio = document.querySelector("audio");
input.onchange = function() {
  audio.src = URL.createObjectURL(input.files[0]);
}
</script>

edited Oct 27 '17 at 16:55

answered Oct 27 '17 at 16:51

guest271314

1
15
104
177

Actually I have a list of songs with full path.So I want that when I will click on any song the audio control should play the song. – Swadesh Oct 27 '17 at 16:54
At which browser are you trying code? – guest271314 Oct 27 '17 at 16:56
You are not getting my point. I don't want to select a file through fileupload.I want to play directly. – Swadesh Oct 27 '17 at 16:59
@Swadesh _"You are not getting my point."_ You did not answer the question at previous comment. At which browser are you trying code? – guest271314 Oct 27 '17 at 17:01
I am using Google Chrome. – Swadesh Oct 27 '17 at 17:01
See [Read local XML with JS](https://stackoverflow.com/questions/41279589/read-local-xml-with-js/) – guest271314 Oct 27 '17 at 17:02

How to play music from local folder in html audio control?

2 Answers2