捕获网页快照

我正在使用 cloudinary's url2png 在我的网站上捕获渲染页面的插件。它将捕获页面,但没有任何样式。页面需要几秒钟才能加载,所以我在想,也许它只需要在捕获之前稍等片刻?

控制器:

@user = User.find_by_username(params[:username])


    @user_items_designs = ItemsDesign.
        select('items_designs.id ,
                            items_designs.name,
                            items_designs.item_id,
                            items_designs.description,
                            items_designs.category,
                            items_designs.style,
                            items_designs.brand,
                            items_designs.color,
                            items_designs.make,
                            items_designs.special_name,
                            items_designs.likes,
                            items_designs.image_name,
                            items_designs.image_name_hover,
                            items_designs.image_name_selection,

                            users_items_designs.hide,
                            users_items_designs.location_id,

                            locations.z,
                            locations.x,
                            locations.y,
                            locations.height,
                            locations.width,
                            locations.section_id,

                            items.name as items_name,
                            items.name_singular as items_name_singular,

                            items.clickable,
                            sections.name as section_name'
    ).
        joins(:users_items_designs).
        where('user_id = ?', @user.id).
        joins('LEFT OUTER JOIN locations  ON locations.id = users_items_designs.location_id').
        joins('LEFT OUTER JOIN items  ON items.id = items_designs.item_id').
        joins('LEFT OUTER JOIN sections ON sections.id = locations.section_id')

    @items = []
    @user_items_designs.each do |item|
      location = Location.find(item.item_id)
      @items << {id: item.id, item_id: item.item_id, name: item.name, description: item.description, image_name: item.image_name, x: location.x.to_i, y: location.y.to_i, z: location.z.to_i}
    end

捕获页面的代码必须位于视图中:

<%
   snapshot = cl_image_tag("http:****",
                           :type => "url2png",
                           :sign_url => true)

%>
<%= snapshot %>

这将生成要捕获的页面:

<% @items.each do |image| %>
            <% puts image.inspect %>
            <div class="room_design_container_<%= image[:item_id] %>" style="position: absolute; left: <%= "#{image[:x]}px" %>; top: <%= "#{image[:y]}px" %>; z-index: <%= image[:z] %>;">
              <img class="room_design"
                   src="<%= image[:image_name].url %>"

                   data-main-src-client="<%= image[:image_name].url %>"
                   data-main-src-server="<%= image[:image_name].url %>"

                   data-design-id-server="<%= image[:id] %>"

                   data-design-item-id="<%= image[:item_id] %>"

                   data-design-location-id="<%= image[:location_id] %>"
              />
            </div>
        <% end %>