deployed SVG assets not being marked with correct Content-Type in S3, not displaying in Chrome
Closed this issue · 2 comments
Checklist
- Upgrade Jets: Are you using the latest version of Jets? This allows Jets to fix issues fast. There's a
jets upgradecommand that makes this a simple task. There's also an Upgrading Guide: http://rubyonjets.com/docs/upgrading/ - Reproducibility: Are you reporting a bug others will be able to reproduce and not asking a question. If you're unsure or want to ask a question, do so on https://community.rubyonjets.com
- Code sample: Have you put together a code sample to reproduce the issue and make it available? Code samples help speed up fixes dramatically. If it's an easily reproducible issue, then code samples are not needed. If you're unsure, please include a code sample.
My Environment
| Software | Version |
|---|---|
| Operating System | MacOS 10.13 |
| Jets | 3.0.8 |
| Ruby | 2.7.2 |
Expected Behaviour
Deploying an SVG image in the public directory should result in a Content-Type of image/svg+xml, and the image should display correctly when embedded in an image tag regardless of browser.
Current Behavior
Deployed asset in S3 ends up with Content-Type: / a blank content type. This causes Chrome to be unable to display the image when embedded in an image tag. Firefox is unaffected. No error is displayed in the browser and the image can be loaded manually by visiting the image url, it just can't be embedded.
Step-by-step reproduction instructions
- Set up a blank jets project
- add an SVG file to the public directory
- embed the SVG file in an
imgtag on the welcome page - deploy the project
- Image tag will work in Firefox but not in Chrome due to blank content-type
Solution Suggestion
At first I thought this was a CORS error, but upon overriding the Content-Type manually in S3, the issue was resolved. Would like to see jets do this automatically i.e. if the file extension is .svg, it should use Content-Type: image/svg+xml
thanks so much!!! 💯