1

我在 Rails 中创建博客，我决定使用 Redcarpet 在 Markdown 中生成博客内容。问题是我无法渲染图像。

我尝试了以下降价语法： ![test](/image.png)

我也尝试过使用 html 图片标签： <img src="/image.png">

我什至尝试过嵌入 Ruby 图像标签： <%= image_tag "image.png"%>

我的图像正确位于 app/assets/images 文件夹中。它与 Redcarpet 中的选项或我的路径名有关吗？使用我在网上找到的示例，我使用了以下辅助方法

def markdown(text)
  options = {

    fenced_code_blocks: true,
    no_intra_emphasis:true,
    lax_html_blocks: true
  }

  extensions = {
    autolink:           true,
    superscript:        true,
    disable_indented_code_blocks: true
  }

  renderer = Redcarpet::Render::HTML.new(options)
  markdown = Redcarpet::Markdown.new(renderer, extensions)

  markdown.render(text).html_safe
end

我的 show.html.erb 文件如下所示：

<div class="container-fluid">
<h3><%= @post.title %></h3>
<%=@post.created_at.to_date%>
<p>
<%= markdown(@post.text)%>
<p>
<br>
<%= link_to 'Back to all posts.', posts_path%>
</div>
4

2 回答 2

2

我能够找到解决方案。我花了很多时间尝试那些不起作用的教程，所以要小心。你最好的资源是 Redcarpet docs 和 Paperclip docs。

本质上，您需要使用回形针 gem 创建一个指向图像的外部链接，并将其插入到 markdown 表单中，如下所示：

![my image](/system/images/images/000/000/004/original/1.png?1419796218)

该过程如下所示：

  1. 安装并实现 redcarpet 来渲染 markdown
  2. 安装并实现回形针来存储图像并创建可用于降价的外部链接。
    • 注意：我创建了一个单独的“图像”模型来存储图像，但您可以将图像附加到现有模型，例如帖子。我更喜欢创建一个单独的图像模型并让每个实例化图像存储一个图像。根据我的经验，当尝试将多个图像附加到单个实例化对象（例如“帖子”）时，它会变得有点混乱。
  3. 从图片中获取链接。为了做到这一点，我在我的 rails 应用程序中创建了一个图像显示页面，然后使用该页面查看不同的图像大小及其各自的 url：

在视图/图像/show.html.erb 中：

<p> Normal image size url: <%=@image.image.url%> </p>
<p><%= image_tag @image.image.url %></p>

<p> Large image Size url: <%=@image.image.url(:large)%> </p>
<p><%= image_tag @image.image.url(:large) %></p>

上面的代码将显示如下内容：

Normal image size url: /system/images/images/000/000/004/original/1.png?1419796218

Large image size url: /system/images/images/000/000/003/medium/1.png?1419796195

  1. 将上面显示的链接复制并粘贴到 markdown 中，如下所示：

    ![my image](/system/images/images/000/000/004/original/1.png?1419796218)

于 2014-12-29T16:23:58.767 回答
0

您是否看过如何扩展 redcarpet 以支持媒体库第 2 部分 ，他们说要添加您必须做的图像 im markdown ![my avatar](http://lol.cat/1p)，它会输出<img src="http://lol.cat/1p" alt="my avatar"/>

我希望这个对你有用。

于 2014-12-27T06:07:36.620 回答