0
votes

I'm trying to use the Carrierwave gem along with Cloudinary to upload pictures on my site. Although the upload happens, according to the terminal (shown below), the image does not render in the browser. Already did a big research considering new dependency updates, but no success. Here are the MVC's responsible for that:

class Account < ApplicationRecord
  has_many :posts, dependent: :destroy
  
  devise :database_authenticatable, :registerable,
         :recoverable, :rememberable, :validatable
end
class Post < ApplicationRecord
  belongs_to :account
  has_many :photos, dependent: :destroy
end
class Photo < ApplicationRecord
  belongs_to :post
  validates :image, presence: true
  mount_uploader :image, PhotoUploader
end

My uploader.rb file:

class PhotoUploader < CarrierWave::Uploader::Base
  def store_dir
    "uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}"
  end

   include Cloudinary::CarrierWave

  process :convert => 'png'
  process :tags => ['post_picture']

  version :standard do
    process :resize_to_fill => [300, 300, :center]
  end

  version :thumbnail do
    resize_to_fit(100, 100)
  end
end

My posts controller:

class PostsController < ApplicationController
    before_action :find_post, only: [:show]
    before_action :authenticate_account!

    def index
        @posts = Post.all.limit(10).includes(:photos)
        @post = Post.new
    end

      def create
        if
        Post.create(post_params)
        redirect_to posts_path
        flash[:notice] = "Success!"
        else
            flash[:alert] = "Something went wrong"
            redirect_to posts_path
        end
    end

    def show
        @photos = @post.photos
    end

    private

    def find_post
        @post = Post.find_by id: params[:id]
    return if @post
        flash[:danger] = "Post not found."
        redirect_to root_path
    end

    def post_params
        params.require(:post).permit :content
    end
end

My terminal after submitting a picture:

 Rendering layout layouts/application.html.erb
  Rendering posts/index.html.erb within layouts/application
  Post Load (12.2ms)  SELECT "posts".* FROM "posts" LIMIT $1  [["LIMIT", 10]]
  ↳ app/views/posts/index.html.erb:29
  Photo Load (4.0ms)  SELECT "photos".* FROM "photos" WHERE "photos"."post_id" IN ($1, $2, $3, $4, $5, $6, $7, $8, $9, $10)  [[nil, 1], [nil, 2], [nil, 3], [nil, 4], [nil, 5], [nil, 6], [nil, 7], [nil, 8], [nil, 9], [nil, 10]]
  ↳ app/views/posts/index.html.erb:29
  Rendered posts/index.html.erb within layouts/application

And my erb form for submitting pictures:

<div class="d-flex flex-column align-items-center mt-3">
  <div class="col-xl-7 col-lg-8 col-md-10 col-sm-11 post-card">
    <div class="card">
      <div class="card-header">
        Create Post
        <div class="card-body">
            <%= form_for @post, :html => {:multipart => true, :class => "dropzone upload-images p-0 border-0"} do |f| %>
                <div class="form-group row mt-2">
                    <div class="col pl-0">
                        <%= f.text_field :content, class: "form_control border-0", placeholder: "Enter a comment..." %>   
                    </div>
                </div>
                <div class="fallback">
                    <%= file_field_tag "images[]", type: :file, multiple: true %>
                </div>
                <div class="dz-message m-0"></div>
                    <div class="dropzone-previews mb-3">
                        <div class="upload-photos-icon">
                        <i class="fa fa-plus fa-2x" aria-hidden="true" style="color:#dddfe2"></i>
                        </div>
                    </div>
                <%= f.submit "Submit", class: "btn-md btn-primary" %>
                <% end %>
            </div>
        </div>
    </div>
</div>
1
What about your haml file that contains the form? Can you share that. - Daniel Mendoza
It's an erb file, not haml, but I've just posted it above. - Jake D.
I think mutliple things need to be updated here, maybe try something like this example blog.francium.tech/… - Daniel Mendoza
@DanielMendoza Thank you. I'll take it a look when I have time. - Jake D.

1 Answers

0
votes

Try please to debug it using for example binding.pry and see if photos are in place. Is this in localhost or somewhere on server?