(Rails) IMGKIT - 使用 html 和 css 导出图像的问题

Question

我在我的一个项目中使用 IMGKIT，并且必须使用它们的 css 和 html 选项来满足要求。我注意到如果样式表设置如下：

kit = IMGKit.new(html, :quality => 50)
kit.stylesheets << '/path/to/css/file'

并且样式表具有带有相对 url('image.png') 的背景属性，使用 kit.to_file 导出图像时不会生成图像：

(Rails.root + "public/pngs/" + "image.png")

请求挂起，如果我们将后台 url 替换为包含协议、主机和端口的完整 url，则可以很好地导出。

我是否需要在样式表中拥有所有图像的绝对 URL？

我尝试在development.rb 文件中定义 asset_host ：

config.action_controller.asset_host = Proc.new { |source|
     "#{request.protocol}#{request.host_with_port}"
    }

如果我在浏览器上检查，它确实会替换 css 中的 url，但通过 IMGKIT 导出时仍然不会生成图像。

Answer 1

IMGKIT 需要任何背景图像或其他资源具有绝对 url 的 css。因此，您可以按照此链接https://coderwall.com/p/exj0ig动态生成它，并执行一些步骤：

A）将所有图像放入rails应用程序的assets/images文件夹中

B）如果没有安装，请安装 gem 'sass-rails' https://github.com/rails/sass-rails

C)创建另一个 css 文件名称为 css_file_name.css.sccs.erb

D)将所有其他 css 文件内容放入其中。

E)在 css 文件中，只需将图像文件名如下所示：background-image: image-url('image.png');

F)使用资产 pipline ( http://guides.rubyonrails.org/asset_pipeline.html#how-to-use-the-asset-pipeline ) 运行以下命令作为您的应用程序模式： (1) 开发模式： RAILS_ENV=development bundle exec rake assets:precompile (2) 生产模式：RAILS_ENV=生产包 exec rake assets:precompile

G)在你的配置/环境/

（1）在development.rb中config.action_controller.asset_host =“您的本地主机URL即YOUR_LOCALHOST_ADDRESS”

(2) 在 production.rb 中 config.action_controller.asset_host = " http://assets.example.com "/您的地址/

H)最后将您的样式表与 IMGKIT 相关联，如下所示

html_content = "YOUR HTML CONTENT"
kit = IMGKit.new(html_content, height: 900, transparent:true, quality:10) /*YOUR SETTING*/
kit.stylesheets << "#{Rails.root}/public/assets/application.css"
file = kit.to_file(Rails.root + "public/pngs/" + "screenshot.png") /*YOUR IMAGE NAME*/
send_file("#{Rails.root}/public/pngs/screenshot.png", :filename => "screenshot.png", :type => "image/png",:disposition => 'attachment',:streaming=> 'true') /*YOUR ADDRESS WHERE U WANT TO STORE PNG FILE*/

I)重新启动服务器并享受!!!!!

[注意：每次更改后，请运行 asset pipline 命令以获取由 .sccs.erb 扩展文件制成的最新 application.css。]