<audio> tag with mp3 on Gdrive

#1

I am looking to include the tag in my tiddlers, with url_mp3 pointing to an MP3 file stored on Google Drive.
I have searched the site but haven’t found a solution.
Thank you for your help.

#2

I’m not sure whether your question is about tags, or about getting a url to play audio, or something else… :face_with_monocle:

It’s simple enough to put a tag on tiddlers that include a url_mp3 field, so perhaps your question is about connecting to audio files on google drive?

Alas, I suspect that google drive is not supporting true embedding: Images from Google drive in embedded HTML no longer working - Sites Community

The closest I could get to a direct connection is an iframe, like so:

<iframe src="https://drive.google.com/file/d/1ZUIDlUEaGJF-nE71uyvTa3XaI25aZFxe/preview" allowfullscreen=""></iframe>

… where between file/d/ and /preview the id of an google audio file is inserted (which I will delete shortly from google drive, since it’s not public domain, and was just uploaded for test purposes).

Please reply, and explain more directly: what are you trying to do?

#3

Hi, yes it’s about playing easiliy MP3 on my tiddler. To clarify :

This code works perfectly fine on tiddler :

<audio controls>
    <source src="C:\Users\toto\reckoner.mp3"  type="audio/mpeg">
</audio>

It gives this :

image
image1367×303 11.2 KB

Then, I would like to know if it’s possible to have src pointing on a gdrive’s URL, avoiding local storage.

FYI, I uses an extra macro that displays image stored on gdrive. This code :

<<gimg 'https://drive.google.com/file/d/1x3htnb21XT0LxK8JEw_x/view?usp=drivesdk' 2100>>

displays the image on the tiddler.

1 Like
#4

Ah, that sweet little macro is from @twMat who cooked it up last year here: Images — Every way to use images in TiddlyWiki.

I don’t see anything at that site that would cross over to audio, but you might to look more closely.

And maybe @twMat is in earshot, and could give you a tip on how to do something similar for audio files?

1 Like
#5

File storage services like GDrive do not generally expose a direct, public HTTPS address for a raw MP3, image or video file. The server providers don’t like “hot linking” because (a) it costs them money with no benefit to their business and (b) they are liable for the legality of the content.

One workaround is to use Amazon’s S3 service, Google Storage, or Microsoft’s Azure Blob Storage. These are all lower level file storage solutions aimed at software developers, and a good deal harder to use than the user facing services. However, they do provide direct access to files (and they charge a modest amount of cash for it), and you can get front end applications that make these services easier to use.

3 Likes
#6

OK, so I just tested around to enable playing Drive hosted audio files but no great solution. I did find the following:

It seems Google changed the UI in January. Here’s a thread commenting on this. It also provides this solution:

<audio controls="controls"> 
    <source src="https://www.googleapis.com/drive/v3/files/{FILE_ID}?alt=media&key={API_KEY}" 
            type="audio/mp3">
 </audio>

…unfortunately it requires an API key which, in my limited experience, is trickier to produce.

As noted, you can also iframe it; if you click on the audio file inside Drive, it opens the UI player …where you click the three dots in the menu and select Open in new window …which seems to open the exact say little UI player… where you again click the three dots and then the Embed item where you access the iframe code. Totally annoying.

A third route is an external serviced like the following that is specialized to solve exactly these types of Drive issues: https://lienuc.com/ - unsurprisingly it costs money.

P.S @Springer - I’m really impressed that you remembered and recognize that I created that macro!

2 Likes