Audio Player Files not loading online but works locally

Question

Hi ive done a project for university of creating a web application. I added in an audioplayer, and it worked perfectly fine locally, but when I added it to my web app online i get the error:

GET https://mitul106.000webhostapp.com/app5/public_html/app5/components/G-Eazy%…20Kehlani%20-%20Good%20Life.mp3/G-Eazy%20&%20Kehlani%20-%20Good%20Life.mp3 404 () 
Uncaught (in promise) DOMException: Failed to load because no supported source was found.  music:1

The directory path is correct im not too sure what else the issue could be. If you need any more of me feel free to ask and thankyou in advance! :)

@Mitul Suchak I think it has file name or path issue, because file name has containing blank space and adding the `%20-%20` try with the correct file name. — mageDev0688, Apr 19 '17 at 12:19
Ive changed the path, removed all spaces, and at the moment am only working with one song to see if i can get it to work all other pages are accessible online yes. — Mitul Suchak, Apr 19 '17 at 12:29

score 1 · Answer 1 · answered Apr 19 '17 at 12:15

1

You need to remove all spaces from the file names and replace then with underscores (_) for working with them on the web.

So if your mp3 file is Teri Meri Kahani.mp3 rename it to teri_meri_kahani.mp3 .

Also remove spaces from all the directories if any in which you store songs online.

answered Apr 19 '17 at 12:15

Shakti Phartiyal

6,156
3
25
46

removed all spaces and any online directories have an underscore, still doesnt work – Mitul Suchak Apr 19 '17 at 12:29

score 0 · Answer 2 · answered Apr 19 '17 at 12:19

0

Spaces are not supported in file/directory names when using them in websites.

So just remove the spaces or replace them by a underscore(_)

I hope I can help:)

answered Apr 19 '17 at 12:19

Marco

517
6
19

removing spaces didnt help – Mitul Suchak Apr 19 '17 at 12:29

score 0 · Accepted Answer · edited May 23 '17 at 12:18

0

As per standards, src attribute should contain a valid URL. Since space characters are not allowed in URLs, you have to encode them.

You can write:

src="Sound%20Awesome.mp3"

but NOT

src="My-Sound%20Awesome.mp3"

Check your Sound File name - It has "-" in it.

Path to the audio file is not correct in your case. Try changing it to:

https://mitul106.000webhostapp.com/GoodLife.mp3

edited May 23 '17 at 12:18

Community

1
1

answered Apr 19 '17 at 12:21

Satish Saini

2,880
3
24
38

Do you have an online URL where I can check it? – Satish Saini Apr 19 '17 at 12:32
Ok, so there is an issue with accessing the mp3 file. When I open https://mitul106.000webhostapp.com/public_html/app5/components/GoodLife.mp3 it gives 404 error. So, please check the folder and path where you have all mp3 files. – Satish Saini Apr 19 '17 at 12:40
but the path is correct, and all the other files in there load so where would my issue lie? – Mitul Suchak Apr 19 '17 at 12:43
@MitulSuchak Try changing your path to: https://mitul106.000webhostapp.com/GoodLife.mp3 because I can see all files in main directory if I look at this URL: https://mitul106.000webhostapp.com/ – Satish Saini Apr 19 '17 at 13:17
Oh myyy, sorry for wasting your time on something so simple, I was being stupid aha. Thankyou so much works! – Mitul Suchak Apr 19 '17 at 14:23
@Mitul would you mind clicking up arrow to appreciate my time? ;) – Satish Saini Apr 20 '17 at 03:35

Audio Player Files not loading online but works locally

3 Answers3