はじめに
GASでWebアプリケーションを作る際、例えばスプレッドシートのデータをGASで読み込み、読み込んだデータをJavaScriptで動的に操作したいといったことが発生すると思います。
しかも書いていると途中でどっちの変数か忘れて、GASの変数をそのままJavaScriptに書いてundefinedになったりすることも。
今回はこのあたりを解決する方法を備忘録として書いておきます。
変数の場合
１つの変数の場合、スクリプトレットを利用すれば簡単に代入可能です。
<?
var hoge = 1;
var fuga = 'test';
?>
<html>
<head>
<base href="_top">
</head>
<script>
var hoge = <?!=hoge ?>; //GASの変数を代入
var fuga = '<?!=fuga ?>'; //文字列はクォートで囲む
</script>
配列・連想配列の場合
配列の場合は、一旦JSONにしてから受け渡すと簡単です。
GASのJSON.stringify()でJSON文字列にしたものを、Javascript側でparseします。
<?
var hoge = [1,2,3,4,5];
?>
<html>
<head>
<base href="_top">
</head>
<script>
var hoge = JSON.parse('<?!=JSON.stringify(hoge) ?>');
</script>
おわりに
もしかしたら他のやり方もあるのかもしれないですが、実装するのも簡単なのでおすすめです。