Lighthouse で JavaScript のセキュリティ脆弱性が検出された際の対処法

ブログ運営と改善

Includes front-end JavaScript libraries with known security vulnerabilities の解決方法

この記事は約 4 分で読めます。

ユウキです。

モバイル表示速度を改善するために Lighthouse を利用していると、他の項目も気になりますよね。

今回は、JavaScript のセキュリティ脆弱性が検出された際の対処法を紹介します。ちなみに解決すると少しですがモバイル表示速度も改善できます。

使用している WordPress テーマは TCD「MAG」ですが、他のテーマでも同じ対処法で解決できると思います。

Lighthouse で JavaScript の脆弱性を指摘される

Includes front-end JavaScript libraries with known security vulnerabilities 2 vulnerabilities detected

(既知のセキュリティ脆弱性 2 の脆弱性が検出されたフロントエンド JavaScript ライブラリが含まれています)

Some third-party scripts may contain known security vulnerabilities that are easily identified and exploited by attackers.

(一部のサードパーティスクリプトには、攻撃者が簡単に特定して悪用できる既知のセキュリティの脆弱性が含まれている場合があります。)

Library Version(ライブラリバージョン):jQuery@1.12.4

Vulnerability Count(脆弱性の数):2

Highest Severity(最高の重大度):Medium(中)

問題の jQuery@1.12.4 はどこにある?

今回、指摘を受けている問題の箇所は、テーマファイルではなく、サーバーの WordPress ファイル内にあります。

エックスサーバーを利用されている場合は、ファイル管理(WebFTP)からドメイン選択後、

【public_html】→【wp-includes】→【js】→【jquery】の順で進むと見つかる【jquery.js】というファイルが該当箇所となります。

エックスサーバー WebFTP  内の jquery.js ファイルの場所

問題の対処法

指摘されている問題は、使用中の jQuery のバージョンに脆弱性があることなので、最新バージョンを確認してファイルを交換することで解決できます。

jQuery の最新バージョンは、公式の jQuery ライブラリーサイトを確認しましょう。

jQuery の最新バージョンを確認

v3.5.1 と書かれている部分がバージョンで、 jQuery の最新バージョンを確認したら対処していきますが、方法は2つあります。

functions.php で対処する方法

functions.php を編集して対処する場合は、WordPress 管理画面左のメニューバーから【外観】→【テーマエディター】へ移動して、functions.php を開きます。

ファイルの末尾に次のコードをコピー&ペーストして完了です。

PHP
function load_js() {
	if ( !is_admin() ) {
		wp_deregister_script('jquery');
		wp_enqueue_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js', array(), NULL);
	}
}
add_action('init', 'load_js');

functions.php にコードを追加する

ちなみに jquery.js と一緒に jquery-migrate.min.js も無効化されますが、jquery-migrate.min.js の役割が古いプラグインや機能などの動作保険なので、基本的には不要となり、サイトの動作上は問題ありません。

この方法は簡単に対処できるのでおすすめです。

FTP で対処する方法

functions.php で対処できない場合は、FTP を編集して対処します。

先に jquery.js ファイルを公式サイトや Google のライブラリからコピーして、Notepad++ などのエディタを使い、ファイルを作成します。

次に該当箇所を確認したサーバーの WordPress ファイルまで【public_html】→【wp-includes】→【js】→【jquery】の順で進み、用意したファイルをアップロードして完了です。

エックスサーバーの WebFTP でjquery.js ファイルをアップロードする

テキストエディタを使ったことがない方はこちらが使いやすいですよ。

注意点

WordPress テーマを編集した場合はテーマのアップデート時に、FTP を編集した場合は WordPress のアップデート時にカスタマイズした内容がリセットされてしまいます。

対処法として、子テーマを使ってカスタマイズされている方がいるようですが、サイトの表示速度をわざと遅くしているようなものなので、個人的には Evernote や Notepad++ などを使ってメモを残し、アップデート時に都度編集することをおすすめします。

なぜ jQuery@1.12.4 が使われているのか?

そもそも、なんで脆弱性のあるコードが今も使われているのか?

理由は WordPress テーマやプラグインの中にそれらのバージョンを使用しているものがあるためで、jquery-migrate.min.js も同じような意図で使われているようです。

様々なユーザーのニーズに応えるための対応ということだと思いますが、変更後、利用している TCD テーマやプラグインで不具合はありませんので、おそらくほとんどの方にとって無効化による影響や問題はないかと思います。

まとめ

今回は、jQuery@1.12.4 のセキュリティ脆弱性の問題指摘を解決しました。

対応は非常に簡単ですし、モバイル表示速度の改善も見込めるので、ぜひお試しください。

他にも不要なコードを削除したい場合や、サイトの表示速度を改善させたい場合はこちらの記事を参考にどうぞ。

では今回はこの辺で。

ありがとうございました!

この記事のタイトルとURLをコピーする

関連記事

  1. TCD は SEO に弱いのか? H タグの使い方と修正方法

    ブログ運営と改善

    TCD は SEO に弱いのか? H タグの使い方と修正方法

    ユウキです。「 TCD のテーマって SEO 対策で不利って聞いた…

  2. 画像が重いなら EWWW Image Optimizer で解決

    ブログ運営と改善

    画像が重くて表示が遅いなら EWWW Image Optimizer で解決

    ユウキです。サイト表示速度が遅い場合、画像が重いことが原因の可能性…

  3. WordPress の目次デザインをおしゃれにカスタマイズ

    ブログ運営と改善

    WordPress の目次デザインをおしゃれにカスタマイズ

    ユウキです。ブログのユーザビリティ(使いやすさ、見やすさ)を改善し…

  4. Autoptimize で CSS を軽量化してモバイル表示速度を高速化

    ブログ運営と改善

    Autoptimize で CSS を軽量化してモバイル表示速度を高速化

    ユウキです。今回は、Autoptimize を使ってコードの最適化…

  5. WordPress の head 内を整理してモバイル表示速度を改善する

    ブログ運営と改善

    WordPress の head 内を整理してモバイル表示速度を改善する

    ユウキです。今回は WordPress でつくった Web サイト…

  6. WP Mail SMTP で Contact Foam 7 のメールが届かない問題を解決

    ブログ運営と改善

    WP Mail SMTP で Contact Foam 7 のメールが届かない問題を解決

    ユウキです。コンタクトフォーム 7 などで設定されている自動送信メ…

管理人
Blog de Affili の管理人ユウキ

ユウキと申します。

経歴は飲食サービス業のマネージャー、プロップトレーダー、オンラインサロン講師などをしていましたが、組織や人間関係にうんざりして、やりたくないことを捨てました。

ブログアフィリエイトを始めたばかりの頃は 1 年で利益 8000 円。(しょぼ笑)

その後、システム構築やマーケティングを学んで、 3 ヶ月で作った仕組みから 698 万円の売り上げを達成しました。

現在は個人向けにオウンドメディア構築やウェブマーケティングをコンサルしています。

稼いでも時間や人間関係に縛られていたらしんどいだけ。ブログでそこそこ稼いで、ゆったり自分らしく暮らしましょう。

最近の記事
  1. WordPress の目次デザインをおしゃれにカスタマイズ
  2. WP Mail SMTP で Contact Foam 7 のメールが届かない問題を解決
  3. Contact Form 7 の設定とカスタマイズを解説
  4. robots.txt is not valid 4 errors found の解決方法
  5. WordPress のセキュリティ対策をするなら SiteGuard WP Plugin
惹きつけるブログはデザインから生まれる
WordPress テーマ Be(TCD076)のレビュー
PAGE TOP