Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[@astrojs/image] Handle query params in remote image URLs during SSG builds #4338

Merged
merged 5 commits into from
Aug 22, 2022

Conversation

tony-sull
Copy link
Contributor

Changes

Closes #4317

When building optimized images for SSG builds, any query params used for remote images should be stripped out from the final built HTML

Note that during astro dev and for SSR builds the query params are still needed to make sure the remote image can be fetched properly

Testing

Added dev and build test coverage for remote image query params in SSG and SSR

Docs

Bug fix only

@changeset-bot
Copy link

changeset-bot bot commented Aug 15, 2022

🦋 Changeset detected

Latest commit: e4ac0c0

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@astrojs/image Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions github-actions bot added the pkg: integration Related to any renderer integration (scope) label Aug 15, 2022
@FredKSchott
Copy link
Member

Just confirming that this doesn’t strip them from the requested image, and that example.com/image.png?id=1 doesn’t overwrite or conflict with ...?id=2

@tony-sull
Copy link
Contributor Author

@FredKSchott that's correct - the querystring is kept when pulling the original image by URL, it's only stripped off when building the src value and filename for dist

let filename = src.replace(ext, '');
let filename = removeQueryString(src);
const ext = path.extname(filename);
filename = filename.replace(ext, '');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

probably unlikely to happen but this replaces the first substring of the extension so if you had foo.js.bar.js it would become foo.bar.js. Using lastIndexOf to find where the extension is located and then substringing up to that point would be more technically correct I think.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great catch, I handled that for stripping the querystring but forgot to move that over to lastIndexOf + substring for the extension

fixed in the latest commit 👍

@tony-sull tony-sull force-pushed the fix/image-ssg-querystring branch from 64619a1 to bf20f96 Compare August 22, 2022 15:34
@tony-sull tony-sull self-assigned this Aug 22, 2022
@tony-sull tony-sull merged commit 579e2da into main Aug 22, 2022
@tony-sull tony-sull deleted the fix/image-ssg-querystring branch August 22, 2022 19:45
@astrobot-houston astrobot-houston mentioned this pull request Aug 22, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
pkg: integration Related to any renderer integration (scope)
Projects
None yet
Development

Successfully merging this pull request may close these issues.

astrojs/image does not remove URL variables from remote image URLs
3 participants