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

npm インストール xss

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

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

オプション = {
    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(コンテンツ、オプション)