GASのウェブアプリでtitleが反映されない

Google App Script (通称GAS)では「ウェブアプリ」としてデプロイするだけで簡単に動的なWebサイトを作成・公開できて便利です。基本的にはプロジェクトにHTMLファイルを作っておいて(ここでは例として”index.html”)、doGet関数で

let html = HtmlService.createHtmlOutputFromFile("index");
return html;

とするだけで”index.html”の内容を返すウェブアプリにできます。デプロイしたURLにアクセスしてみると、ちゃんとindex.htmlの内容が表示されるのがわかります。しかし、よくよく見てみるとブラウザーのタブにtitleの内容が表示されず、URLが表示されてしまうではありませんか。

GASページを表示したときのChromeタブ

index.htmlにもちゃんとtitleを書いたのに…と思いながら確認してみると、2重のiframeの中に実際のページが表示されていることがわかりました。一番外側のページは今回作ったページではないので、titleをいくら書いても意味がないということです。

そして、その解決方法はこちら。

let html = HtmlService.createHtmlOutputFromFile("index");
html.setTitle("ここにページのタイトル");
return html;

HtmlContentのsetTitle関数を使ってコードから明示的にタイトルを指定することで、ブラウザーのタブにもちゃんと表示することができました。setFavicon関数もあったので、ファビコンについても同じような感じだと思います。

ちなみにテンプレートを使うならこんな感じです。

let tmpl = HtmlService.createTemplateFromFile("index");
// この辺でテンプレートの操作
let html = tmpl.evaluate();
html.setTitle("ここにページのタイトル");
return html;