ホームページ  >  に質問  >  本文

Vue3 で Markdown を HTML として安全に表示する

つまり、私が作成した「カスタム マークダウン」を含む文字列のセットがあります。私の目的は、これらの文字列をフロントエンドで HTML にレンダリングすることです。次の文字列があるとします:

リーリー

私は次のようなことを期待していました:

リーリー

ここで行うことは、いくつかの基本的な正規表現を使用することです:

リーリー

これは正常に動作し、正しい文字列を返します。次に、印刷するには、テンプレートで次のようにします:

リーリー

私の問題は、ある時点でユーザーがこれらの文字列を自分で入力できるようにして、これを他のユーザーにも表示できるようにしたいということです。したがって、確かに XSS 攻撃に対して脆弱です。

これを回避する代替手段はありますか? https://github.com/Vannsl/vue-3-sanitize を調べてみると、divspanbr# が許可されているようです。 ## タグに対して適切なアプローチを使用し、すべてのタグのプロパティを class のみを許可するように設定しています。これで十分安全ですか?他に何かすべきことはありますか?

この場合、バックエンドでクリーンアップする必要はないと思いますね。つまり、サーバー内の文字列に

が含まれていたとしても、Web ブラウザーは悪意のあるコードを実行できません。

P粉616383625P粉616383625283日前362

全員に返信(1)返信します

  • P粉323050780

    P粉3230507802024-01-11 11:39:21

    私の問題は、ある時点でユーザーがこれらの文字列を自分で入力できるようにしたいことです。

    それでは、投稿で言及した文字列をユーザーが入力するためのフォーム入力はありますか? 「はい」の場合、私の提案は、ユーザー入力をバックエンドに渡す前に、まずユーザー入力をサニタイズできることです。したがって、バックエンド自体に悪意のあるコードを保存すべきではありません。

    したがって、 string.replace() メソッドを使用します。最初に元の悪意のあるタグを置き換えることができます。入力文字列から