Files
Genarrative/src/hooks/useResolvedAssetReadUrl.test.tsx
T
kdletters 2a6da01307 修复生成图片签名地址重复换签
将 refreshKey 调整为 signed URL 缓存版本号,同一路径同版本复用未过期签名地址。

让完整阿里云 OSS generated 地址在 hook 中先归一并走 read-url 换签。

补充前端回归测试,覆盖相同 refreshKey 不重复换签和完整 OSS 地址不裸写入图片。

更新运维文档与 Hermes 记忆,明确 refreshKey 不是每次绕过签名缓存。
2026-06-07 23:20:24 +08:00

332 lines
9.6 KiB
TypeScript

// @vitest-environment jsdom
import { fireEvent, render, screen, waitFor } from '@testing-library/react';
import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest';
import { ResolvedAssetImage } from '../components/ResolvedAssetImage';
import {
clearStoredAccessToken,
setStoredAccessToken,
} from '../services/apiClient';
import { clearSignedAssetReadUrlCache } from '../services/assetReadUrlService';
describe('useResolvedAssetReadUrl', () => {
beforeEach(() => {
clearSignedAssetReadUrlCache();
clearStoredAccessToken({ emit: false });
setStoredAccessToken('test-access-token', { emit: false });
vi.restoreAllMocks();
});
afterEach(() => {
clearStoredAccessToken({ emit: false });
});
test('generated 私有资源签名完成前不会把裸路径写入 img', async () => {
vi.spyOn(globalThis, 'fetch').mockResolvedValue(
new Response(
JSON.stringify({
ok: true,
data: {
read: {
objectKey:
'generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png',
signedUrl: 'https://signed.example.com/puzzle.png',
expiresAt: '2099-01-01T00:10:00Z',
},
},
error: null,
meta: {
apiVersion: '2026-04-08',
routeVersion: '2026-04-08',
latencyMs: 1,
timestamp: '2099-01-01T00:00:00Z',
},
}),
{
status: 200,
headers: {
'Content-Type': 'application/json',
},
},
),
);
render(
<ResolvedAssetImage
src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
alt="候选图"
/>,
);
expect(screen.queryByRole('img', { name: '候选图' })).toBeNull();
const image = await screen.findByRole('img', { name: '候选图' });
expect(image.getAttribute('src')).toBe(
'https://signed.example.com/puzzle.png',
);
expect(globalThis.fetch).toHaveBeenCalledTimes(1);
expect(String(vi.mocked(globalThis.fetch).mock.calls[0]?.[0])).toContain(
'legacyPublicPath=%2Fgenerated-puzzle-assets%2Fpuzzle-session-1%2Fcandidate-1%2Fasset-1%2Fimage.png',
);
});
test('无前导斜杠的 generated 私有资源也不会裸写入 img', async () => {
vi.spyOn(globalThis, 'fetch').mockResolvedValue(
new Response(
JSON.stringify({
ok: true,
data: {
read: {
objectKey:
'generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png',
signedUrl: 'https://signed.example.com/puzzle.png',
expiresAt: '2099-01-01T00:10:00Z',
},
},
error: null,
meta: {
apiVersion: '2026-04-08',
routeVersion: '2026-04-08',
latencyMs: 1,
timestamp: '2099-01-01T00:00:00Z',
},
}),
{
status: 200,
headers: {
'Content-Type': 'application/json',
},
},
),
);
render(
<ResolvedAssetImage
src="generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
alt="候选图"
/>,
);
expect(screen.queryByRole('img', { name: '候选图' })).toBeNull();
const image = await screen.findByRole('img', { name: '候选图' });
expect(image.getAttribute('src')).toBe(
'https://signed.example.com/puzzle.png',
);
});
test('完整 OSS generated 地址也会先换签再写入 img', async () => {
vi.spyOn(globalThis, 'fetch').mockResolvedValue(
new Response(
JSON.stringify({
ok: true,
data: {
read: {
objectKey:
'generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png',
signedUrl: 'https://signed.example.com/puzzle.png',
expiresAt: '2099-01-01T00:10:00Z',
},
},
error: null,
meta: {
apiVersion: '2026-04-08',
routeVersion: '2026-04-08',
latencyMs: 1,
timestamp: '2099-01-01T00:00:00Z',
},
}),
{
status: 200,
headers: {
'Content-Type': 'application/json',
},
},
),
);
render(
<ResolvedAssetImage
src="https://genarrative-release.oss-cn-beijing.aliyuncs.com/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
alt="候选图"
/>,
);
expect(screen.queryByRole('img', { name: '候选图' })).toBeNull();
const image = await screen.findByRole('img', { name: '候选图' });
expect(image.getAttribute('src')).toBe(
'https://signed.example.com/puzzle.png',
);
expect(String(vi.mocked(globalThis.fetch).mock.calls[0]?.[0])).toContain(
'legacyPublicPath=%2Fgenerated-puzzle-assets%2Fpuzzle-session-1%2Fcandidate-1%2Fasset-1%2Fimage.png',
);
});
test('refreshKey changes force a fresh signed url request without mutating OSS signature query', async () => {
vi.spyOn(globalThis, 'fetch').mockImplementation(
async () =>
new Response(
JSON.stringify({
ok: true,
data: {
read: {
objectKey:
'generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png',
signedUrl: 'https://signed.example.com/puzzle.png',
expiresAt: '2099-01-01T00:10:00Z',
},
},
error: null,
meta: {
apiVersion: '2026-04-08',
routeVersion: '2026-04-08',
latencyMs: 1,
timestamp: '2099-01-01T00:00:00Z',
},
}),
{
status: 200,
headers: {
'Content-Type': 'application/json',
},
},
),
);
const { rerender } = render(
<ResolvedAssetImage
src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
refreshKey="first-version"
alt="候选图"
/>,
);
const firstImage = await screen.findByRole('img', { name: '候选图' });
expect(firstImage.getAttribute('src')).toBe(
'https://signed.example.com/puzzle.png',
);
rerender(
<ResolvedAssetImage
src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
refreshKey="second-version"
alt="候选图"
/>,
);
await waitFor(() => {
expect(globalThis.fetch).toHaveBeenCalledTimes(2);
});
expect(
screen.getByRole('img', { name: '候选图' }).getAttribute('src'),
).toBe('https://signed.example.com/puzzle.png');
});
test('generated 私有资源签名失败时保持空图像而不是回退裸路径', async () => {
vi.spyOn(globalThis, 'fetch').mockResolvedValue(
new Response(
JSON.stringify({
ok: false,
data: null,
error: {
code: 'NOT_FOUND',
message: '对象不存在',
},
meta: {
apiVersion: '2026-04-08',
routeVersion: '2026-04-08',
latencyMs: 1,
timestamp: '2099-01-01T00:00:00Z',
},
}),
{
status: 400,
headers: {
'Content-Type': 'application/json',
},
},
),
);
render(
<ResolvedAssetImage
src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
alt="候选图"
/>,
);
await waitFor(() => {
expect(globalThis.fetch).toHaveBeenCalledTimes(1);
});
expect(screen.queryByRole('img', { name: '候选图' })).toBeNull();
});
test('generated 私有资源签名失败时可使用显式 fallbackSrc', async () => {
vi.spyOn(globalThis, 'fetch').mockResolvedValue(
new Response(
JSON.stringify({
ok: false,
data: null,
error: {
code: 'NOT_FOUND',
message: '对象不存在',
},
meta: {
apiVersion: '2026-04-08',
routeVersion: '2026-04-08',
latencyMs: 1,
timestamp: '2099-01-01T00:00:00Z',
},
}),
{
status: 400,
headers: {
'Content-Type': 'application/json',
},
},
),
);
render(
<ResolvedAssetImage
src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
fallbackSrc="/creation-type-references/puzzle.webp"
alt="候选图"
/>,
);
expect(
screen.getByRole('img', { name: '候选图' }).getAttribute('src'),
).toBe('/creation-type-references/puzzle.webp');
await waitFor(() => {
expect(globalThis.fetch).toHaveBeenCalledTimes(1);
});
expect(
screen.getByRole('img', { name: '候选图' }).getAttribute('src'),
).toBe('/creation-type-references/puzzle.webp');
});
test('普通封面加载失败时切换到显式 fallbackSrc', async () => {
render(
<ResolvedAssetImage
src="/covers/missing-cover.webp"
fallbackSrc="/creation-type-references/puzzle.webp"
alt="草稿封面"
/>,
);
const image = screen.getByRole('img', { name: '草稿封面' });
expect(image.getAttribute('src')).toBe('/covers/missing-cover.webp');
fireEvent.error(image);
await waitFor(() => {
expect(
screen.getByRole('img', { name: '草稿封面' }).getAttribute('src'),
).toBe('/creation-type-references/puzzle.webp');
});
});
});