{ "componentChunkName": "component---src-templates-blog-post-jsx", "path": "/post/how-to-customize-cache-settings-of-google-cloud-storage/", "result": {"data":{"site":{"siteMetadata":{"title":"WEB EGG","author":"Leko - CTO at Yuimedi"}},"markdownRemark":{"id":"549bf932-4dd8-5636-8c32-a1d76510c912","excerpt":"この前公開した記事(Buildersconのセッションタイマーを作った)を実装する過程で、はじめてGoogle Cloud Storageを利用しました。 利用してみたところ、キャッシュ周りの設定を変更する方法がよく分からなかったので、備忘録を残します。 まえおき Google Cloud Storage…","html":"

この前公開した記事(Buildersconのセッションタイマーを作った)を実装する過程で、はじめてGoogle Cloud Storageを利用しました。
\n利用してみたところ、キャッシュ周りの設定を変更する方法がよく分からなかったので、備忘録を残します。

\n\n

まえおき

\n

Google Cloud StorageはブラウザからGUIで操作する方法と、Google Cloud SDKという公式のCLIツールを利用する方法があるようです。 今回は両方の方法でまとめてみます。

\n

※GCP自体はISUCONで使用したことがあるので、GCPことはじめ的なことは割愛します。
\nまた、GCSでバケット作成、ファイルアップロードなどのGCSことはじめも割愛します。

\n

Google Cloud SDKのインストール

\n

公式にインストールガイドがあるのですが、面倒なのでインストールはHomebrew-caskでやってしまいます。

\n
brew cask install google-cloud-sdk
\n

インストールできたか動作確認。

\n
gsutil
\n

ヘルプが表示されていればOKだと思います。

\n

メタデータの確認

\n

キャッシュの情報はメタデータと呼ばれるオブジェクトに格納されています。
\nデフォルトではCache-Control: public, max-age=3600となっているようです。

\n

開発途中に1時間もキャッシュが効いてしまうのは辛いので、もうちょっと短くしたい。

\n

GUIで見る

\n

ファイル一覧の各ファイルの右端にメニューが有ります。

\n

\n \n \n \n \n \n \n \n \n

\n

Edit metadata を選択すると、メタデータの詳細が表示/編集されます。

\n

\n \n \n \n \n \n \n \n \n

\n

Google Cloud SDKで見る

\n

コマンドの場合は、gsutil ls -L {URL}で確認できるようです。

\n
$ gsutil ls -L gs://web.timer.builderscon.io/all.css\ngs://web.timer.builderscon.io/all.css:\n    Creation time:      Mon, 27 Jun 2016 00:02:53 GMT\n    Cache-Control:      public, max-age=300\n    Content-Length:     2225\n    Content-Type:       text/css\n    Hash (crc32c):      TTdzRQ==\n    Hash (md5):     BHMNh5agX0rW+VxFUeO4vA==\n    ETag:           CKfap76gw80CEAQ=\n    Generation:     1466860311276839\n    Metageneration:     4\n    ACL:            ACCESS DENIED. Note: you need OWNER permission\n                on the object to read its ACL.\nTOTAL: 1 objects, 2225 bytes (2.17 KiB)
\n

httpでアクセスしてみる

\n

curlからファイルにアクセスし、レスポンスヘッダを見てみます。

\n
$ curl -v http://web.timer.builderscon.io/all.css | grep -i cache\n*   Trying 172.217.25.112...\n* Connected to web.timer.builderscon.io (172.217.25.112) port 80 (#0)\n> GET /all.css HTTP/1.1\n> Host: web.timer.builderscon.io\n> User-Agent: curl/7.43.0\n> Accept: */*\n>\n< HTTP/1.1 200 OK\n< X-GUploader-UploadID: AEnB2Uo-VyZzLzndQK4fCwxFlWUnnbZJX36oxapS-DRXklr34ke74Liu8A8_uDWimrSzjS3hWoVpUh318hW9MVFQacQrjl_ozA\n< Date: Wed, 06 Jul 2016 01:56:29 GMT\n< Cache-Control: public, max-age=300\n< Expires: Wed, 06 Jul 2016 02:01:29 GMT\n< Last-Modified: Sat, 25 Jun 2016 13:11:51 GMT\n< ETag: \"04730d8796a05f4ad6f95c4551e3b8bc\"\n< x-goog-generation: 1466860311276839\n< x-goog-metageneration: 4\n< x-goog-stored-content-encoding: identity\n< x-goog-stored-content-length: 2225\n< Content-Type: text/css\n< x-goog-hash: crc32c=TTdzRQ==\n< x-goog-hash: md5=BHMNh5agX0rW+VxFUeO4vA==\n< x-goog-storage-class: STANDARD\n< Accept-Ranges: bytes\n< Content-Length: 2225\n< Server: UploadServer\n\n...
\n

このように、メタデータ内のキャッシュの項目がレスポンスヘッダに含まれています。

\n

キャッシュの有効期限を変更してみる

\n

GUIから変更する

\n

Edit metadataからキャッシュの情報を書き換えられます。

\n

\n \n \n \n \n \n \n \n \n

\n

書き換えたらcurlでアクセス。

\n
$ curl -v http://web.timer.builderscon.io/all.css 2>&1 | grep -i cache\n< Cache-Control: public, max-age=30
\n

意図したとおりになりました。

\n

Google Cloud SDKから変更する

\n

gsutilコマンドの場合はsetmetaサブコマンドを使用します。

\n
gsutil setmeta -h 'Cache-Control:public, max-age=100' gs://web.timer.builderscon.io/all.css\nSetting metadata on gs://web.timer.builderscon.io/all.css...\nBadRequestException: 400 Invalid argument.
\n

ん？
\nよくよく考えたらログインしてないですね。プロジェクトのメンバーでないとファイルの変更ができないので、gcloudコマンドでログインします。

\n
$ gcloud auth login\nYour browser has been opened to visit:\n\n    https://accounts.google.com/o/oauth2/auth?XXXXXXXXXXXXXXXX\n\nSaved Application Default Credentials.\n\nYou are now logged in as [XXX.XXX@gmail.com].\nYour current project is [None].  You can change this setting by running:\n  $ gcloud config set project PROJECT_ID
\n

ログインが完了したら、もう一度メタデータを更新。

\n
$ gsutil setmeta -h 'Cache-Control:public, max-age=100' gs://web.timer.builderscon.io/all.css\nSetting metadata on gs://web.timer.builderscon.io/all.css...
\n

今度はうまくいったようです。書き換えたらcurlでアクセス。

\n
$ curl -v http://web.timer.builderscon.io/all.css 2>&1 | grep -i cache\n< Cache-Control: public, max-age=100
\n

意図したとおりになりました。

","timeToRead":6,"frontmatter":{"title":"Google Cloud Storageのキャッシュの設定を変更してみる","tags":null,"date":"July 06, 2016","featuredImage":null}}},"pageContext":{"slug":"/how-to-customize-cache-settings-of-google-cloud-storage/","previous":{"fields":{"slug":"/create-session-timer-of-builderscon/"},"frontmatter":{"title":"Buildersconのセッションタイマーを作った","tags":["Builderscon"]}},"next":{"fields":{"slug":"/learn-multi-thread-and-multiplexing/"},"frontmatter":{"title":"シングルスレッドな言語の並列化・マルチプロセス化についての暫定的な理解をまとめる","tags":["Nodejs","Performance","PHP"]}}}}, "staticQueryHashes": ["2585454260","2954598359"]}