author: hondazn
JS をゼロにしたつもりが、Cloudflare が配っていた
このブログはの
を
にしていて、クライアント JS を
配りません。ビルド
物を
grep して <script> がであることも
していました。
ところがの
には JS が
いました。Cloudflare が
に
いたものです。
で
た
に書きます。
気づいたきっかけ
の
を切り替える
を作って、デプロイした
の
でした。切替 UI を
ないはずの
/about に、スクリプトがある。
の
物には
ものです。
# 手元のビルド
$ grep -ro '<script' dist/ | wc -l
0
# 本番
$ curl -s https://blog.jozo.beer/about/ | grep -o '<script' | wc -l
1
ファイルを
いるつもりで、
ものが
いました。
入っていたもの
ありました。
| 注入 | 対象 | 中身 |
|---|---|---|
| Email Address Obfuscation | メールらしき | email-decode.min.js を1本 |
| JavaScript Detections | インライン |
どちらもで
にした
がありません。
は
アップ
に
で
になる
でした。
1つめ — コード例が書き換えられていた
Email Address Obfuscation は、の
アドレスを
に
て
ボットから
です。
な
に
ます。
は、このブログに
の
が
も
ことでした。
ソースを
して
したのは、
に
たこれだけです。
<code>github.com@evil.com</code> のような見た目の似たホストが弾かれます
として
た
物の
で、
<code> のにあります。Cloudflare はこれを
アドレスと
して、こう
ていました。
<a href="/cdn-cgi/l/email-protection" class="__cf_email__"
data-cfemail="7a1d130e120f18541915173a1f0c131654191517">[email protected]</a>
が
になり、JS を
いる
には
[email protected] とされます。
を
たい
で、
の
が
ない。
に
される
の
があります。
<script> <noscript> <textarea> <xmp> <head>、それと HTML 。
<code> はいません。
が
アドレスを
として
と、
ます。
2つめ — ETag が剥がされていた
もうの JavaScript Detections は、ボット
のための
です。
に
920 バイト
ます。
の
を
と、
ました。
は、Bot Fight Mode を
いる
はこれを
で
にできないこと。もう
は、これ
では
しないこと。
js_detection.passed を WAF カスタムルールを
作って
ます。そのルールが
なら、
に 920 バイト
だけです。
めが
のは
いいとして、
のほうが
ものでした。
にこう
てあります。
Enabling JavaScript Detections (JSD) will strip ETags from HTML responses where JSD is injected.
すると、そのとおりでした。
# HTML には ETag が無い
$ curl -sI https://blog.jozo.beer/blog/gh-img/ | grep -iE 'etag|cache-control'
cache-control: public, max-age=0, must-revalidate
# 同じサイトのアセットには付いている
$ curl -sI https://blog.jozo.beer/favicon.svg | grep -iE 'etag|cache-control'
cache-control: public, max-age=14400, must-revalidate
etag: "f46e90f224a1df98b3114a0c9c8956da"
HTML は max-age=0, must-revalidate なので、サーバに
合わせる
です。ETag があれば
304 Not Modified でます。
れていると、
合わせるたびに
を
直させられます。
で gzip
35KB。
のたびに、これを
です。
を
にしているサイトで、
でした。
止め方
ボードで
に
こともできますが、JavaScript Detections は Bot Fight Mode ごと
ことになります。
が
の
ジトリに
ないのも
が
。
とも
Cache-Control に no-transform があればされません。これは
に
されています。Cloudflare Pages は
_headers を
ので、
ジトリの
で
します。
/
Cache-Control: public, max-age=0, must-revalidate, no-transform
/about/
Cache-Control: public, max-age=0, must-revalidate, no-transform
/blog/
Cache-Control: public, max-age=0, must-revalidate, no-transform
/blog/*
Cache-Control: public, max-age=0, must-revalidate, no-transform
は Pages の
に
no-transform をただけです。アセットには
いません。
/* でに
、Pages が
max-age=14400 をして
の
シュを
ます。
として Cloudflare の HTML・
が
ます。Rocket Loader、Polish、Mirage。このサイトは CSS を
にインライン
し、
も webp に
済みなので、
ものはありませんでした。
結果
| 0 | ||
| 1本 | 0 | |
[email protected] | github.com@evil.com | |
| HTML の ETag | 304 を | |
| アセットの | max-age=14400 |
はじめた
は「JS を
たくない」でした。
に
たのは、ETag が
が
304 でようになったことです。
手元の成果物を見ても、本番は分からない
の
はこれに
ます。
dist/ の <script> をても、
が
のことは
ません。CDN は
で HTML を
ます。
と
、
で。
は
の URL に
curl をところまで
。それだけの
でした。