レッドカーペットとの外部画像リンク

Question

私はredcarpet gemを使用してユーザー生成テキストをマークダウンし、外部リンク/画像ホストの画像を表示したいと考えています。これまでのところ、私はこのような何かを試してみました：</div>、id Sを注入するので

def markdown(text) 
    options = { ... } 
    extension = { ... } 
    text.gsub!(/(https?:\/\/[\S]*.jpg)/, '<img src="\1" width="100%">') 
    renderer = Redcarpet::Render::HTML.new(options) 
    markdown = Redcarpet::Markdown.new(renderer, extensions) 
    markdown.render(text).html_safe 
end 

しかし、私は、escape_htmlまたはfilter_htmlしたい、とクラスが台無しサイトを本当にすることができます。これにより、画像タグが削除されます。

HTMLを安全に保ちながら、外部イメージのレンダリングを行うより良い方法はありますか？

Answer 1

このような何か：

require "redcarpet" 
require "action_view" 

class HTMLBlockCode < Redcarpet::Render::HTML 
    include ActionView::Helpers::AssetTagHelper 

    def image(link, title, alt_text) 
    image_tag(link, title: title, alt: alt_text, width: "100%") 
    end 
end 

def markdown(text) 
    renderer = HTMLBlockCode.new 
    text.gsub!(/(https?:\/\/[\S]*.jpg)/, '![](\1)') 
    markdown = Redcarpet::Markdown.new(renderer) 
    markdown.render(text) 
end 

text = File.read("rc_test.md") 

puts markdown(text) 

これはあなたのイメージ要素にwidth="100%"属性を追加しますRedCarpetのカスタムイメージレンダラーを、インストールします。また、gsub呼び出しで、裸の画像リンクをマークダウン認識画像リンクに変換します。埋め込まれた画像のURLでこの結果は、次のようにレンダリングされている：

<img width="100%" src="http://www.gettyimages.pt/gi-resources/images/Homepage/Hero/PT/PT_hero_42_153645159.jpg" /> 

そして、あなたはどのような方法であなたの値下げ文書を変更する必要はありません。それは自動的においしい。