Plus-sign in S3 key causes 404

[robdasilva]

Trying to fetch an image for an object in S3 with a '+' in its key causes 404.

Example:

GET https://<cname>.imgix.net/E+P-003_D.jpeg // -> 404
GET https://<cname>.imgix.net/E%2BP-003_D.jpeg // -> 200

I suspect, it's due to encodeURI in https://github.com/imgix/imgix-core-js/blob/master/src/imgix-core-js.js#L106. As the S3 key is a path, the module uses encodeURI, which accepts '+' symbols and does not encode them. S3, however, interprets those as spaces.

[sherwinski]

Hey @RSchweizer,
Thanks for bringing this up. Unfortunately there isn't a straightforward solution for this as encoding the + runs the risk of breaking setups that don't use S3 sources. For now the quickest solution would be to separately encode the + after generating the URL:

client.buildURL(path, params).replace(/\+/g, '%2B')

I know it's not a satisfying answer, but know that we are currently investigating a better solution for this. Feel free to comment back if you have any other questions. Thanks

[robdasilva]

Hi @sherwinski,

Thank you! That's also the quick fix, I came up with yesterday :)

Let me know, if I can help with anything in finding a more elegant solution.

[ericdeansanchez]

@RSchweizer hey 👋 thanks for opening this issue and bringing this to our attention. I am glad that you and @sherwinski have found a similar solution :)

Moving forward, we're already thinking harder about how/when encoding should/shouldn't take place as well as handling edge cases. I've created an internal document tracking this issue and we are already working on a more elegant solution.

I am going to close this out for now, but please feel free to comment/pull/open-an-issue again if you have any questions, comments, or concerns.