使用载波在 rails 视图中加载图像和视频

Question

问题是，如果我上传一张图片，它会显示图片 2 次（一次在 video_tag 中，另一次在 image_tag

中

所以我试图让图像只出现在 image_tag

<%= video_tag @post.file :controls =>true if @post.file? %>
<%= image_tag @post.file.url if @post.file? %>

Answer 1

你有很多选择。首先尝试使用 rails 个助手。

Rails版本：

#app/helpers/application_helper.rb
module ApplicationHelper
    def file_type(filename)
       types = {
         :jpeg => "image",
         :jpg => "image",
         :gif => "image",
         :png => "image",
         :mp4 => "video", 
         :mkv => "video"
       }
       types[filename.split(".").last.to_sym]
    end
end

#html page
<% if @post.file? %>
     <% type = file_type(@post.file.url)%>
     <% if type == 'image' %>
         <%= image_tag @post.file.url %>
     <% elsif type == 'video' %>
         <%= video_tag @post.file :controls =>true %>
     <% end %>
<% end %>

此外，您可以使用 javascript。

#html page
#remove these lines
#<%= video_tag @post.file :controls =>true if @post.file? %>
#<%= image_tag @post.file.url if @post.file? %>

#add this div empty
<div id='dynamic_file_load'></div>


<script>
  types = {
    ".jpg": "image",
    ".jpeg": "image",
    ".gif": "image",
    ".png": "image",
    ".mp4": "video", 
    ".mkv": "video"
  }

  function checkeExtension(filename) {
      var re = /\..+$/;
      var ext = filename.match(re);
      if (types[ext] == 'video') {
         console.log("video")
         var el = document.createElement('video');
             el.src = 'filename';
         // make your own video player !!!
      } else {
         console.log("image")
         var el = document.createElement("IMG");
             el.setAttribute("src", filename);
             document.getElementById("res").appendChild(x);
      }
      document.getElementById("dynamic_file_load").appendChild(el);
  }
  checkeExtension("<%= @post.file.url %>");
</script>

使用载波在 rails 视图中加载图像和视频

load both image and video in a rails view using carrierwave

ruby-on-rails

carrierwave