Help us understand the problem. What is going on with this article?

Qiita Markdownのコードハイライト部分にXSS脆弱性

More than 5 years have passed since last update.

はじめてQiitaに日記を投稿します。よろしくお願いします。

先日友人から「レポートを生成するためにQiita Markdownを使っているが、どこかにXSSがある気がする」という話を聞き、これは面白そうだとQiitaを覗きに来てみると、投稿画面にはプレビュー機能が付いているようです。Qiita Markdownをインストールする手間が省けたぞと喜んだあと、Qiita Markdownには一体どんな追加機能があるのだろうかとGoogleというサイトで検索して調べました。

技術系の記事を投稿するためのサービスなだけあって、真っ先にコードハイライトするための記法が見つかったので、それをQiitaの投稿ページに入力してみました。

```py
print('test')
~```
print('test')

するとプレビュー画面には等幅フォントで入力した文字列が綺麗にハイライトされて表示されました。どのような方法でコードハイライトを行っているのか気になったので、HTMLのソースコードを見てみることにしました。

<div class="code-frame" data-lang="py">
  <div class="highlight">
    <pre>
      <span class="k">print</span>
      <span class="p">(</span>
      <span class="s">'test'</span>
      <span class="p">)</span>
 ...

書式が違う文字ごとにspanとclassでうまくスタイルを変更しているようです。ここで私はdata-langという属性が存在することを発見し、もしかしてと思いながら編集画面に次のような文字列を入力してみました。ここまでの間数分だったと思います。

```py"onmouseover="alert(1)
print('test')
~```

するとあら不思議、プレビュー画面のコードの上をマウスカーソルが通過するたびにアラート画面が表示されます。data-lang内の文字列のエスケープに不具合があり、スクリプトが実行されてしまう状態だったのです。

しばらくの間、他にも似たような不具合がないか調べたところ、コードハイライトの言語設定だけではなく、ファイル名の指定部分にも似たような不具合があることを発見しました。

これらの不具合をQiitaのサポートに報告すると、すぐに対応が始まりQiita Markdownのリポジトリには修正版がコミットされました。またしばらくの後、サポートからQiitaのサービス側でも修正が終わったという内容の返事を頂きました。

Qiita Markdownのリポジトリを見ると、フィルタの適用の順番に間違いがあったようです。直接HTMLやJavaScriptを出力するようなページではエスケープミスが発生しやすいので注意しましょう。

以上で今日の日記を終わりにします。


この日の出来事はQiita Markdownのgithubリポジトリからも見ることが出来ます。
CHANGELOG.md - Qiita Markdown

xrekkusu
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away