ローカルのファイルをGoogle Driveの指定フォルダにアップロードする方法その２です
今回はform内のsubmitボタンではなく
formの外にあるボタンでアップロードしてみます
form内のsubmitボタンで実現する方法は こちら に書きました
アップロードする手順
- 「ファイルを選択」をクリックする
- ローカルファイルの選択画面が開く
- 任意のファイルを選択して「開く」をクリックする
- 「選択されていません」に選択したファイル名が表示される
- 「ボタン」をクリックする
- 指定したフォルダにファイルがアップロードされる
- アップロードしたファイルのURLがアラートに出る
コード.gsfunction doGet() {
return HtmlService.createHtmlOutputFromFile('index');
}
function processForm(formObject) {
var folder_id = "FOLDER_ID";
var folder = DriveApp.getFolderById(folder_id);
var file = formObject.myFile;
var drive_file = folder.createFile(file);
var file_url = drive_file.getUrl();
return file_url;
}
| 意訳この機能がやること 指定したHTMLファイルを表示する この機能がやること アップロード先のフォルダIDを指定して フォルダを指定して formObjectの中のnameがmyFileの要素を取得して そのファイルをアップロードして そのURLを取得して 返す |
index.html<!DOCTYPE html>
<html>
<body>
<form id="myForm">
<input name="myFile" type="file" />
</form>
<button id="bt">ボタン</button>
<script>
var this_form = document.getElementById("myForm");
document.getElementById("bt").addEventListener('click', function() { handleFormSubmit(this_form) });
function handleFormSubmit(formObject) {
google.script.run
.withSuccessHandler(updateUrl)
.processForm(formObject);
}
function updateUrl(url) {
alert(url);
}
</script>
</body>
</html>
| 意訳これはHTML5文書です フォームを置く ファイルをアップロードするためのボタンを置く ボタンを置く idがmyFormの要素を取得して idがbtの要素がクリックされた時にhandleFormSubmitに渡して実行する この機能がやること .gsファイルを実行する 成功したらupdateUrlを実行する 実行する.gsファイルはprocessFormでformObjectを渡す この機能がやること 返ってきたurlをアラートに出す |
関連記事
Googleドライブの指定したフォルダにファイルをアップロードする
Googleドライブの指定したフォルダにファイルをアップロードする
参考
HTML Service: Communicate with Server Functions / Forms
https://developers.google.com/apps-script/guides/html/communication#forms
HTML Service: Communicate with Server Functions / Forms
https://developers.google.com/apps-script/guides/html/communication#forms
