はじめに
こんにちは。システムエンジニアのDiavoloです。
GASでWEBアプリを作成する場合、地味に嵌りがちなエラーの回避方法を記事にします。GASのWEBアプリの作成コードを参考にして、GASを作成し実行したときに、「TypeError: output.append is not a function」というエラーが出てしまうことがあります。
昔に書かれた記事のソースコードはChrome V8 ランタイム以前のものがあったりします。output.appendはChrome V8 ランタイムを有効にするとエラーになりますので、GASの設定をoutput.appendはChrome V8 ランタイムを無効にするとエラーが出なくなります。
ソースコード
Chrome V8 ランタイム無効の場合には、このソースコードで問題ありません
index.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<!-- 先程作成したコード.gsのfunction getData()をコールする -->
<? var data = getData()?>
<!-- getData()で取得してきたデータがdataに格納されていますので、これを出力する -->
<table border=1>
<?
for(var i=0; i < data.length; i++){
output.append('<tr>');
output.append('<th>' + data[i][0] + '</th>');
output.append('<th>' + data[i][1] + '</th>');
output.append('<th>' + data[i][2] + '</th>');
output.append('</tr>');
}
?>
</table>
</body>
</html>
Chrome V8 ランタイムを有効にする場合には、こちらのソースコードになります
index.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<!-- 先程作成したコード.gsのfunction getData()をコールする -->
<? var data = getData()?>
<!-- getData()で取得してきたデータがdataに格納されていますので、これを出力する -->
<table border=1>
<?
for(var i=0; i < data.length; i++){
output._=('<tr>');
output._=('<th>' + data[i][0] + '</th>');
output._=('<th>' + data[i][1] + '</th>');
output._=('<th>' + data[i][2] + '</th>');
output._=('</tr>');
}
?>
</table>
</body>
</html>
まとめ
TypeError: output.append is not a function が出る場合以下のいずれかの方法を試してください
①GASのChrome V8ランタイムを無効にする
②output.appendをoutput._=に変更する
この記事に掲載したソースコードについては、私の記事から抜粋しています。良かったら覗いてみてくださいませ！！
GoogleAppsScriptとGoogleスプレッドシートを連携したWEBアプリケーションを作成してみた【第二回】