I created a hybrid Rails 5.2 app with views and API controller. I am allowing users to upload files thanks to active storage and S3.
My active storage service does generate the S3 image URL in my Rails views such as shown in the logs:
Generated URL for file at key: HsBwx3LiGxmSJtDB2pu9nEiJ (https://[DOMAIN_NAME].s3.ca-central-1.amazonaws.com/HsBwx3LiGxmSJtDB2pu9nEiJ?response-content-disposition=....
Unfortunately, on the API side, the image URL looks like this:
/rails/active_storage/blobs/...
The idea is to consume this API in a Vue SPA.
Model
My model is pretty simple: 1 Product model with has_one_attached :image
.
Serializer
I am using a serializer to present that image such as:
include Rails.application.routes.url_helpers
...
def image
rails_blob_path(object.image, only_path: true) if object.image.attached?
end
API Controller
In my API controller, I am rendering as json my Products such as:
def index
@products = Product.all
render json: @products, each_serializer: ::ProductSerializer, status: :ok
end
Config
I am hosting on Heroku, all env. vars. are set. My production settings look ok:
config.active_storage.service = :amazon
Testing on Postman and in my Vue app, still getting that rails blog URL and not the amazon one.
Appreciate your feedback on what I am missing here.
Thanks,
Solved it. In my serializer, instead of:
def image
rails_blob_path(object.image, only_path: true) if object.image.attached?
end
I am using Active Storage service_url
method such as:
def image
object.image.service_url if object.image.attached?
end