かなり前に作ったアプリをGitHubに公開しています。時間が経過すると、This automated pull request fixes a security vulnerability (moderate severity).というメールがたくさん届きます。「vulnerability」は、脆弱性という意味です。
面倒でずっと放置していたのですが、実務では対応必須なので、アプリの方もしぶしぶ対応することにしました。
始めに、今回脆弱性対応を行うリポジトリの主な環境です。LaravelとVue.jsを使っています。
"devDependencies": {
"axios": "^0.26.0",
"bootstrap": "^4.6.1",
"browser-sync": "^2.27.7",
"browser-sync-webpack-plugin": "^2.3.0",
"core-js": "^3.21.1",
"cross-env": "^5.1",
"jquery": "^3.6.0",
"laravel-mix": "^6.0.43",
"laravel-mix-polyfill": "^2.0.0",
"lodash": "^4.17.21",
"popper.js": "^1.12",
"resolve-url-loader": "^5.0.0",
"sass": "^1.49.9",
"sass-loader": "^7.1.0",
"vue": "^2.6.14",
"vue-loader": "^15.9.8",
"vue-router": "^3.5.3",
"vue-template-compiler": "^2.6.14",
"vuex": "^3.6.2"
},
"dependencies": {
"vue-smoothscroll": "^0.2.0"
}
該当のリポジトリでnpm installを打つと、以下のようなメッセージが表示されます。
found 110 vulnerabilities (3 low, 57 moderate, 48 high, 2 critical)
run `npm audit fix` to fix them, or `npm audit` for details110件もの脆弱性を放置していました。criticalも2件あります。まずは、文最後の`npm audit` for detailsを見てnpm auditを実行してみます。
High Resource exhaustion in engine.io
Package engine.io
Patched in >=4.0.0
Dependency of browser-sync [dev]
Path browser-sync > socket.io > engine.io
More info https://github.com/advisories/GHSA-j4f2-536g-r55m
found 110 vulnerabilities (3 low, 57 moderate, 48 high, 2 critical) in 1264 scanned packages
run `npm audit fix` to fix 67 of them.
41 vulnerabilities require semver-major dependency updates.
2 vulnerabilities require manual review. See the full report for details.Highがリスクの大きさと、脆弱性の種類です。Packageが該当のパケージです。Patched inは、脆弱性が解消されているバージョンです。Dependency ofが使われているツールと環境です。[dev]の場合は、開発環境ですね。Pathの所は依存関係ですね。これが1つの脆弱性なので、自分の例では110件出力されました。run `npm audit fix` to fix 67 of them.
となっているので、npm audit fix を実行します。67件と言わず、全部直ってほしいところです。
+ axios@0.26.0
added 55 packages from 53 contributors, removed 31 packages, updated 23 packages and moved 1 package in 43.005s
43 packages are looking for funding
run `npm fund` for details
fixed 67 of 110 vulnerabilities in 1264 scanned packages
2 vulnerabilities required manual review and could not be updated
2 package updates for 41 vulnerabilities involved breaking changes
(use `npm audit fix --force` to install breaking changes; or refer to `npm audit` for steps to fix these manually)予告通り67件の脆弱性が解消されたようです。npm audit fix –forceを打つと、強制的にアップデートがかかりそうですが、npm auditを実行してみます。
High ReDOS in IS-SVG
Package is-svg
Dependency of laravel-mix [dev]
Path laravel-mix > optimize-css-assets-webpack-plugin > cssnano >
cssnano-preset-default > postcss-svgo > is-svg
More info https://github.com/advisories/GHSA-r8j5-h5cx-65gg laravel-mixにたくさんの脆弱性が残っているようです。公式のドキュメントを参考にして、アップデートを行なっていきます。
npm install laravel-mix@latest
+ laravel-mix@6.0.43
added 225 packages from 166 contributors, removed 403 packages, updated 316 packages, moved 22 packages and audited 1044 packages in 172.987s
81 packages are looking for funding
run `npm fund` for details
found 4 vulnerabilities (1 moderate, 3 high)
run `npm audit fix` to fix them, or `npm audit` for details一気に脆弱性の数が減りました。ただし、ビルド系のパッケージをアップデートしたので、アップデート前の通り開発環境が使えるのかどうか確認してみます。
npm run watch-poll
> @ watch-poll /var/www/html/match/laravel_match
> mix watch -- --watch-options-poll=1000
Error: You are using an unsupported version of Node. Please update to at least Node v12.14エラーになりました。Node.jsのバージョンが古いようです。自分のローカル環境では、Dockerを使用しているので、Dockerfileを更新します。
FROM php:7.4.1-fpm
COPY install-composer.sh /
RUN apt-get update \
&& apt-get install -y wget git unzip libpq-dev \
&& : 'Install Node.js' \
&& curl -sL https://deb.nodesource.com/setup_12.x | bash - \
&& apt-get install -y nodejs \
&& : 'Install PHP Extensions' \
&& docker-php-ext-install -j$(nproc) pdo_mysql \
&& : 'Install Composer' \
&& chmod 755 /install-composer.sh \
&& /install-composer.sh \
&& mv composer.phar /usr/local/bin/composer
WORKDIR /var/www/html/matchNode.jsのイメージを持ってくる行を10から12に変更しました。本当は12.14以上になるように指定するのが、正確なのですが、面倒なのでいったんこれでDockerの環境をビルドしてみます。
docker compose up --build
docker-compose exec XXX bash
# node -v
v12.22.2イメージを再度持ってくるので、–buildのオプションを付けます。node -vでバージョンを確認したところ12.22.2でした。結果オーライです。続いて公式のドキュメントに沿って、npmのscriptsを更新します。以下のコードが更新前です。
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
},更新後以下の通りです。実行するコマンドは同じですが、すっきりしました。
"scripts": {
"dev": "npm run development",
"development": "mix",
"watch": "mix watch",
"watch-poll": "mix watch -- --watch-options-poll=1000",
"hot": "mix watch --hot",
"prod": "npm run production",
"production": "mix --production"
},続いてwebpack.mix.jsも更新します。
mix.js('resources/js/app.js', 'public/js')mix.js('resources/js/app.js', 'public/js').vue().vue()を追加するだけです。それでは、もう一度開発環境を立ち上げてみます。
npm run watch-poll
> @ watch-poll /var/www/html/match/laravel_match
> mix watch -- --watch-options-poll=1000
Additional dependencies must be installed. This will only take a moment.
Running: npm install vue-loader@^15.9.7 --save-dev --legacy-peer-deps
Finished. Please run Mix again.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ watch-poll: `mix watch -- --watch-options-poll=1000`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ watch-poll script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2022-03-04T06_17_06_626Z-debug.logエラーで実行できませんでしたが、もう一回実行してねというメッセージが出ました。再度npm run watch-pollを実行したところ、開発環境を立ち上げられました。再びnpm auditを実行してみます。
=== npm audit security report ===
# Run npm install --save-dev resolve-url-loader@5.0.0 to resolve 3 vulnerabilities
SEMVER WARNING: Recommended action is a potentially breaking change丁寧に解決のためのコマンドを提示してくれましたので、実行してみます。
+ resolve-url-loader@5.0.0
added 2 packages from 1 contributor, removed 27 packages, updated 3 packages, moved 1 package and audited 1034 packages in 14.333s
86 packages are looking for funding
run `npm fund` for details
found 1 high severity vulnerability
run `npm audit fix` to fix them, or `npm audit` for detailsあと1件のところまで来ました。npm auditを実行してみます。
High Uncaught Exception in engine.io
Package engine.io
Patched in >=4.1.2
Dependency of browser-sync [dev]
Path browser-sync > socket.io > engine.io
More info https://github.com/advisories/GHSA-273r-mgr4-v34f browser-sync に使われているパッケージでした。ただ、browser-sync自体は最新のバージョン2.27.7で、解決は難しそうでした。以下のようにresolutions を入れてみたのですが、開発環境自体立ち上がらなくなってしまいました。
ここまでで数時間かかり、これ以上作業するは無理そうだったので放置することにしました。browser-syncの更新に期待します…
// NGだったpackage.jsonの記述
"resolutions": {
"engine.io": "4.1.2"
},最後まで読んでいただいてありがとうございました。脆弱性の対応は必須の作業だったりしますが、地味に時間がかかってしまうことがあります。何かエラー解決のヒントになればうれしいです。
コメント