LoginSignup
7
4

More than 3 years have passed since last update.

[Rails6.0]Action Textで作成した内容をslimで表示する

Last updated at Posted at 2019-09-12

Action Textとは

Rails6からAction Textが追加され、とても手軽にリッチテキストエディタを実装できるようになりました。
導入に関しては多くの方が記事にされているのでここでは割愛させて頂きます。

このAction Textは、has_rich_textメソッドで指定したカラムにActionText::RichTextオブジェクトを保存します。
例えば以下のようなモデルがあったとき、

app/model/article.rb
class Article < ApplicationRecord
  has_rich_text :content
end

保存された内容は

<%= @article.content %>

というような形でHTMLとして取り出せます。

slimだとうまく表示されない?

これ、ERBなら綺麗に出力してくれるのですが、slimで

= @article.content

と書くとHTMLがそのまま文字として出力されてしまいます。

スクリーンショット 2019-09-12 22.01.37.png

こんなHTMLむき出しのままではとてもじゃないけど使えない!
ERBならHTMLをタグとして扱ってくれるので、ERBで書き直すしかないのかと思っていたのですが…

=ではなく==を使う

githubのissueによると、slimの=はHTMLの内容をエスケープして表示してくれるようです。

なのでこの場合は=ではなく==を使うことでHTMLの内容をエスケープせずに表示することができます。

== @article.content

スクリーンショット 2019-09-12 22.02.23.png

期待通りの結果になりました!

エスケープしなくて大丈夫なの?

HTMLをエスケープしてしまったら、XSSの脆弱性は大丈夫なの?と思ったので

<script>
  alert('XSS');
</script>

をフォームの入力に含めて保存してみました。
alertが表示されると思ったのですが…

スクリーンショット 2019-09-12 22.23.58.png

scriptタグはちゃんとエスケープしてくれます。なんで?
slimのREADMEを読んでみましたがイマイチ理由が分からず。どなたかコメントでご教授いただけると幸いです。

まとめ

兎にも角にもAction Textとslimを両立させることができて一安心です。

何か直すべき点、間違った記述があればコメント等で指摘していただければと思います。

参考文献

https://railsguides.jp/action_text_overview.html
https://tech.mof-mof.co.jp/blog/rails6-actiontext.html

7
4
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
4