fix: fix image 500 error when moving dist directory in standalone Node (#15169)

* fix: fix image 500 error when moving dist directory in standalone Node

* clean up old output directory

Author: rururux

.changeset/shaggy-aliens-win.md

@@ -0,0 +1,6 @@
+---
+'@astrojs/node': patch
+'astro': patch
+---
+
+fix: fix image 500 error when moving dist directory in standalone Node

packages/astro/src/assets/endpoint/node.ts

@@ -1,26 +1,28 @@
 // @ts-expect-error
-import { outDir } from 'astro:assets';
+import { outDir, serverDir } from 'astro:assets';
 import { readFile } from 'node:fs/promises';
+import path from 'node:path';
 import { fileURLToPath } from 'node:url';
 import { isParentDirectory } from '@astrojs/internal-helpers/path';
 import type { APIRoute } from '../../types/public/common.js';
 import { handleImageRequest } from './shared.js';
 
 async function loadLocalImage(src: string, url: URL) {
+	const outDirURL = resolveOutDir();
 	// If the _image segment isn't at the start of the path, we have a base
 	const idx = url.pathname.indexOf('/_image');
 	if (idx > 0) {
 		// Remove the base path
 		src = src.slice(idx);
 	}
-	if (!URL.canParse('.' + src, outDir)) {
+	if (!URL.canParse('.' + src, outDirURL)) {
 		return undefined;
 	}
-	const fileUrl = new URL('.' + src, outDir);
+	const fileUrl = new URL('.' + src, outDirURL);
 	if (fileUrl.protocol !== 'file:') {
 		return undefined;
 	}
-	if (!isParentDirectory(fileURLToPath(outDir), fileURLToPath(fileUrl))) {
+	if (!isParentDirectory(fileURLToPath(outDirURL), fileURLToPath(fileUrl))) {
 		return undefined;
 	}
 
@@ -44,3 +46,21 @@ export const GET: APIRoute = async ({ request }) => {
 		});
 	}
 };
+
+function resolveOutDir() {
+	const serverDirPath = fileURLToPath(serverDir);
+	const rel = path.relative(serverDirPath, fileURLToPath(outDir));
+
+	const serverFolder = path.basename(serverDirPath);
+	let serverEntryFolderURL = path.dirname(import.meta.url);
+	while (!serverEntryFolderURL.endsWith(serverFolder)) {
+		serverEntryFolderURL = path.dirname(serverEntryFolderURL);
+	}
+	const serverEntryURL = serverEntryFolderURL + '/entry.mjs';
+	const outDirURL = new URL(appendForwardSlash(rel), serverEntryURL);
+	return outDirURL;
+}
+
+function appendForwardSlash(pth: string) {
+	return pth.endsWith('/') ? pth : pth + '/';
+}

packages/astro/src/assets/vite-plugin-assets.ts

@@ -185,9 +185,9 @@ export default function assets({ fs, settings, sync, logger }: Options): vite.Pl
 										: settings.config.outDir,
 								),
 							)});
-							export const assetsDir = /* #__PURE__ */ new URL(${JSON.stringify(
-								settings.config.build.assets,
-							)}, outDir);
+              export const serverDir = /* #__PURE__ */ new URL(${JSON.stringify(
+								new URL(settings.config.build.server),
+							)});
 							export const getImage = async (options) => await getImageInternal(options, imageConfig);
 
 							export const getFontData = createGetFontData(fontsMod);

packages/integrations/node/test/image.test.js

@@ -1,4 +1,5 @@
 import * as assert from 'node:assert/strict';
+import { cp, rm } from 'node:fs/promises';
 import { after, before, describe, it } from 'node:test';
 import { inferRemoteSize } from 'astro/assets/utils/inferRemoteSize.js';
 import * as cheerio from 'cheerio';
@@ -81,4 +82,32 @@ describe('Image endpoint', () => {
 			assert.equal(res.status, 403, `Failed on href: ${href}`);
 		}
 	});
+
+	describe('the dist folder is moved', () => {
+		const outputDir = new URL('./fixtures/image/output/', import.meta.url);
+
+		before(async () => {
+			await devPreview.stop();
+			await cp(fixture.config.outDir, new URL('./dist', outputDir), { recursive: true });
+      await rm(fixture.config.outDir, { recursive: true });
+			devPreview = await fixture.preview({ outDir: './output/dist' });
+		});
+
+		after(async () => {
+			await rm(outputDir, { recursive: true });
+		});
+
+		it('it returns local images', async () => {
+			const res = await fixture.fetch('/');
+			assert.equal(res.status, 200);
+			const html = await res.text();
+			const $ = cheerio.load(html);
+
+			const img = $('img[alt=Penguins]').attr('src');
+			const size = await inferRemoteSize(`http://localhost:4321${img}`);
+			assert.equal(size.format, 'webp');
+			assert.equal(size.width, 50);
+			assert.equal(size.height, 33);
+		});
+	});
 });