Zenn
Open11

読者コミュニティ｜VueとGASでつくる！サーバーレス家計簿📔

matsu7089matsu7089

本の感想や質問をお気軽にコメントしてください。

ma-ya's CREATEma-ya's CREATE

コードの全量がサンプルにしてはかなり長く、全体の構成やAPI連携を把握しながら作成するのが難しかった。
初級者向けではなく、Vue,GASについてある程度知見があり、かつ簡単なアプリくらいは作成したことのある人向けだと思った。

matsu7089matsu7089

コード量多いですよね…。分割して見やすくできないか、検討してみます。
また、基礎文法についても省略している箇所は追記したいと思います。

コメントありがとうございます！頂いた内容を参考にさせていただきます。

math2eye3math2eye3

全般的な初心者なのですが、見やすく整理されているように感じたため1から真似しながら勉強させていただきました。ありがとうございます。
APIの作成までは順調だったのですが肝心の最後の通信で動かなくなってしまい、ソース全コピーしたのですが結局変わらず…
CORSのエラーが出ており、調べるとGASではdoPostのみではblockされてしまうという記事が出てきました。
実際にそのせいなのか分からないのですが、知識が足りず結局解決に至りませんでした。
なにかわかりましたら教えていただけると嬉しいです。

Hidden comment
Hidden comment
Hidden comment
Hidden comment
matsu7089matsu7089

確認遅くなり申し訳ないです🙇
GASの実行でエラーがある場合にも Access-Control-Allow-Origin のエラーがログとして表示されるようです。
api.gs の下の方にある log 関数に次のように書き換えて、再度デプロイを試して頂けますでしょうか？
（「API が叩かれたときのログを出力する」の内容に問題がありました…）

 function log(level, message) {
+  if (logSheet === null) return
   logSheet.appendRow([new Date(), level.toUpperCase(), message])

上記内容で直らない場合は

  • GAS上でコードを編集したら保存→デプロイをしてるか
    • ↑コードだけ編集してもデプロイするまで反映されないです！
  • GASのデプロイしたときに発行されるURLを使い回していないか
    • ↑毎回新しいURLが発行されるので、古いURLになってるかもです！
  • 設定画面の「API URL」が /exec で終わっているか

こちら3点も確認して頂けますでしょうか。よろしくお願いいたします！🙇

math2eye3math2eye3

お返事ありがとうございます！
api.gsに一文追加したところ、読み込み、書き込み、編集すべてできるようになりました！
動くようになって感動しています😭
完全に頼ってしまいましたが、自身でも理解していけるよう勉強していこうと思います。本当にありがとうございました🙇‍♀️

matsu7089matsu7089

動くようになって良かったです！
記事にこちらの内容追記させて頂こうと思います
コメントありがとうございました〜！🙏