My aim is to play the mp3 file from the google drive. I am using the plugin MediaElement js. The reference I got is https://www.portalzine.de/dev/html5/hosting-mp3-files-on-google-drive-html5-audio-player/
This is working in chrome, Mozilla firefox but not in IE-11, safari and opera. I want this to be play in all browsers. Please give me the suggestions....
1. URL for the audio file (anyone can view)
https://drive.google.com/file/d/1nQklEicsMeGBnuk0vv6zkHtXtyGy10S-/view?usp=sharing
2. Extract the id from URL
1nQklEicsMeGBnuk0vv6zkHtXtyGy10S-
3. URL for playing the audio file
https://docs.google.com/uc?export=download&id={id}
example:
https://docs.google.com/uc?export=download&id=1nQklEicsMeGBnuk0vv6zkHtXtyGy10S-
4. URL for downloading the audio file
https://drive.google.com/uc?authuser=0&id={id}&export=download
example:
https://drive.google.com/uc?authuser=0&id=1nQklEicsMeGBnuk0vv6zkHtXtyGy10S-&export=download
5. HTML for playing audio:
<audio controls="controls">
<source src="https://docs.google.com/uc?export=download&id={id}">
</audio>
example:
<audio controls="controls">
<source src="https://docs.google.com/uc?export=download&id=1nQklEicsMeGBnuk0vv6zkHtXtyGy10S-">
</audio>
6. HTML for downloading audio:
<a href="https://drive.google.com/uc?authuser=0&id={id}&export=download"/>Download
example:
<a href="https://drive.google.com/uc?authuser=0&id=1nQklEicsMeGBnuk0vv6zkHtXtyGyO9S-&export=download"/>Download
In another thread on another page someone wrote the only solution that has worked for me:
If you share an MP3 by link, you obtain a link like this
https://drive.google.com/file/d/XXXXXXXXXXXXXXXXXX/view?usp=sharing
where XXXXXXXXXXXXXXXXXX is the ID of your MP3 file. Then you can obtain a direct link to this audio by
http://docs.google.com/uc?export=open&id=XXXXXXXXXXXXXXXXXX
In particular you can use
<audio controls>
<source src="http://docs.google.com/uc?export=open&id=XXXXXXXXXXXXXXXXXX" type="audio/mp3">
<p>Your browser does not support HTML5 audio :(</p>
</audio>
The first link is the one you normally get, the other link is what you want to use with
Try to think of this as HTML code:
<audio controls>
<source src="http://docs.google.com/uc?export=open&id=XXXXXXXXXXXXXXXXXX" type="audio/mp3">
</audio>
Make sure you convert that link right and it will work!
I'm using Direct Link Creator plugin of Google Drive and get the link easily. Here's an example.
<audio controls="controls">
<source src="https://docs.google.com/uc?export=download&id=0B_ETxiqrp0SzbF9VQ3JCS2hnSlU">
</audio>
<video controls="controls">
<source src="https://drive.google.com/uc?export=download&id=0B0JMGMGgxp9WMEdWb1hyQUhlOWs" type='video/mp4' />
</video>
I was trying to accomplish this inside the SSML audio tag for Actions on Google. None of the above steps seemed to work. I finally found a solution.
1) Get the file ID from the sharing link
https://drive.google.com/file/d/your_file_id/view?usp=sharing
2) Construct the direct link
http://docs.google.com/uc?export=open&id=your_file_id
3) Paste the direct link into a web browser and hit enter
4) Copy the resulting URL after you have been redirected by your browser
Note: This will be a much longer URL that looks something like this:
https://doc-XX-XX-docs.googleusercontent.com/docs/securesc/XXXXXXXXXXXXXXXXXXXXX/XXXXXXXXXXXXXXXXXXXX/000000000000000/0000000000000000000000/*/your_file_id?e=open
Using this final URL is the only way I could get my uploaded sound files to work with Actions on Google.
Related
I have normal html file in that i add one audio tag with autoplay attribute , when the page loaded sometimes it's playing automatically sometimes it's not playing can you please help me to fix this issue ...
// src link is from google drive
<audio autoplay>
<source id="my_audio" src="https://docs.google.com/uc?export=download&id=11wfYWiukbIZJQnDL385jQs2SGQA5ESbL">
</audio>
Suggestion:
When I tested it on my end, I do not get the same intermittent issue with audio not auto-playing using HTML <audio> autoplay attribute with an audio source that's residing on Google Drive. Also, I have checked the public Google issue tracker and there's no active reports about audio from Google Drive not auto-playing when being used as an audio in an html file.
Perhaps, you can try this implementation from this similar answer:
Recently many browsers can only autoplay with sound off, so you'll need to add muted attribute to the audio tag, that is not make sense, so in my opinion the best way is adding document.getElementById('audio').play(); after your tag. Take a look at this code:
<audio controls loop style="display:none" id="my_audio">
<source src="https://docs.google.com/uc?export=download&id=11wfYWiukbIZJQnDL385jQs2SGQA5ESbL" type="audio/mpeg">
</audio>
<script>
document.getElementById('my_audio').play();
</script>
src and id above were tweaked to your actual code
You may also want to check the answers from How to make audio autoplay on chrome
I am trying to play a song from my Desktop. This is what I have so far...
<audio src="Desktop/Moves.mp3" controls>
<p>Fallback content goes here.</p>
</audio>
I feel like something is wrong with the src but I am not sure what else to put.
First of all, the desktop is not a good place to put ANY file that you want to use in a website. Better put it in a subdirectory of the directory where your webpage is situated. So if your HTML page is in a folder named website, put the audio file in a folder inside that website folder, for example audio.
Second, it depends on the browser which audio file types it can handle. It's good to provide at least two formats, mp3 and ogg. Those two cover pretty much all browsers. Audacity can convert mp3 to ogg - it's free, you can find it via the search engine of your choice.
If you have those two files (i.e. the same piece of music, but two different filetypes), the code would for example look like this:
<audio controls>
<source src="audio/Moves.ogg" type="audio/ogg">
<source src="audio/Moves.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio>
try this:
<audio loop="loop" autoplay="autoplay">
<source src="Desktop/Moves.mp3" type="audio/mpeg" />
</audio>
I am a newbe in HTML and I want to embed an audio player which plays an mp3 file from a link from dropbox. I took a sample code from here however, is doesn't work. It opens a player but doesn't play. This is the relevant part of the code:
<audio controls>
<source src="https://www.dropbox.com/s/8besx3yh043u4qn/TestFile.mp3?dl=0" type="audio/mpeg">
</audio>
You point to the wrong source. This link actually points to a html file whose name is rewritten by the web server software. (If I follow this link, a file that starts with <!DOCTYPE html> is opened, that is an indicator that this file is an HTML-website)
If you do a right-click on the player and select to examine the element you'll find the real link to this file under the preview-auto_container element.
So the audio element of your file needs to look like:
<audio>
<source src="https://dl.dropboxusercontent.com/content_link/KRfRP3OWPuNXyfpYKUjCQOUzNIoE6o66TvxCHu6xKh5fErZ22kJHCOCvJ0TeCccu/file?dl=0&duc_id=dropbox_duc_id" type="audio/mpeg">
</audio>
I need your help.
I want to put a link of the music into the audio tag and it seems like this:
<audio controls autoplay>
<source src="http://www.boxca.com/lctj4xdqkhjr/Evgeny_Grinko_-_Вальс_.mp3.html" type="audio/mpeg">
<source src="http://pressplayaudio.com/?artist=Evgeny-Grinko&track=Field.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>
But, it doesn't work and I don't know what's the problem.
you're trying to link an html website with some audio player on it, instead of referencing real audio files. This wont work.
You need to provide a reference to a physical file that you host somewhere
I am trying to embed a html5 audio tag in my web page here is the code.
<audio controls>
<source src="http://thearabiclab.com/wp-content/uploads/2015/07/arabic-word-meeting.ogg" type="audio/ogg">
<source src="http://thearabiclab.com/wp-content/uploads/2015/07/arabic-word-meeting.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
path of both the files mp3 and ogg are correct, the issue is when the page loads first time it will display the player correctly but suddenly it will transform into something like the image below.
https://www.dropbox.com/s/xkjrql4vzr3pkrh/Screenshot%202015-07-05%2015.12.56.png?dl=0
Please help to resolve this issue.
thanks
You mentioned code working fine for me..
What you can do to debug it first make a separate HTML file copy and paste the code, check if it working or not. It's looking sure... some conflict with your Js or jQuery.