GatsbyJSのキャッシュについて

GatsbyJSのドキュメントに、キャッシュの設定方法が記載してあります。

超簡単にまとめると

htmlはキャッシュしない
static/以下はキャッシュする
js, cssはキャッシュする
ただし、/sw.jsはキャッシュしない

GoogleAppEngineでgatsbyの成果物を公開する時に、このキャッシュ設定を再現してみたapp.yamlをメモしておこうと思います。

ただ、自分もちゃんと理解できてないのですがGAEは独自のキャッシュサーバにもキャッシュをしているらしく、この設定で本当に静的ページが更新されるのか良くわかってないです・・・。
とりあえずcache-controlヘッダが期待値通りになってることだけは目視できています。

GAE app.yamlの設定

default_expirationでcacheの期限を設定できる
handler毎に設定したい場合はそれぞれexpirationを書く（省略すると前述のdefaultが使われる）

Gatsbyの成果物であるpublicディレクトリが、GAEアプリのルートにある前提としています。

# app.yaml
# 〜関係ないところは省略してます〜

default_expiration: "0s"

handlers:
  # If the path is empty, show static index.html file
  - url: /
    static_files: public/index.html
    upload: public/index.html
    secure: always

  - url: /sw.js
    static_files: public/sw.js
    upload: public/sw.js
    secure: always

  - url: /static
    static_dir: public/static
    secure: always
    expiration: "600s"

  - url: /(.*\.(js|css))$
    static_files: public/\1
    upload: public/.*\.(js|css)$
    secure: always
    expiration: "600s"

  # Otherwise, find file in static directory
  - url: /
    static_dir: public
    secure: always

  # All URLs are handled by the Go application script
  - url: /.*
    script: auto
    secure: always

Gatsbyのドキュメントにはキャッシュするものについてはめちゃめちゃ長く期間が書かれてますが
GAEは１０分を推奨（多分・・・）してたのでここでは 600s にしています。

簡単ですが、以上です。