How to render the image has colon symbol

Hi all,
I’m building app combine between Rails and Phoenix. I put Phoenix behind Rails, just render HTML response from Rails.
I have an issue when showing images. Several images have colon symbol in name, something like ‘abcd:xzy.jpg’. It seems Phoenix can’t render images look like that.
Because my Rails app was built a long time ago, so I don’t wanna change the database.
so How I can render images have colon symbol on Phoenix?
Please let me know.

My English not good, I’m so sorry about that.

Hello,

We need more details on the error that Phoenix gives you.

just render HTML response from Rails.

You mean Phoenix is in front, not behind, right ? The browser talks to Phoenix.

2 Likes

I’ve seen this problem before, in my case Phoenix is acting as the web server (via Cowboy), Rails generates the HTML, Phoenix forwards headers to Rails to allow the Rails app to function normally. (This allows me to replace parts of the app to improve performance allowing the legacy Rails app to handle the non-Elixir part of the project)

When static assets have colons in the file name, there is an “invalid path for static asset” error. In rails this would be solved by adding a constraint parameter to the route, unfortunately I have not found a solution in Phoenix.

3 Likes

yes, the browser sends requests to phoenix then phoenix send them to rails and get responses for rendering

That is the case I’m experiencing

I mean Phoenix is in front , not behind

1 Like

Phoenix doesn’t “render” anything, it just sends the data you tell it to send, it’s the browser that renders the image.

If the browser isn’t rendering the image than either the image data is corrupt or your path is incorrect. Colons in filenames are entirely fine (I use them for a few things), so check your pathing?

Huh? Elaborate?

I meant the constraint in a route definition (https://guides.rubyonrails.org/routing.html#segment-constraints), though I think you’re right, that’s not relevant to serving static assets.

Regarding our problem with Phoenix, if I’m not mistaken, this page suggests that any colon character in a static asset filename will throw an error: https://github.com/elixir-plug/plug/blob/master/lib/plug/static.ex#L395

How were you able to get around this?

1 Like

It seems that @Art is right about the error when trying to add static images which name contains “:” in phoenix templates.

I just reproduce the error with a fresh phoenix project where I replaced my_app/assets/static/images/phoenix.png with my_app/assets/static/images/abcd:xzy.png.

and tried to render it in the layout template.

Well that’s weird…

Also explains how I’m serving them, I’m send_file’ing them as I need to perform permission checks first.

I believe in the past it was considered that colons within a URI path was a potential security issue, specifically on Windows (I know that ASP.NET, for example does (or used to, I’m unsure about nowadays) not allow colons). I don’t have any commentary on if it actually is a security issue in 2019, but there is, at the very least, a multitude of debates that turn up on Stackoverflow and other sites about whether or not a colon is URL-safe.

If I had to guess, the author of that plug probably marked it as invalid for that reason. Maybe this is a chance for a pull request to make it configurable which characters are invalid?

2 Likes

It’s only an issue on servers that don’t sanitize user input properly, of which they already have much larger issues. I.E. it was never an issue except on poorly designed interfaces.

EDIT: Oh, and yes, a : is valid in a Windows filename as well in filename location, as in not as the drive letter (it does something… unique, but entirely valid and useful. :wink: ).