Rails6で作った自作アプリのGitHubのページを見ていたら、以下のセキュリティアラートが出ていました。
セキュリティレベルは「moderate security」、つまり中程度の危険度ということです。
ずっとアラートが出続けているのは気持ち悪いので早急に対処することにしました。
Railsアプリのバージョンは以下のとおりです。
セキュリティレベルは「moderate security」、つまり中程度の危険度ということです。
ずっとアラートが出続けているのは気持ち悪いので早急に対処することにしました。
Railsアプリのバージョンは以下のとおりです。
- Rails 6.0.0
- Webpacker 4.2.0
調査
まず、serialize-javascriptとは何なのかを調べます。
セキュリティアラートのページに対象のファイルが書いてありました。
どうやらyarnでインストールされたパッケージのようです。
serialize-javascriptがどのパッケージに依存しているかを調べるには以下のコマンドを実行します。
セキュリティアラートのページに対象のファイルが書いてありました。
どうやらyarnでインストールされたパッケージのようです。
serialize-javascriptがどのパッケージに依存しているかを調べるには以下のコマンドを実行します。
$ yarn why serialize-javascript yarn why v1.17.3 [1/4] 🤔 Why do we have the module "serialize-javascript"...? [2/4] 🚚 Initialising dependency graph... [3/4] 🔍 Finding dependency... [4/4] 🚡 Calculating file sizes... => Found "serialize-javascript@1.9.1" info Reasons this module exists - "@rails#webpacker#compression-webpack-plugin" depends on it - Hoisted from "@rails#webpacker#compression-webpack-plugin#serialize-javascript" - Hoisted from "@rails#webpacker#terser-webpack-plugin#serialize-javascript" info Disk size without dependencies: "24KB" info Disk size with unique dependencies: "24KB" info Disk size with transitive dependencies: "24KB" info Number of shared dependencies: 0 ✨ Done in 0.81s.
Webpackのcompression-webpack-pluginをインストールするときに一緒にインストールされたようです。
また、同じくWebpackのterser-webpack-pluginとも依存関係があるようです。
Webpack（Webpacker）はRails6から標準導入されるようになったので、Rails6で作られたアプリはすべてserialize-javascriptを使用しているということになります。
yarn.lockの中も見てみます。
また、同じくWebpackのterser-webpack-pluginとも依存関係があるようです。
Webpack（Webpacker）はRails6から標準導入されるようになったので、Rails6で作られたアプリはすべてserialize-javascriptを使用しているということになります。
yarn.lockの中も見てみます。
...
compression-webpack-plugin@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/compression-webpack-plugin/-/compression-webpack-plugin-2.0.0.tgz#46476350c1eb27f783dccc79ac2f709baa2cffbc"
integrity sha512-bDgd7oTUZC8EkRx8j0sjyCfeiO+e5sFcfgaFcjVhfQf5lLya7oY2BczxcJ7IUuVjz5m6fy8IECFmVFew3xLk8Q==
dependencies:
cacache "^11.2.0"
find-cache-dir "^2.0.0"
neo-async "^2.5.0"
schema-utils "^1.0.0"
serialize-javascript "^1.4.0"
webpack-sources "^1.0.1"
...
serialize-javascript@^1.4.0, serialize-javascript@^1.7.0:
version "1.9.1"
resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-1.9.1.tgz#cfc200aef77b600c47da9bb8149c943e798c2fdb"
integrity sha512-0Vb/54WJ6k5v8sSWN09S0ora+Hnr+cX40r9F170nT+mSkaxltoE/7R3OrIdBSUv1OoiobH1QoWQbCnAO+e8J1A==
...
terser-webpack-plugin@^1.3.0, terser-webpack-plugin@^1.4.1:
version "1.4.1"
resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-1.4.1.tgz#61b18e40eaee5be97e771cdbb10ed1280888c2b4"
integrity sha512-ZXmmfiwtCLfz8WKZyYUuuHf3dMYEjg8NrjHMb0JqHVHVOSkzp3cW2/XG1fP3tRhqEqSzMwzzRQGtAPbs4Cncxg==
dependencies:
cacache "^12.0.2"
find-cache-dir "^2.1.0"
is-wsl "^1.1.0"
schema-utils "^1.0.0"
serialize-javascript "^1.7.0"
source-map "^0.6.1"
terser "^4.1.2"
webpack-sources "^1.4.0"
worker-farm "^1.7.0"
...インストールされているserialize-javascriptのバージョンは1.9.1のようですね。
対処
serialize-javascriptのバージョンが古いことがわかったので、バージョンアップします。
以下のコマンドを実行します。
以下のコマンドを実行します。
$ yarn upgrade serialize-javascript@latest yarn upgrade v1.17.3 [1/4] 🔍 Resolving packages... [2/4] 🚚 Fetching packages... [3/4] 🔗 Linking dependencies... warning " > webpack-dev-server@3.8.0" has unmet peer dependency "webpack@^4.0.0". warning "webpack-dev-server > webpack-dev-middleware@3.7.0" has unmet peer dependency "webpack@^4.0.0". [4/4] 🔨 Rebuilding all packages... success Saved lockfile. success Saved 1 new dependency. info Direct dependencies └─ serialize-javascript@2.1.1 info All dependencies └─ serialize-javascript@2.1.1 ✨ Done in 7.97s.
「yarn upgrade <package>@latest」で指定したパッケージを最新バージョンにしてくれます。
「@latest」ではなく「@x.x.x」とすることで任意のバージョンを指定することもできます。
バージョンアップされたか見てみましょう。
「@latest」ではなく「@x.x.x」とすることで任意のバージョンを指定することもできます。
バージョンアップされたか見てみましょう。
$ git diff
diff --git a/package.json b/package.json
index 2d079b9..c91d7b9 100644
--- a/package.json
+++ b/package.json
@@ -4,6 +4,7 @@
"dependencies": {
"@rails/actiontext": "^6.0.0",
"@rails/webpacker": "^4.0.7",
+ "serialize-javascript": "^2.1.1",
"trix": "^1.0.0"
},
"devDependencies": {
diff --git a/yarn.lock b/yarn.lock
index 1617c77..28315e5 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6030,6 +6030,11 @@ serialize-javascript@^1.4.0, serialize-javascript@^1.7.0:
resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-1.8.0.tgz#9515fc687232e2321aea1ca7a529476eb34bb480"
integrity sha512-3tHgtF4OzDmeKYj6V9nSyceRS0UJ3C7VqyD2Yj28vC/z2j6jG5FmFGahOKMD9CrglxTm3tETr87jEypaYV8DUg==
+serialize-javascript@^2.1.1:
+ version "2.1.1"
+ resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-2.1.1.tgz#952907a04a3e3a75af7f73d92d15e233862048b2"
+ integrity sha512-MPLPRpD4FNqWq9tTIjYG5LesFouDhdyH0EPY3gVK4DRD5+g4aDqdNSzLIwceulo3Yj+PL1bPh6laE5+H6LTcrQ==
+
serve-index@^1.9.1:
version "1.9.1"
resolved "https://registry.yarnpkg.com/serve-index/-/serve-index-1.9.1.tgz#d3768d69b1e7d82e5ce050fff5b453bea12a9239"既存の1.9.1がバージョンアップされたわけではなく、2.1.1が新しくインストールされたように見えます…
一応、この状態でコミットしてみます。
セキュリティアラートが消えました！
やや腑に落ちない気もしますが、消えたのでよしとしましょう😅
一応、この状態でコミットしてみます。
セキュリティアラートが消えました！
やや腑に落ちない気もしますが、消えたのでよしとしましょう😅
まとめ
Rails6からWebpackerが標準導入され便利になった反面、それに起因するエラーや警告も増えている気がします。
今回のようにエラーや警告に対処していくのは大変ですが、これからもしっかり勉強して行きたいと思います。
間違いやご指摘等ありましたらコメントしていただけると嬉しいです。
今回のようにエラーや警告に対処していくのは大変ですが、これからもしっかり勉強して行きたいと思います。
間違いやご指摘等ありましたらコメントしていただけると嬉しいです。
JWTについて
【React】React イチから学習《発展編》
【React】React イチから学習《基礎編》
強力なUIコンポーネントライブラリ「MUI（Material-UI）」について《トラブルシューティング編》
強力なUIコンポーネントライブラリ「MUI（Material-UI）」について《テーマ・スタイリング編》
強力なUIコンポーネントライブラリ「MUI（Material-UI）」について《コンポーネント編》
強力なUIコンポーネントライブラリ「MUI（Material-UI）」について《概要編》
インフラストラクチャ自動化ツール「Terraform」について《ベストプラクティスとトラブルシューティング編》
【CSS+JS】背景画像の視差効果（パララックス）を実装する方法
【CSS+JS】モーダルウィンドウを表示しその中にYouTube動画を動的に埋め込む
【Rails】アプリケーションサーバー「Unicorn」の基本情報と実装方法
【Git】マージにおけるfast-forwardとnon-fast-forwardの違い
MySQL Workbenchでリモートサーバー上のMySQLにSSH接続する方法【接続できない場合の対処法あり】
【Rails】忘れがちなルーティングの書き方を総復習
【Rails】忘れがちなGemfileの書き方を総復習
【Rails】M1チップ搭載MacでRuby on Railsの開発環境構築