michael/astro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Support relative protocol image URL (#5072)

Browse source 
* Support relative protocol image URL

* Fix test

* Actually fix test
This commit is contained in:
Bjorn Lu 2022-10-13 23:59:38 +08:00 committed by GitHub
parent 45728a0d6e
commit 3918787cb9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 31 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/warm-mangos-dance.md Normal file
View file

@ -0,0 +1,5 @@
---
'@astrojs/image': patch
---
Support relative protocol image URL

4
packages/integrations/image/src/build/ssg.ts
View file

@ -54,6 +54,10 @@ function webToCachePolicyResponse({ status, headers: _headers }: Response): Cach
async function loadRemoteImage(src: string) {
try {
if (src.startsWith('//')) {
src = `https:${src}`;
}
const req = new Request(src);
const res = await fetch(req);

8
packages/integrations/image/src/lib/get-image.ts
View file

@ -140,12 +140,14 @@ export async function getImage(
? _loader.serializeTransform(resolved)
: globalThis.astroImage.defaultLoader.serializeTransform(resolved);
const imgSrc =
!isLocalImage && resolved.src.startsWith('//') ? `https:${resolved.src}` : resolved.src;
let src: string;
if (/^[\/\\]?@astroimage/.test(resolved.src)) {
src = `${resolved.src}?${searchParams.toString()}`;
if (/^[\/\\]?@astroimage/.test(imgSrc)) {
src = `${imgSrc}?${searchParams.toString()}`;
} else {
searchParams.set('href', resolved.src);
searchParams.set('href', imgSrc);
src = `/_image?${searchParams.toString()}`;
}

2
packages/integrations/image/src/loaders/squoosh.ts
View file

@ -89,6 +89,8 @@ class SquooshService extends BaseSSRService {
if (autorotate) {
operations.push(autorotate);
}
} else if (transform.src.startsWith('//')) {
transform.src = `https:${transform.src}`;
}
if (transform.width || transform.height) {

2
packages/integrations/image/src/utils/paths.ts
View file

@ -2,7 +2,7 @@ import { TransformOptions } from '../loaders/index.js';
import { shorthash } from './shorthash.js';
export function isRemoteImage(src: string) {
return /^http(s?):\/\//.test(src);
return /^(https?:)?\/\//.test(src);
}
function removeQueryString(src: string) {

2
packages/integrations/image/test/fixtures/squoosh-service/src/pages/index.astro vendored
View file

@ -14,5 +14,7 @@ import { Image } from '@astrojs/image/components';
<Image id="social-jpg" src={socialJpg} width={506} height={253} alt="social-jpg" />
<br />
<Image id="google" src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" width={544} height={184} format="webp" alt="Google" />
<br>
<Image id="google-alt" src="//www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" width={544} height={184} format="webp" alt="Google" />
</body>
</html>

13
packages/integrations/image/test/squoosh-service.test.js
View file

@ -8,7 +8,7 @@ describe('Squoosh service', function () {
let $;
before(async () => {
fixture = await loadFixture({ root: './fixtures/basic-image/' });
fixture = await loadFixture({ root: './fixtures/squoosh-service/' });
devServer = await fixture.startDevServer();
const html = await fixture.fetch('/').then((res) => res.text());
$ = cheerio.load(html);
@ -36,6 +36,17 @@ describe('Squoosh service', function () {
href: 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png',
},
},
{
title: 'Remote images with relative protocol',
id: '#google-alt',
url: '/_image',
query: {
f: 'webp',
w: '544',
h: '184',
href: 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png',
},
},
{
title: 'Public images',
id: '#hero',