Rails还很新,但我在获取实时站点上显示的图像时遇到了问题。这些图片是由用户上传的,作为创建帖子的一部分,但我遇到了两个问题:
- 上传图像时媒体库不更新
- 在localhost上,上传工作正常并显示,但在实时网站上,图像没有显示。页面加载良好,但生成的Cloudinary图像src没有指向任何位置示例:
<img class="main-post-image" src="https://res.cloudinary.com/hw2ugvhic/image/upload/vfvhamrbx0jz8rj6y17c2vy4m2gp">
新的帖子视图:
<div class="text-center mt-3">
<h1>New post</h1>
</div>
<div class = "main-form-container">
<div class= "post-form-container">
<div data-controller="multi-upload">
<%= simple_form_for [@country, @area, @post] do |f| %>
<%= f.input :title %>
<%= f.input :summary %>
<%= f.input :description, as: :rich_text_area %>
<%= f.input :category , collection: %w(bar restaurant activity nature memory) %>
<%= f.input :main_image, as: :file, label: "square image only"%>
<%= f.file_field :images, multiple: true, data: {action: "multi-upload#addFile"} %>
<div data-multi-upload-target="files"></div>
<div class = "d-flex justify-content-center">
<%= f.button :submit, class: "green-button mt-3"%>
</div>
<div class = "text-link text-center mt-2">
<%= link_to "Go back", country_area_path(@country, @area) %>
</div>
<% end %>
</div>
</div>
</div>
后控制器:
class PostsController < ApplicationController
def new
@country = Country.find(params[:country_id])
@area = Area.find(params[:area_id])
@post = Post.new
end
def create
@country = Country.find(params[:country_id])
@area = Area.find(params[:area_id])
@post = Post.new(post_params)
@post.user = current_user
@post.area = @area
if @post.save
redirect_to country_area_path(@country, @area)
else
render :new
end
end
def show
@country = Country.find(params[:country_id])
@area = Area.find(params[:area_id])
@post = Post.find(params[:id])
end
def edit
@post = Post.find(params[:id])
@area = Area.find(params[:area_id])
@country = Country.find(params[:country_id])
end
def update
@area = Area.find(params[:area_id])
@country = Country.find(params[:country_id])
@post = Post.find(params[:id])
@post.update(post_params)
redirect_to country_area_post_path(@country, @area, @post)
end
private
def post_params
params.require(:post).permit(:title, :summary, :description, :category, :area_id, :main_image, images: [])
end
end
后模型:
class Post < ApplicationRecord
belongs_to :user
belongs_to :area
has_one_attached :main_image, dependent: :destroy
has_many_attached :images, dependent: :destroy
has_rich_text :description
validates :title, :summary, :description, :category, :main_image, presence: true
end
区域显示查看页面(可以查看帖子(
<nav aria-label="breadcrumb" class="mt-2 pl-2">
<ol class="breadcrumb">
<li class="breadcrumb-item"><%= link_to "Home", root_path %></li>
<li class="breadcrumb-item"><%= link_to @country.name, country_path(@country) %></li>
<li class="breadcrumb-item active" aria-current="page"><%= @area.name %></li>
</ol>
</nav>
<% unless @posts.empty?%>
<div class = main-posts-div>
<div>
<%= "Welcome to #{@area.name}, #{@country.name}"%>
</div>
<%= link_to "New post", new_country_area_post_path(@country, @area), class: "green-button mt-3"%>
<div>
<div class="area-main-div">
<% @posts.each do |post| %>
<%= link_to country_area_post_path(@country, @area, post) do %>
<div class= "post-card">
<div>
<% if post.main_image.nil? %>
<%= image_tag("https://picsum.photos/300/300") %>
<% else %>
<%= cl_image_tag(post.main_image.key, class:"main-post-image") %>
<% end %>
</div>
<div class = "lower-post-card">
<div>
<%= post.title %>
</div>
<div>
<em><%= post.category %></em>
</div>
</div>
<% end %>
</div>
<% end %>
</div>
</div>
</div>
<% else %>
<div class="main-posts-div-blank">
<div>
<%= "Welcome to #{@area.name}, #{@country.name}. #{@area.name} is yet to be explored, please document your experience"%><br>
</div>
<%= link_to "New post", new_country_area_post_path(@country, @area), class: "green-button mt-3"%>
</div>
<% end %>
区域控制器
class AreasController < ApplicationController
def new
@area = Area.new
end
def create
@country = Country.find(params[:country_id])
@area = Area.new(area_params)
@area.country = @country
@area.save
redirect_to country_path(@country)
end
def show
@area = Area.find(params[:id])
@country = Country.find(params[:country_id])
@post = Post.new
@posts = Post.where(area_id: @area)
end
private
def area_params
params.require(:area).permit(:name, :country_id)
end
end
已经采取的步骤
将Cloudinary添加到Heroku使用cloudinary键创建了一个dotenv文件添加云宝石更新了以下内容:
storage.yml
cloudinary:
service: Cloudinary
folder: <%= Rails.env %>
development.rb
config.active_storage.service = :cloudinary
我下一步可以尝试什么?
我认为唯一可能缺少的是,活动存储不会将文件夹存储为密钥的一部分,例如post.main_image.key
是一个随机字符串,但缺少您在storage.yml
文件中定义的folderName/<random-string>
。
我认为你只需要在cl_image_tag(post.main_image.key, class:"main-post-image")
中包含文件夹名称就应该是cl_image_tag("folderName/"+post.main_image.key, class:"main-post-image")
可能有一种方法可以动态传递。