Apps Scriptリファレンス: Apps Script Reference |障害・課題追跡: IssueTracker |Google Workspace: Status Dashboard - Summary

2025年1月27日月曜日

Googleドライブ内の音声ファイルをiframe内で再生したい


iframe の src にGoogleドライブ内の音声ファイルを埋め込む例です


(今回試した音声ファイルはmp3)



Code.gs
function doGet() {
return HtmlService.createTemplateFromFile('index').evaluate();
}


index.html
<!DOCTYPE html>
<html>
<body>
<iframe src="https://drive.google.com/file/d/FILE_ID/preview?usp=drivesdk" width="30%" height="50">
</body>
</html>

FILE_ID にはGoogleドライブに保存している音声ファイルIDを入れます


Tips


上記リンク先の記事に書いた audio タグへの埋め込み再生がうまくいかなくなり、 iframeで実現する方法を Gemini と ChatGPT に聞きながら実装しました


FILE_IDは、Googleドライブで対象のファイルの右端にある

 ⋮ メニュー > 共有 > リンクをコピー

から取得できます


コピーしたリンクはこのようになっているはず↓

https://drive.google.com/file/d/FILE_ID/view?usp=drive_link





Latest post

Googleドライブ内の音声ファイルをiframe内で再生したい

iframe の src にGoogleドライブ内の音声ファイルを埋め込む例です (今回試した音声ファイルはmp3) Code.gs function doGet () { return HtmlService . createTemplateFromFile ( ...