Question

我正在使用redcarpet gem来标记用户生成的文本，并希望显示外部链接/图像主机的图像。到目前为止，我尝试过这样的事情：

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，因为注入</div>，id和类可能会使网站陷入困境。这将删除图像标记。

在保持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)

这会在RedCarpet上安装自定义图像渲染器，为您的图像元素添加width="100%"属性。它还会在gsub调用中将裸图像链接转换为markdown识别的图像链接。这会导致嵌入的图像网址呈现如下：

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

您不必以任何方式更改降价文件;它自动美味。

Markdown外部图像链接与Redcarpet

1 个答案: