以纯 HTML 读取时覆盖基本标记答案

【问题标题】：Overriding the base tag when reading in plain HTML以纯 HTML 读取时覆盖基本标记
【发布时间】：2012-05-11 19:14:21
【问题描述】：

我目前正在开发一个带有 Rails 后端的 jQM 站点。我们使用的几个页面正在读取用户从 AWS S3 上传的 HTML，并使用 rails 方法“html_safe”来呈现 html。这很好用，但是如果 html 对具有相对路径名的文件有任何引用，它们当然不会显示出来，因为它们需要从 S3 中获取。

所以我要做的是更改基本标记，以便这些相对路径名可以获取它们的资产。我已阅读 Navmodel 上的 jQM 文档，但我不熟悉 javascript，并且不确定是否可以使用 *BaseURL 方法来实现我的目标。

有人有可能的解决方案吗？任何建议将不胜感激。谢谢！

【问题讨论】：

标签： html ruby-on-rails jquery-mobile relative-path base-tag

【解决方案1】：

<base> 标记可以工作，但根据适用于整个页面的规范，这会破坏您页面上的任何其他相对 URL。

如果您不想确保所有其他 URL 都是绝对的，那么下一个最好的方法可能是使用 Nokogiri 来转换这些 URL。例如

require 'uri'
require 'nokogiri'

base_uri = URI 'http://example.com/'

html = %{ <!DOCTYPE html>
          <html><body>
          <ul>
            <li><a href="/some_relative_url.html">Relative</a></li>
            <li><a href="http://stackoverflow.com/">Absolute</a></li>
            <li><img src="/a_relative_image.png" /></li>
          </ul>
          </body></html>
        }

doc = Nokogiri::HTML html

attrs = %w( @href @src )

doc.search( *attrs ).each do |attr|
  path = URI attr

  attr.value = ( base_uri + path ).to_s unless path.absolute?
end

puts doc
# => <!DOCTYPE html>
#    <html><body>
#    <ul>
#      <li><a href="http://example.com/some_relative_url.html">Relative</a></li>
#      <li><a href="http://stackoverflow.com/">Absolute</a></li>
#      <li><img src="http://example.com/a_relative_image.png" /></li>
#    </ul>
#    </body></html>

【讨论】：

美丽。我一定会试一试的。谢谢。