質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Google Apps Script

Google Apps ScriptはGoogleの製品と第三者のサービスでタスクを自動化するためのJavaScriptのクラウドのスクリプト言語です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

1回答

415閲覧

クリック動作で、google.script.runを動かしたい

TomJerry

総合スコア10

Google Apps Script

Google Apps ScriptはGoogleの製品と第三者のサービスでタスクを自動化するためのJavaScriptのクラウドのスクリプト言語です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

1クリップ

投稿2023/03/09 04:43

実現したいこと

クリック動作で、google.script.runを動かしたい

前提

以下の様なコードを書き、Gasにてデプロイを行います。
そのデプロイしたURLにアクセスすると、すぐにdownloadzipが動いて、
output2.zipがダウンロードされ、
次にgoogle.script.runのgetvbaが動いてgas側の返り値のdataを元に、
element.clickで新たにGoogleドライブのファイルがダウンロードされます。
ダウンロードしたいファイルは2ファイルになります。

function downloadzip(){
var testfile = ("https://drive.google.com/uc?id=xxxxxxxxxxxx");
var zip = new JSZip();
var folderName = 'ここに入ってる';
var folder = zip.folder(folderName);
var karireport = document.getElementById('karireport');
var element = document.createElement('a');

Array.from(karireport.files).forEach((f,i) => {
folder.file(f.name,f)
})

var data2 = "テスト, テスト, テスト\nテスト, テスト, テスト";
var bom = new Uint8Array([0xef, 0xbb, 0xbf]);
var blob = new Blob([bom, data2], { type: "text/csv" });
folder.file('csv.csv',blob);

zip.generateAsync({type:'blob'})
.then((content) => {
saveAs(content,"output2.zip")
})

google.script.run.withSuccessHandler(data => {
testfile = ("https://drive.google.com/uc?id="+data);
element.setAttribute('href',testfile);
document.body.appendChild(element);
element.click();
}).getvba();

};

downloadzip();

発生している問題・エラーメッセージ

先程のコードのdownloadzip();の箇所をコメントアウトした後に再度デプロイして、
html側で書いた以下のダウンロードzipボタンを押すと、
zipファイルはダウンロードされるのですが、
google.script.runのgetvbaの処理後のwithSuccessHandlerが動かずに、
elementclickが反応せず、Googleドライブのファイルがダウンロードされずに悩んでいます。
ダウンロードされるファイルは1ファイルのみになってしまいます。
<button onClick='downloadzip()'>ダウンロードzip</button>

試したこと

①withSuccessHandlerの中にconsole.logを仕込んでもログは何も出力されていませんでした。

②withFailureHandlerを設定した後に、同じくwithFailureHandlerの中にconsole.logを仕込んでもログは何も出力されなかったので、
Success・Failure共に動いていないんだと思います。

③再度downloadzip();のコメントアウトを解除するとダウンロードは2ファイル行われます。

gas側とブラウザ側どちらもエラーは出ていないみたいです。
最下行のdownloadzip();をURLにアクセスして動かすのと、クリックして動かすとで、
google.script.runの挙動が異なるのかが分からず悩んでいます。
宜しくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

y_waiwai

2023/03/09 07:12

挙動が異なるとは、どういうふうに異なるんでしょうか 特に、どういう挙動となって、それをどう言う風にしたいかなど そこらへん詳しく説明しよう
TomJerry

2023/03/09 07:17

説明不足ですみません。 ・downloadzip();をコメントアウトしなかった場合 デプロイしてURLにアクセスすると、zipファイルがダウンロードされた後に、element.click();の箇所でU新たにGoogleドライブからファイルがダウンロードされます。 やりたい事はdownloadzip()をHTMLで記述したボタン操作で発火させたいです。 挙動が違うというのはボタン操作だとzipファイルしかダウンロードされないという意味です。
TomJerry

2023/03/11 09:48

なぜだか分かりませんが、console.logだと何も出ないですが、alertにするとwithSuccessHandlerの処理が行われている事が分かりました。 ですので、element.click();の直前でalert(element)とすると、ダウンロードしたいURLが表示されました。 ですがelement.click()は実行されません。 試しにelemnetをブラウザのURLに貼り付けてEnterキーを押すと、ダウンロードされる事を確認しました。 もうちょっとなんですが、原因が分からないです。
TomJerry

2023/03/11 12:45

element.click()をする際にhtmlが全て消えている為、clickする箇所が無い事が原因でした。 ↓こちらだとhtmlが全て消えます。 <button onClick='downloadzip()'>ダウンロードzip</button> ↓こちらに変更するとhtmlがそのままだったので、ダウンロードが無事行われました。 <input type="button" onClick="downloadzip()" value="ダウンロードzip">
guest

回答1

0

自己解決

html側のボタンが以下のものだとhtmlが全て消えてしまった為、
elementそのものがないのでクリック出来ない事が原因でした。
<button onClick='downloadzip()'>ダウンロードzip</button>

以下の様に変更すると無事にダウンロードされました。
<input type="button" onClick="downloadzip()" value="ダウンロードzip">

buttonタグとinputタグの違いについての少し勉強してきます。
また、console.logが出ない事が余計に自分の中で混乱を招いたのですが、
結果的にalertで調べる方法もあるという事が学べました。

お騒がせしました。

投稿2023/03/11 12:50

TomJerry

総合スコア10

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問