それマグで!

知識はカップより、マグでゆっくり頂きます。 takuya_1stのブログ

習慣に早くから配慮した者は、 おそらく人生の実りも大きい。

Goole App Script ( GAS ) の基本的な操作方法。18. clasp run でコンソールから実行

clasp run で ローカルからGAS実行

clasp run をつかえば、コマンドからGASを実行できます。

f:id:takuya_1st:20210608021310p:plain

clasp コマンドをうまく使えば便利かもしれないので、使い方を見ておく。

全体の流れ

結構手順が多いのです。

  • clasp コマンドをインストール
  • GASプロジェクトを設定
  • GCPプロジェクトを作成設定
  • GASとGCPを紐付け
  • clasp と GASを紐付け・認証
  • clasp に GCPを紐付け・認証
  • clap run

run を使うまでの手順が、煩雑で多いのです。OAuth関連の設定が多くてね。

clasp run は GCP にリクエストを投げ、GCPが GAS api を叩き、最新のコードを実行し結果を返してくれます。

clasp インストール

npm で clasp をインストールします。

npm install -g @google/clasp

GAS プロジェクト作成

https://script.google.com/ にアクセスして、プロジェクトを新規作成。

f:id:takuya_1st:20210608002540p:plain:w300

GCP プロジェクトを新規作成

GCP コンソールにアクセスして、プロジェクトを作成

GCP で作って保存するもの

GCPのコンソールでは、次の情報取得とAPI有効化をやります。

  • 必要情報の取得
    • プロジェクトID
    • プロジェクト番号(int)
    • OAuthクライアントのJSON
  • APIの有効化
    • apps scripts API の有効化

プロジェクトの作成と保存は、煩雑なので記事の末尾にスクショ付きで書いておきます。→ GCPプロジェクトの手順

GAS に GCP を紐付け

プロジェクト番号(数値)をGASに設定する

プロジェクト→ 設定

Google Cloud Platform(GCP)プロジェクト番号(数字)を貼り付ける。

f:id:takuya_1st:20210608005925p:plain:w320

clasp とGASを紐付け。

clasp login は終わっているものとします。

clone よる紐付け。

mkdir sample && cd sample
clasp clone ${スクリプトID}

または、create による紐付け

create → standalone でローカルで新規作成し、リモートへpush します。

mkdir sample && cd sample
clasp create myGas
clasp push

claspプロジェクトと GCP を紐付け

ローカルプロジェクトを、GCPと紐付けします。

GCPでダウンロードした認証情報JSONをプロジェクトへ移動

GCPから取得した認証情報JSONをプロジェクトへ

JSONは、GCP→ 認証情報→ クライアント→ダウンロードボタンでダウンロード。

clasp_project_dir=~/sample
mv client_secret_xxxx2697-xxxxonbxxxj.apps.googleusercontent.com.json \ 
${clasp_project_dir}/creds.json

clasp に projectIDを登録

clasp コマンドでプロジェクトに紐付ける。

GCP で作成したプロジェクトID(英数字名前)を入れる。

GCP_PROJECT_ID=gas-sample-001
clasp setting projectId ${GCP_PROJECT_ID}

json からプロジェクトを認証

json認証情報を使って、プロジェクトをOAuthする。

 clasp login --creds creds.json

ここでのログインは、プロジェクトがGCPへログインする。

ブラウザでOAuth

ブラウザが起動するので、GoogleアカウントでGCPのアカウントでログインして認証する。

終わったら次のような画面になる。

f:id:takuya_1st:20210608011412p:plain

コードを書く。

エディタを開き。関数を作り return を書く。忘れずにreturn を書く。

f:id:takuya_1st:20210608011604p:plain

return を書く理由は clasp run 実行後にコンソールに表示されるのが、関数の戻り値だから。

リモートへ送る

ローカルで作成したコードをscript.google.com へ push する。

clasp push 

デプロイ(公開する)

GASのプロジェクト・ページへ移動して、デプロイを作る。

デプロイを作成

GASのプロジェクト画面→デプロイ→新規作成→歯車→実行可能API

f:id:takuya_1st:20210608012202p:plain

clasp run 実行する

ようやく、本題の clasp run が出来ます。

clasp run

実行結果(戻り値)

実行すると、関数の戻り値が表示されます。

f:id:takuya_1st:20210608012628p:plain

実行結果(Console.log)

console.log で出力した、実行ログは、clasp logs コマンドで確認します。

f:id:takuya_1st:20210608012852p:plain

コードを更新して実行

次回以降は、push && run を繰り返せばいい。

clasp push 
clasp run myFunction 

clasp runは dev モードで動くので、push されたコードが常に実行される。

run 遅い

せっかくここまで設定したけど、push && run の clasp が遅い。表現したくないほど遅い。   

本当に遅いんですよ。 push && run をするのに待たされる。   

push に掛かる時間

f:id:takuya_1st:20210608022408p:plain

run に掛かる時間

f:id:takuya_1st:20210608022427p:plain

実行結果はスグ返るのに、終了が遅い。

実行自体はスグ終わります。その後なんの処理かわからないけど、終了処理で凄く待たされる。Ctrl-Cで中断したらプロジェクトの動作がおかしくなった。

clasp のclasp run 使えないかも。

CI/CD で回すならいいかも。

ローカルでコード書いて実行し、エラー見つけて修正、コード書いて実行みたいな使い方はとてもストレスなので使えないと思います。

自動実行をCI/CDでまわすなら、バックグラウンドで動くのでストレスなく使えるかもしれない。

git に push タイミングでGASにデプロイしてテストで実行する程度ならいいんじゃないですかね。

APEENDIX(GCPプロジェクト)

GCP プロジェクトの作成手順

GCP のプロジェクト作成で、GCP経由でGASのスクリプトを起動できるようにします。

保存するもの

プロジェクトを作成し、次のものを保存してclasp の設定に備える。

  • プロジェクトID
  • プロジェクト番号
  • 認証情報JSONの取得

設定するもの

GCP のプロジェクトで次を設定し、APIが利用できるようにする。

  • OAuth 同意画面
  • OAuth デスクトップ・クライアント
  • ライブラリ Gooogle App Script API

設定の流れ

設定は、次の流れで行う。

  • GCPコンソールにアクセス
  • プロジェクトを作成
  • プロジェクト番号とIDを保存
  • OAuth 同意画面の作成
  • OAuth クライアントを作成
  • JSONの保存
  • GAS Api の有効化

やることが多いです。

プロジェクトの新規作成

f:id:takuya_1st:20210608003002p:plain

プロジェクト情報の確認

ここで、ID(名前)と番号(数字)をメモります。

f:id:takuya_1st:20210608005753p:plain

OAuth 同意画面の作成

左上のメニュー → APIとサービス → OAuth同意画面

f:id:takuya_1st:20210608003200p:plain

同意画面は、必須項目を埋めるだけでいい。必須項目はメアドくらい。

自分しか使わないし。考えることはない。

OAuth認証情報の作成

左上のメニュー → APIとサービス → 認証情報→認証情報を作成

f:id:takuya_1st:20210608003309p:plain

クライアントIDを選ぶ

ここでは、クライアントを作るのでクライアントを選ぶ。

f:id:takuya_1st:20210608003331p:plain

種類はデスクトップアプリ

種類の選択で、デスクトップアプリを選ぶ

f:id:takuya_1st:20210608003357p:plain

JSONダウンロード

認証情報が作成されたら、デスクトップ用のJSONがダウンロードできる。

f:id:takuya_1st:20210608003454p:plain

API の有効化

プロジェクトで Google App Script API 有効にする。

ライブラリにゆく

f:id:takuya_1st:20210608003532p:plain

apps script api を有効にする。

f:id:takuya_1st:20210608003953p:plain

GCP 準備完了

これでGCPの準備は出来ました。次の情報が得られているはずです。

  • プロジェクトID
  • プロジェクト番号
  • 認証情報JSONの取得

これを、CLASPとGASに登録します。

プロジェクト番号(数字)は、GASへ登録

プロジェクトIDと認証情報は、clasp login で使います。

gcp 準備が完了したら、clasp をあとは実行するだけです。

GAS 目次

ひとまずここで筆を置きます。GASに関しては次が目次です。

Goole App Script ( GAS ) を始める。記事一覧 - それマグで!

Goole App Script ( GAS ) の基本的な操作方法。17. claspで GASをローカルからVisualStudioCode編集して補完し、git管理する。

f:id:takuya_1st:20210607213754p:plain

インストール clasp

clasp コマンドは @google/clasp で提供されています。 @google/clasp をグローバルにインストールしてclasp コマンドを使えるようにします。

npm install -g @google/clasp

npm なのでインストールは時間が必要です。

インストール確認

clasp コマンドがインストールされたかチェックしておきます。

which clasp #=> /usr/bin/clasp
clasp help

初期設定

インストールが終わったら初期設定です。google アカウントと紐付けます。

ログインしてOAuthします。

clasp login

scrpipt.google.com にログインして、プロジェクトにアクセスできるようにしなくてはいけません。login を実行してブラウザを立ち上げて、clasp コマンドにパーミッションを与えます。 ローカルホストでWEBが起動しブラウザ経由でOAuthします。

oauth 完了

f:id:takuya_1st:20210607214445p:plain

設定ファイル

Googleアカウントの権限付与したら、設定ファイル~/.clasprc.json が作られます。

$ ll  ~/.clasprc.json
-rw------- 1 takuya takuya 2267 Jun  7 21:44 /home/takuya/.clasprc.json

準備完了

これで、プロジェクトをローカルに取り込む準備ができました。

clasp clone

既存のプロジェクトをclone する。

まずは、既存のプロジェクトをデスクトップにコピーしてきます。

mkdir してから clasp clone

clasp clone コマンドでGASの一覧から、スクリプトをコピーできる。

サンプル
## プロジェクトフォルダをつくる。
mkdir myGas
cd myGas
mkdir src
## GASからコードを取り出す。
clasp clone 0wmjSXXXXXXXXXXsx98zZtcpljDBc
## 編集したら pushする
clasp push

フォルダは自動生成されません。

フォルダは作成されないので、さきにフォルダをつくり、clone します。 git clone のようにフォルダが自動生成されないので注意(大事なので2回書いています。)

clone 後は、ローカルファイルとして編集できます。編集が終わったら push します。

clasp push

push すればアップロードされアップデートされます。

clasp push 

clasp push でアップロードです。`ローカル→script.google.comへアップロード

プロジェクトIDの発見方法。

GASの「プロジェクト」には固有のプロジェクトIDが割り振られています。これを取得します。

アドレスの文字列をコピーします。

プロジェクトを開いたときのアドレスをコピーすればOKです。

https://script.google.com/home/projects/{ここ}/

複数アカウントGoogleログインしている場合はURLが異なります。

https://script.google.com/u/2/home/projects/{ここ}/

google サービスは複数アカウントのログイン時にhostname.google.com/u/{number}/ のようなアドレスになりますが、もうずっと10年以上複数アカウントの不具合が残ってます。今使ってるアカウントには注意しておきます。

プロジェクトの設定画面

プロジェクトの設定画面からもプロジェクトの固有IDを見つけることが出来ます。 f:id:takuya_1st:20210607214857p:plain

clone は時間がかる。

clasp の clone はすこし時間がかかります。辛抱強く待ってください。

ローカルで管理するメリット。

ウェブサイトで開発できるのに、わざわざローカルにコピーするメリットはいくつかあります。

  • git によるコード管理・属人化の防止
  • トランスパイラ利用
  • エディタ

git による管理。

ファイルがローカルになることで、git push 管理できます。git にすることで変更点を残しておけます。

cd CLASP_DIR
git init 
git remote add origin ssh://xxxx
git commit -m import 
git push 

これで、コードを管理しやすくなります。とくに共通コードをまとめて管理できるようになるはずです。

Google Driveからの独立

Google Driveから独立して管理できるので、個人のGoogle Driveやscript.google.com から独立し、自立できます。個人のGoogle Driveに依存しないので、ドキュメント類を残したり手順を標準化しやすくなります。

トランスパイラ利用(コンパイル)ができるようになる。

polyfill を使ったり TypeScript を書いたものを gs/js にトランスパイルすることで、記述を柔軟にできるようになって便利です。gas を typescript で書いたり reactできるようになって便利です。

外部ライブラリをまるっと取り込んでnpm の恩恵に預かれる。

エディタを選べて補完ももできる。

自由にエディタを選べるようになります。

コード補完をする。

次のパッケージを使えばコード補完もできるようになります。

npm install --save @types/google-apps-script

@types/google-apps-script が GASの補完などのファイル・タイプ定義ですね。

補完例

Visual Studio Code で GASを補完しながら書いている例です。completion は特に設定しなくても install するだけで大丈夫です。

f:id:takuya_1st:20210607221319p:plain

おまけ、clasp /git 管理は、 --rootDirをつける

claspを使ってGASをgit 管理するとき、clasp clone --rootDir を使いましょう。

cd project
mkdir src
clasp clone  --rootDir=src

--rootDir を設定することで、gas の管理が楽ちんになります。GASは全ファァイルをロードするので、うっかりすると必要のないファイルまでpushされ、GASロードされちゃいます。

なので --rootDir がないとき、 .claspignore で .git を無視する必要があります。そのために、 --rootDir を使います。必ずつけましょう。

またトランスパイラを通すときは、トランスパイラの出力フォルダ dist を 指定します。 --rootDir=dist ですね。

次回へ続く

長いので分割しました→次回

Goole App Script ( GAS ) の基本的な操作方法。 16. 専用サイトでGASプロジェクトを管理する。

GAS は Google drive

GASの一覧と管理は、Google Driveで行うのが基本になるみたいですね。

Google Driveのフォルダに、プロジェクトが作成される。

プロジェクトは固有IDを持ち、好きなフォルダに設置することができる。スプレッドシートからスクリプトエディタを開いたときは、スプレッドシートと同じフォルダに設置される。

スクリプトが増えてくると、スクリプトシートと紐付いているのを無視して管理したくなる。そのときに便利なのがプロジェクトを一覧するサイト。

google app script は次のサイトで一覧できる。

GASのプロジェクトファイルは、次のサイトでDriveに四散しているプロジェクトファイルを見ることができる。

https://script.google.com/home

自分のプロジェクトの一覧を見ることができる。

f:id:takuya_1st:20210607211718p:plain

タイマーの一覧も見れる。

トリガーで作ったタイマーも、プロジェクトを横断して確認できる。

f:id:takuya_1st:20210607212231p:plain

https://script.google.com/home でプロジェクト単体として存在できる。

https://script.google.com/homeで管理するのはプロジェクト単体な、プロジェクトである。スプレッドシートやスライドと紐付かず、独立したプロジェクトとしても作成できる。

ドキュメントから独立したプロジェクトの魅力

単体プロジェクトは、ドキュメントとペアにせず、単独のプロジェクトとして、作成管理できる。

そのため、テンプレートから新規ファイルを作るプロジェクトや、結果を新規ドキュメントに保存するようなプロジェクトを作成して管理しやすくなって便利ですね。

## 次回へ続く

長いので分割しました→次回

Goole App Script ( GAS ) の基本的な操作方法。15. GAS をスケジュールで実行する

GAS の実行方法の種類

GASを実行するには、いくつか方法があって、ボタンを押して実行、メニューから実行、実行ボタンを押す、HTMLで実行、スケジュールで実行、APIで実行がある。

分類すると次のようになる。

  • ドキュメント内イベントハンドラで実行
    • ボタンを押す
    • 開く・編集で実行
    • メニューから実行
  • HTML を使う。
    • HTMLを表示で実行
    • フォーム送信で実行
  • 単体で実行
    • タイマーで実行
    • APIで実行

今回は、タイマーで実行する方法を見ておく。

GoogleAppScript をタイマー実行する

GASはスケジュールで実行の設定ができる。スケジュール実行は、とてもかんたん。

トリガーを作る

スクリプトメニューから、トリガーを選択

f:id:takuya_1st:20210607150639p:plain

トリガーを追加

時刻でトリガーを追加する。

実行する関数と、実行する時間・日付をきめてトリガーを作成すればオッケ。

f:id:takuya_1st:20210607150620p:plain

便利ですね。

追加費用もなしで、スクリプトをタイマーで実行できるのはいいですね。

レンタルサーバーなどではcrontab などが必要で実行数が規制されたりするし、crontab/systemd を使うと設定に知識が必要なのに、GASは本当にかんたんに実行できる。

次回へ続く

長いので分割しました→ 次回

Goole App Script ( GAS ) の基本的な操作方法。14.スプレッドシートに追記する。

スプレッドシートに追記したい。

スプレッドシートのデータの範囲に、次の行を書くにはどうするのか。同じデータを連続して書き込むにはどうするのか。少し考えてみた。

セルに続けて書きたい。

セルの最終行に次行のレコードを書き込んでログのように記録を取りたい

次のように、続けて書き込みたい。

f:id:takuya_1st:20210605022853p:plain:w200

GASの例

function main(){
  addCell();
}
function addCell() {
  let app = SpreadsheetApp.getActiveSpreadsheet();
  let sh = app.getActiveSheet();
  let range = sh.getDataRange();
  let r = range.getLastRow();
  let c = range.getLastColumn();
  let nextCell = sh.getRange(range.getLastRow()+1,1,1,2);
  let data = [
    [getCurrentIp(),currentDateTime()]
  ]
  nextCell.setValues(data)

}
// データ
function getCurrentIp() {
  let ip = 'x.x.x.x'
  let url = 'https://api.ipify.org?format=json'
  let json = UrlFetchApp.fetch(url);
  let obj = JSON.parse(json);
  //ip = (obj) ? obj.ip : ip;
  return ip;
}
function currentDateTime(){
  let d = new Date()
  let str = Utilities.formatDate(d, 'Asia/Tokyo','yyyy/MM/dd HH:mm:ss')
  return str;
}

実行すると。

最初、空っぽの状態から、データがログのように書き込まれる。
f:id:takuya_1st:20210605021733p:plain:w200

f:id:takuya_1st:20210605021815p:plain:w200

コードについて。

今回使ったコードの冒頭部分について。

現在データが書き込まれている範囲を取る。

getDataRange は、CTRL-Aで選択して自動的に作られる選択範囲を取得する。

  let app = SpreadsheetApp.getActiveSpreadsheet();
  let sh = app.getActiveSheet();
  let range = sh.getDataRange();
  let r = range.getLastRow();
  let c = range.getLastColumn();

次の行の範囲を取る。

次の行を選ぶのでgetLastRow()+1 を使う。列は先頭からなので、1を入れる。(プログラミングになれた人は、ここで配列と同じ入れがちなので注意、セルは1から数えます。)

sh.getRange(range.getLastRow()+1,1,1,2);

getRange は矩形選択、Rectangleの描画と同じ

getRange は1,2引数で選択開始位置。(開始座標)
getRange は3,4引数で選択する個数。(縦横長さ)

getRange( startRow, StartCol, numOfRow, numOfCol) 

選択範囲にデータを貼り付け

選択範囲にデータを貼り付けするのは setValues を使う。

setValues([  [ COL_A, COL_B ]  ] )

setValue の引数は、ネストした多次元配列。

多次元配列には、行ごとにデータを入れる。

data = [
 [ "A1", "B2" ] //  1行目
 [ "A2", "B2" ] //  2行目
]

データの追記はよくやるので

データ追記はよくやるので、ぱぱっとできるといいな。

2021-06-07 追記

似たような方法に次のような方法がある。 getLastRow 関数を利用する。

getLastRow はデータ領域の最終行が返されるので、不定数のカラムを書き込むのであれば、getLastRowもいいと思う。

この記事では、行の下方向に決まったデータを追記するので、getDataRange() を使ってます。

getLastRow は次のペアで覚えておくと便利です。

sheet.getLastRow();
sheet.getLastColumn();

次回へ続く

長いので分割しました→次回

Goole App Script ( GAS ) の基本的な操作方法。13.スプレッドシートのセルの基本操作

前回の続き

前回までで、GASでコードを書いて実行する方法がわかった。

今回はセル操作

今回は、Spreadsheetの基本的な使い方を見ておく。

セルの取得=範囲の取得

EXCELでも同じ。知っていると思うけど知らないと混乱するので注意。

セルを取得するとは、範囲=1の選択範囲を作るということ。

範囲を選択する

let sps = SpreadsheetApp.getActiveSpreadsheet();
let sht = sps.getSheets()[0];
let rg  = sht.getRange("B5:B6");
g.activate();

範囲を選択するのに1つだけ選択したら、セルを選択。

let sps = SpreadsheetApp.getActiveSpreadsheet();
let sht = sps.getSheets()[0];
let rg  = sht.getRange("B6");
g.activate();

セルを取得

let sps = SpreadsheetApp.getActiveSpreadsheet();
let sht = sps.getSheets()[0];
let rg  = sht.getRange("B5");
rg.activate();

セルの値を取得

let sps = SpreadsheetApp.getActiveSpreadsheet();
let sht = sps.getSheets()[0];
let rg  = sht.getRange("B5");
rg.activate();
let val = rg.getValue();
console.log(val)  

セルの書式(表示形式)を取得

数値は、表示形式が重要なので、数値の表示形式を見ておく。

let fmt = rg.getNumberFormat();
console.log(fmt)

日付形式 yyyy/MM/dd 日付と時刻 yyyy/MM/dd H:mm:ss 時刻 HH:mm:ss

セルの値を更新

セルの値を更新して、数字の表示形式を入れていく。

  rg.setValue('2021年6月4日');
  rg.setNumberFormat('yyyy/MM/dd');

セルに背景を設定

  let sps = SpreadsheetApp.getActiveSpreadsheet();
  let sht = sps.getSheets()[0];
  let rg  = sht.getRange("B5");
  rg.setBackgroundRGB( 250,120,120 );

セルの背景色を解除

背景色を解除するのには、setBackgroundで null を設定する。 クリアでは、値ごとすべて解除される。

let sps = SpreadsheetApp.getActiveSpreadsheet();
let sht = sps.getSheets()[0];
let rg  = sht.getRange("B5");

rg.setBackground(null);

セルの枠線・ボーダーを設定

ボーダーは、範囲に対して設定する引数の順番に注意、

上下左右を設定する

let rg  = sht.getRange("B5");
rg.setBorder(true, true, true, true, false, false);

内側も含めてすべて設定する。

すべてを true にすると、全部設定できる。

rg.setBorder(true, true, true, true, true, true);

セルの枠線(ボーダー)をすべて解除

すべてを解除するには、false を設定する。

  rg.setBorder(false,false,false,false,false,false);

変更しない=null を設定する。

下だけ変更したいときのように、他を変更したくないときは、 null を渡す。

  rg.setBorder(null,null,true,null,null,null);

引数がどうしても多くなるので使うときに不便ではあるが、覚えておく必要がある。

セルのボーダーの枠線スタイルを決める。

SpreadsheetApp.BorderStyle.SOLID_THICK のように、名前空間の中に入れる。

  • DOTTED / 点線
  • DASHED / 破線
  • SOLID (* デフォルト) / 線
  • SOLID_MEDIUM / 太線
  • SOLID_THICK / 極太
  • DOUBLE / 二重線

引数は、8番目。

range.setBorder(top, left, bottom, right, vertical, horizontal, color, style)

極太線を設定する。

rg.setBorder(true, true, true, true,
    true, true, 
    null,
    SpreadsheetApp.BorderStyle.SOLID_THICK
    );

枠線の色を決める。

色をは HTML と同じ色指定。256色なRGBを #FFFFFF と同じく入れる。

rg.setBorder(true, true, true, true, true, true, 
    "#88AA00",
    SpreadsheetApp.BorderStyle.SOLID_THICK
    );

次回へ続く

長いので分割しました→次回

Goole App Script ( GAS ) の基本的な操作方法。12. キーボード・ショートカット

スクリプト・エディタのキーボードショートカット

実行 / Ctrl-R

  • 実行 / Ctrl -R / ⌘ -R
  • ログ切り替え / Ctrl - Enter / ⌘ - Enter

実行は、選択中の関数が実行される。

選択中の関数とはこれ

選択中の関数とは、このメニューで選択している関数である。

f:id:takuya_1st:20210604045521p:plain

カーソル位置の関数を実行してくれると楽なんだけど、毎回選択し直す必要があるみたい。

編集のショートカット

  • 補完 ctrl-space / ⌘ -Space
  • 単語補完 alt- / (スラ) / ⌘- /
  • コメント・トグル ctrl - / (スラ)
  • 行削除 ctrl -d / ⌘ - D
  • インデント TAB
  • アンインデント Shift-TAB
  • コードの整形 / Alt-Shift-F

補完中の操作

補完中の操作は、通常のIDEと同じ

f:id:takuya_1st:20210604050113p:plain:w280

  • 候補移動 矢印 ↑ ↓
  • 選択 TAB / Enter

タブで補完決定できるのはちょっと好き。

コードの整形もできる

選択範囲のコードの整形ができます。

f:id:takuya_1st:20210604152846p:plain

保存

  • カレントファイル保存 Ctrl - S / ⌘ - S
  • すべて保存 Ctrl-Shift-S / ⌘- Shift - S

キーボード・ショートカットの調べ方

エディタにフォーカスが存在するときに、F1を押せば、コマンドパレットが表示され、キーボードショートカットを見ることができる。

右クリックでメニューを表示

メニューを見れば、キーボードショートカットもわかる。

f:id:takuya_1st:20210604153009p:plain

コマンド・パレットでショートカットを見る。

右クリックから、コマンド・パレットを参照すれば、さらに機能を見ることができる。

コマンドパレットを参照すれば、以外に多機能で、こんなこともできるんだ!っていう発見が多いので、一度は見ておくこと。

f:id:takuya_1st:20210604153159p:plain

次回へ続く

長いので分割しました→ 次回

Goole App Script ( GAS ) の基本的な操作方法。11. ボタンに登録して実行

前回まで

前回までで、コードをスッキリさせて、好きなタイミング実行できるようにした。

今回は、ボタンで実行

今回は、さらにわかりやすくするために、ボタンに登録して実行することにする。

ボタンで実行を作る。

ボタンそのものは存在しないので、図形オブジェクトとして追加する。

手順

以下の手順で作成します。

  • オブジェクトを追加(図形描画)
  • ボタンを作成
  • ボタンをのメニューをクリック
  • スクリプトの割当

オブジェクトの追加

図形描画で図形を作ります。

f:id:takuya_1st:20210604044223p:plain

ボタンを図形描画で作る。

同じ図形を2つ重ねて、枠線の太さと色を変えてボタンっぽくします。 f:id:takuya_1st:20210604044737p:plain

出来ました。

ボタンっぽい画像を作りました。

f:id:takuya_1st:20210604044230p:plain

クリックしてメニューを表示

メニューは、図形を選択すると現れます。

f:id:takuya_1st:20210604044236p:plain

スクリプトの割当。

関数名を指定します。

f:id:takuya_1st:20210604044242p:plain

図形をクリック

図形をクリックすると、割り当てた関数名が実行されます。

f:id:takuya_1st:20210604044710p:plain

スクリプト割当後の注意。

いちど割り当てると、クリックで起動する。

マウスクリックが不能になる。移動・変更は右クリックでやる。

続く

長いので分割しました。

次回に続く→12

 

 

 

Goole App Script ( GAS ) の基本的な操作方法。10.メニューに登録して実行

前回の続き

前回までで、一通り実行ができるようになったので、他人に使ってもらうためにメニューに追加して実行する方法を見ておく。

今回はメニュー

今回は、メニューから好きなタイミングで任意に、スクリプトを実行します。

メニューで実行

メニューに登録して、任意のタイミングで実行。

function addCustomMenu(){
 //メニューを追加
  let my_menu = new Array();
  my_menu.push({name:"ダミー", functionName: "menu_dummy"});
  let s = SpreadsheetApp.getActiveSpreadsheet().addMenu("!!サンプル", my_menu);
}

メニューになる。

この関数を実行すると、メニューが生成され、いつでもスクリプトを実行できる。

f:id:takuya_1st:20210604043437p:plain

起動後にメニューを生成

ドキュメントを開いたあとに、メニューを自動生成することもできる。

onOpen関数を定義すると、ドキュメントを開いた瞬間に実行される。onOpenは存在するだけで自動実行される。

function onOpen(){
    addCustomMenu();
}

メニューを追加(別の方法)

先の方法は、ショートカット的な方法で、メニューを作るのは、こっちがGAS的に正統方法だと思う。

function onOpen(){
  SpreadsheetApp.getUi().createMenu("!サンプル")
  .addItem('アイテム1', "func_name")
  .addItem('アイテム2', "func_name")
  .addSeparator()
  .addItem('アイテム3', "func_name")
  .addItem('アイテム4', "func_name")
  .addItem('アイテム5', "func_name")
  .addSeparator()
  .addSubMenu(
    SpreadsheetApp.getUi()
    .createMenu("アイテム6")
    .addItem('アイテム6-1', "func_name")
    .addItem('アイテム6-2', "func_name")
    .addItem('アイテム6-3', "func_name")
  )
  .addSeparator()
  .addItem('アイテム7', "func_name")
  .addToUi()

}

メニューの上書き

同じ名前で登録すると上書きされるので注意。

続く

長いので分割しました。

次回に続く→11

Goole App Script ( GAS ) の基本的な操作方法。09. 起動時に実行

前回まで

前回までで、ソースの管理、クラス、デバッグを見てきた。

そろそろ十分に準備が整ってきた。

今回はスクリプトの実行タイミング

ファイルを開いたとに、スクリプトを起動する方法を見る。

ドキュメントが開いたときにスクリプト起動

ドキュメントが開いときにスクリプトを起動する onOpen

onOpen 関数を定義しておけば、ファイルを開いときに自動的に実行してくれる。

f:id:takuya_1st:20210604040942p:plain

ドキュメントを開いたとき実行は、少し遅い

onOpenの実行タイミングは、思った以上に遅いので注意する。

一見すると、ファイルが開いてるように見えてもすべての準備が整うまで実行されない。

ドキュメントのローディングバーが進む

メニューの下のローディングバーが進んで消える。

f:id:takuya_1st:20210604041213p:plain

そのあと、最終更新時刻などが取得される。

f:id:takuya_1st:20210604041345p:plain

その後に、ファイルがロードされてonOpenが実行される。(数秒は掛かる。)

f:id:takuya_1st:20210604041137p:plain

シートが複雑だと、そこそこ時間がかかるので辛抱強く待つ必要がある。

複数ファイルにまたがった場合の onOpen

opOpen関数は、どこに書いてもいい。

スクリプトを複数のファイルに分割して書いたとしても、全部ロードしてから onOpenが探される。そのためonOpenをうっかり複数書くと後からロードされたものが優先される。

onOpen 関数はシンプルイベントハンドラなので、いつでも使える。

その他の実行方法

スクリプト・エディタで実行できるのだが、ドキュメント/スプレッド・シートからスクリプトを実行されないと使いにくい。

ファイルが開いたときに実行される onOpen があり、その他にもボタン(図形オブジェクト)にイベントハンドラを貼り付けて使うことができる。

続く

長いので分割しました。

次回に続く→10

  

  

Goole App Script ( GAS ) の基本的な操作方法。08.デバッガとグローバル・オブジェクト

前回まで

前回までで、スクリプトを作って、ファイルに分割してクラスに分けて管理するまで見た。

そろそろまともなコーディングができそうな気がする

今回は

今回はデバッグを使う。デバッグツールを使いGlobalオブジェクトを確認する。

デバッグで実行

行番号をクリックしてブレークポイントを設置できる。

f:id:takuya_1st:20210604033900p:plain

ブレークポイントで止めておけば、グローバルオブジェクトをすべて参照できるので便利。

グローバルオブジェクトの一覧

デバッガを起動しブレークポイントで止めてけば、グローバルオブジェクトの一覧を見ることができる。

global な object 一覧は一度見ておくと、スッキリする。

意外なオブジェクトがあったりする。あと名前のルールが分かっていいと思う。

f:id:takuya_1st:20210604034006p:plain

Utilities クラスとかあったりする。

続く

長いので分割しました。

次回に続く→09

Goole App Script ( GAS ) の基本的な操作方法。07.クラス作成でコード管理。

前回の続き

前回までで、スクリプトを実行し、関数に分割して管理、ファイルに分割して管理、ネットアクセスまでみた。

今回はクラス

今回は、ファイルに分割してするだけじゃなく、クラスにまとめるほう法をみて、さらにコードをスッキリさせる方法を見ておく。

classを使う。

class も完全な互換性があるわけでないが、ある程度使える。

ちょっと古い書式のJavaScriptのclassなので、たまにイライラするかもしれない。

クラスのサンプル

次のようなクラスをGASに作って実行してみます。

class MyClass{

  constructor() {
    this.name = "taro";
  }
  say(){
    console.log( ` My Name is ${this.name} ` )
  }
}
class Dog extends MyClass{

}

function main(){

  let obj = new Dog();
  obj.say()

}

クラスを使った実行

クラスを使ってコードを書いたら、そのあとの関数で実行ができる。

f:id:takuya_1st:20210604033553p:plain

実行結果は次のようになる。

f:id:takuya_1st:20210604033543p:plain

続く

長いので分割しました。

次回に続く→08

             

         

 

Goole App Script ( GAS ) の基本的な操作方法。06. HTTPアクセスでJSON取得

前回の続き

前回までで、ハローワールドを書いて、ファイル分割して管理できるまでみた。

今回は、ネットアクセス

今回は、URLへリクエストを投げて、Google外部のAPIを使ってデータ連携する方法を見ておく。

ネットからデータを取得

URLを指定して、HTTPアクセスでデータを取得したり、データを送信できる。外部のAPIと連携して通知を送ったりできる。

URLへHTTP GET

HTTPでGET もできる。UrlFetchAppオブジェクトがグローバル空間に存在する。UrlFetchAppを使えばオッケ

function  getCurrentIp(){
  let url =  'https://api.ipify.org?format=json'
  let json = UrlFetchApp.fetch(url);
  let obj = JSON.parse(json);
  console.log(obj)
}

HTTPアクセスの結果例

f:id:takuya_1st:20210604052453p:plain

ちなみに、IPアドレスを取得すればわかるんですが、スクリプトは自分のPCで動いてるんすね。 てっきりリモートで動いていると思ってました。

URLにPOSTしてデータを取得 / HTTP POST

fetch の第2引数を指定すれば、POSTを使える。method にPOSTを入れるのですが、POST・GET以外は使えないようですね。

function  getCurrentIp(){
  let url =  'https://api.ipify.org'
  let options = {
  'method' : 'post',
  headers: { "Content-Type": 'application/json' },
  'payload' : 'format=json'
  };
  let json = UrlFetchApp.fetch(url,options);
  let obj = JSON.parse(json);
  console.log(obj)
}

続く

長いので分割しました。

次回に続く→07

Goole App Script ( GAS ) の基本的な操作方法。05. 複数ファイルに分割

前回まで

前回までで、スクリプトを使ってスプレッドシート側に操作ができるようになった。

今回は、ファイル分割。

単純な作業であれば、1つのファイルに全部書いていけばいいのでしょう。 しかし、まともにスクリプトを書くなら、ファイルに分割して書きたくなります。

今回は、ファイル分割をしてスクリプトを使う方法を見ていきます。

関数ファイルを追加する。

最初に用意されるファイルはコード.gs ( 英語版は CODE.gs )がファイル名のデフォルトになっている。

好きなファイル名で追加することができる。

メニューからファイルを追加を選んで押す。

f:id:takuya_1st:20210604032805p:plain

スクリプトを選ぶ

f:id:takuya_1st:20210604032813p:plain

好きな名前でファイルを追加できる。拡張子は入力不要

f:id:takuya_1st:20210604032819p:plain

関数はグローバル空間に追加される。

作成したファイルは、起動前にすべてロードされる。そしてファイル中のグローバルな空間に関数として追加される。関数を追加するといつでも使えると思っていい。

関数以外のスクリプト

関数じゃなく、次のようにベタ書きしたスクリプトは、スクリプト起動前に実行される。

f:id:takuya_1st:20210604033016p:plain

これは、関数を実行する前に実行されます。タイミングはロード時です。関数実行前に、全ファイルをロードします。関数外のスクリプトは、このロード時に実行されるので注意。

ロード順=ファイル名の順

ロードの順序はファイルの順序(名前順)になる。ロード時に実行される関数を作るのであれば、ロード順にも配慮しないとだめ。

たとえば、同名の関数があれば後から読まれた関数で上書きされる。

ファイル名の順番でロードが後になるファイルで先のファイルに書かれた関数が、上書きされる。そのため後ファイルに置いた関数が優先される。

デフォルトの myFunction は、名前被りが多いです。ロード順に注意しないと、関数が実行されない。と悩む原因になります。

続く

長いので分割しました、次回に続く→06

      

takuya-1st.hatenablog.jp

        

  

   

Goole App Script ( GAS ) の基本的な操作方法。04.セルにハローワールド

前回の続き

前回までで、ハローワールド、関数を指定した実行、スプレッドシート側にハローワールドまでやった。

今回はドキュメント側に書き込む。

スプレッドシートにハローワールドを書き込んでみる。

スプレッドシートにハローワールドを書き込む。

スプレッド・シートのセルにハローワールドを書き込む。

function HelloworldToCell() {

  let app = SpreadsheetApp.getActiveSpreadsheet();
  let sheet = app.getActiveSheet();
  let range = sheet.getRange('A1');

  range.setValue("Hello World.");
}

書き込んだら、実行します。

f:id:takuya_1st:20210604032325p:plain

権限が付与されたら、セルにハローワールドが入力される。

f:id:takuya_1st:20210604032313p:plain

続く

長いので分割しました。次に続く→05