Ruby on RailsでRedcarpetを使ってみる

ドキュメントをHTMLで

作成中のグループウェアに、UIkitのHTMLエディタを使用しています。
これまではWordなどのアプリケーションで作成していたドキュメントを添付したりダウンロードしたりする必要がありました。
頻度が少なければさほど気にならないのかもしれませんが、数十名分のレポートを確認する場合などは結構ストレスを感じます。

レポートなどの文書を、Markdown形式で作成して、ブラウザ上で直接閲覧できるようにすることで、グループウェアへの添付やダウンロードなどの煩雑な作業を少しでも減らしたいと考えています。また、テキストデータ化されますので、キーワードによる検索などの便利機能を追加することも容易にできそうです。

MarkdownエディタはUIkitのエディタを採用

UIkitのHTMLエディタはMarkdown形式で入力し、プレビューを見ながら編集できる点も気に入っている理由の1つです。
UIkitのページではオプション等の説明がないのですが、依存しているライブラリmarkedのドキュメントを見ると、デフォルトではテーブルの利用有無や、HTMLのサニタイズ（JavaScriptのコードを実行されないようscriptタグを無効化してくれたり・・・）の利用有無などの設定が可能です。

markedのドキュメントによるとデフォルトでは、サニタイズはfalseとなっていましたが、UIkitのHTML Editorで設定されているオプションを確認したところ、デフォルトのパラメータでサニタイズが有効となっているようでした。（どこで有効に設定されたのかまで追いかけていません。すみません。）

Markdownの表示にはRedcarpetを採用

Markdownで入力する際は、JavaScriptベースの入力フォームとプレビューとなりますが、データ入力後の表示にはRedcarpetを使用したいと考えています。
RedcarpetはRubyで作成されたMarkdownのパーサーですので、Railsのアプリケーションに採用するには良いのかな・・・と思い採用しています。

やはりどのパーサーにも言えることかもしれませんが微妙に互換性がないので、入力時（プレビュー）と実際に表示する際とで若干差が生じてしまいます。
しばらく利用して、互換性の課題が解決できないようならmarkedを利用することも考えたいと思います。

RedcarpetをRailsに導入の際、初期状態ではテーブルやコードブロック、サニタイズにも対応していなかったので、今回適用した設定について紹介いたします。

# View

md_to_html(@document.content, {tables: true, fenced_code_blocks: true}, {filter_html: true})

# Helper

module MarkdownHelper
  def md_to_html(mk_code, extentions={}, render_options={})
    render = Redcarpet::Render::HTML.new(render_options)
    Redcarpet::Markdown.new(render, extentions).render(mk_code).html_safe
  end
end

ポイントは、extentionsとrender_optionsとがあるところでしょうか。
Redcarpet::Render::HTMLクラスにはサニタイズのためのオプション{filter_html: true}をパラメータとして設定しています。また、テーブルやコードブロックを利用するにはRedcarpet::Markdownクラスに拡張する機能を指定するようです。今回はテーブルとコードブロックを有効にしました。

開発中のグループウェアの文書管理機能は文書をMarkdownでも作成できるようにしており、次の画像は文書管理機能で作成中の内定者向けC言語研修資料です。

編集画面

プレビュー可能なモードで編集している画面です。左側が入力フォームになっており、右側がプレビューです。

照会画面

UIkitのHTMLエディタ（Markdown）を利用して入力した情報を、Redcarpetで表示しています。
コードブロックも表示されました。