Compare commits
No commits in common. "main" and "codex/original-delivery-speed-20261111" have entirely different histories.
main
...
codex/orig
@ -4,7 +4,6 @@ import { ThemeProvider } from "@/components/theme-provider";
|
||||
import { FaviconUpdater } from "@/components/favicon-updater";
|
||||
import { ImageDeliveryOptimizer } from "@/components/image-delivery-optimizer";
|
||||
import { AppUpdateNotice } from "@/components/app-update-notice";
|
||||
import { PAGE_DOWNLOAD_ACTIVE_ATTRIBUTE } from "@/lib/client/page-refresh";
|
||||
import { getSiteSettings } from "@/lib/db/queries";
|
||||
|
||||
import "./globals.css";
|
||||
@ -143,7 +142,7 @@ const CHUNK_ERROR_RECOVERY_SCRIPT = `\
|
||||
showManualRecoveryNotice();
|
||||
return;
|
||||
}
|
||||
if (lastReloadAt || document.documentElement.hasAttribute('${PAGE_DOWNLOAD_ACTIVE_ATTRIBUTE}')) return;
|
||||
if (lastReloadAt) return;
|
||||
var now = Date.now();
|
||||
// If storage is blocked, a reload cannot remember its attempt and must not run.
|
||||
if (!safeSetSessionStorage(RECOVERY_KEY, String(now))) return;
|
||||
@ -154,10 +153,6 @@ const CHUNK_ERROR_RECOVERY_SCRIPT = `\
|
||||
showManualRecoveryNotice();
|
||||
return;
|
||||
}
|
||||
if (document.documentElement.hasAttribute('${PAGE_DOWNLOAD_ACTIVE_ATTRIBUTE}')) {
|
||||
if (safeSetSessionStorage(RECOVERY_KEY, '0')) lastReloadAt = 0;
|
||||
return;
|
||||
}
|
||||
window.location.reload();
|
||||
}, 800);
|
||||
}
|
||||
|
||||
@ -1,15 +1,14 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useState, useSyncExternalStore } from "react";
|
||||
import { useEffect, useState } from "react";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter } from "@/components/ui/alert-dialog";
|
||||
import { isPageDownloadActive, preparePageRefresh, subscribeToPageDownloadActivity } from "@/lib/client/page-refresh";
|
||||
import { preparePageRefresh } from "@/lib/client/page-refresh";
|
||||
|
||||
export function AppUpdateNotice() {
|
||||
const [availableVersion, setAvailableVersion] = useState("");
|
||||
const [refreshing, setRefreshing] = useState(false);
|
||||
const [error, setError] = useState("");
|
||||
const downloading = useSyncExternalStore(subscribeToPageDownloadActivity, isPageDownloadActive, () => false);
|
||||
useEffect(() => {
|
||||
let disposed = false;
|
||||
let controller: AbortController | undefined;
|
||||
@ -61,7 +60,7 @@ export function AppUpdateNotice() {
|
||||
setRefreshing(false);
|
||||
}
|
||||
};
|
||||
return <AlertDialog open={Boolean(availableVersion) && !downloading}>
|
||||
return <AlertDialog open={Boolean(availableVersion)}>
|
||||
<AlertDialogContent className="z-[10001]" overlayClassName="z-[10000]" onEscapeKeyDown={event => event.preventDefault()}>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>平台已更新</AlertDialogTitle>
|
||||
|
||||
@ -4467,6 +4467,7 @@ export function CanvasChatPanel({
|
||||
setDownloadProgress({
|
||||
phase: "preparing",
|
||||
message: "正在准备原图...",
|
||||
percent: 5,
|
||||
});
|
||||
|
||||
try {
|
||||
@ -4475,7 +4476,7 @@ export function CanvasChatPanel({
|
||||
signal: controller.signal,
|
||||
onProgress: setDownloadProgress,
|
||||
});
|
||||
toast.success("已开始下载");
|
||||
toast.success("原图已开始下载");
|
||||
} catch (error) {
|
||||
if (controller.signal.aborted) {
|
||||
toast.message("已取消下载");
|
||||
|
||||
@ -28,7 +28,6 @@ export function CanvasImageDownloadProgressDialog({
|
||||
: null;
|
||||
const loadedLabel = formatBytes(progress.loadedBytes);
|
||||
const totalLabel = formatBytes(progress.totalBytes);
|
||||
const converting = progress.phase === "converting";
|
||||
|
||||
return createPortal(
|
||||
<div
|
||||
@ -42,12 +41,12 @@ export function CanvasImageDownloadProgressDialog({
|
||||
{progress.phase === "saving" ? (
|
||||
<Download className="h-4 w-4" />
|
||||
) : (
|
||||
<Loader2 className="h-4 w-4 motion-safe:animate-spin" />
|
||||
<Loader2 className="h-4 w-4 animate-spin" />
|
||||
)}
|
||||
</span>
|
||||
<div>
|
||||
<div className="text-[14px] font-semibold">下载原图</div>
|
||||
<div className="mt-0.5 text-[12px] text-white/58" role="status">{progress.message}</div>
|
||||
<div className="mt-0.5 text-[12px] text-white/58">{progress.message}</div>
|
||||
</div>
|
||||
</div>
|
||||
{onCancel ? (
|
||||
@ -64,19 +63,14 @@ export function CanvasImageDownloadProgressDialog({
|
||||
|
||||
<div className="mt-4">
|
||||
<div className="mb-2 flex items-center justify-between text-[12px] text-white/55">
|
||||
<span>{loadedLabel && totalLabel ? `${loadedLabel} / ${totalLabel}` : converting ? "格式转换中" : "正在处理文件"}</span>
|
||||
<span>{loadedLabel && totalLabel ? `${loadedLabel} / ${totalLabel}` : "正在处理文件"}</span>
|
||||
<span>{percent !== null ? `${percent}%` : "..."}</span>
|
||||
</div>
|
||||
<div
|
||||
className="relative h-2 overflow-hidden rounded-full bg-white/10"
|
||||
role="progressbar"
|
||||
aria-label={converting ? "图片格式转换" : "图片下载"}
|
||||
aria-valuenow={percent ?? undefined}
|
||||
>
|
||||
<div className="relative h-2 overflow-hidden rounded-full bg-white/10">
|
||||
<div
|
||||
className={cn(
|
||||
"absolute inset-y-0 left-0 rounded-full bg-gradient-to-r from-cyan-300 via-sky-400 to-emerald-300",
|
||||
percent === null && "w-1/3 motion-safe:animate-[download-indeterminate_1.15s_ease-in-out_infinite]"
|
||||
percent === null && "w-1/3 animate-[download-indeterminate_1.15s_ease-in-out_infinite]"
|
||||
)}
|
||||
style={percent !== null ? { width: `${percent}%` } : undefined}
|
||||
/>
|
||||
|
||||
@ -178,6 +178,7 @@ import {
|
||||
} from "@/components/ui/tooltip";
|
||||
import { fetchUploadWithRetry } from "@/lib/client/upload-with-retry";
|
||||
import {
|
||||
downloadCanvasImageAsPng,
|
||||
downloadOriginalImage,
|
||||
getCanvasImageDownloadErrorMessage,
|
||||
type CanvasImageDownloadProgress,
|
||||
@ -8224,7 +8225,7 @@ export function ImageNode({
|
||||
};
|
||||
|
||||
const isDownloadingOriginalImage = Boolean(downloadProgress);
|
||||
const handleDownload = async () => {
|
||||
const handleDownload = async (format: "original" | "png" = "original") => {
|
||||
if (!data.src) return;
|
||||
if (isDownloadingOriginalImage) {
|
||||
toast.info("原图正在下载中");
|
||||
@ -8236,16 +8237,19 @@ export function ImageNode({
|
||||
setDownloadProgress({
|
||||
phase: "preparing",
|
||||
message: "正在准备原图...",
|
||||
percent: 5,
|
||||
});
|
||||
|
||||
try {
|
||||
await downloadOriginalImage({
|
||||
const request = {
|
||||
url: resolveOriginalImageUrl(data.src) || data.src,
|
||||
name: displayTitle,
|
||||
signal: controller.signal,
|
||||
onProgress: setDownloadProgress,
|
||||
});
|
||||
toast.success("已开始下载");
|
||||
};
|
||||
if (format === "png") await downloadCanvasImageAsPng({ ...request, url: data.src });
|
||||
else await downloadOriginalImage(request);
|
||||
toast.success(format === "png" ? "PNG 已开始下载" : "原图已开始下载");
|
||||
} catch (error) {
|
||||
if (controller.signal.aborted) {
|
||||
toast.message("已取消下载");
|
||||
@ -9638,6 +9642,7 @@ export function ImageNode({
|
||||
<DropdownMenuSeparator />
|
||||
) : null}
|
||||
{imageDownloadEnabled ? (
|
||||
<>
|
||||
<DropdownMenuItem
|
||||
disabled={isDownloadingOriginalImage}
|
||||
onClick={() => {
|
||||
@ -9655,6 +9660,11 @@ export function ImageNode({
|
||||
)}
|
||||
{imageDownloadItem.label}
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuItem disabled={isDownloadingOriginalImage} onClick={() => void handleDownload("png")}>
|
||||
<Download className="mr-2 h-4 w-4" />
|
||||
下载为 PNG(兼容 Photoshop)
|
||||
</DropdownMenuItem>
|
||||
</>
|
||||
) : null}
|
||||
{imageDeleteEnabled ? (
|
||||
<DropdownMenuItem
|
||||
|
||||
@ -221,9 +221,7 @@ export async function convertImageToPhotoshopPng(bytes: Buffer): Promise<Buffer>
|
||||
|| (metadata.space === "rgb16" && metadata.depth === "ushort");
|
||||
if (metadata.format === "png" && rgb
|
||||
&& !metadata.isPalette && (metadata.pages || 1) === 1 && (!metadata.orientation || metadata.orientation === 1)) return bytes;
|
||||
const output = image.rotate().toColorspace("srgb");
|
||||
if (metadata.icc) output.withIccProfile("srgb");
|
||||
return output.png({ compressionLevel: 3, adaptiveFiltering: true }).toBuffer();
|
||||
return image.rotate().toColorspace("srgb").png({ compressionLevel: 3, adaptiveFiltering: true }).toBuffer();
|
||||
}
|
||||
|
||||
function buildCanvasAssetFilename(params: {
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { buildImageProxyUrl, getImageDownloadExtension } from "@/lib/image-delivery";
|
||||
import { inferOriginalImageUrl } from "@/lib/image-url";
|
||||
import { formatDownloadFailure, getDownloadFailure, type DownloadFailure } from "@/lib/canvas/download-error";
|
||||
import { withActivePageDownload } from "@/lib/client/page-refresh";
|
||||
|
||||
export type CanvasImageDownloadPhase = "preparing" | "converting" | "downloading" | "saving";
|
||||
export type CanvasImageDownloadPhase = "preparing" | "downloading" | "saving";
|
||||
|
||||
export type CanvasImageDownloadProgress = {
|
||||
phase: CanvasImageDownloadPhase;
|
||||
@ -190,15 +189,8 @@ function triggerCdnDownload(result: { downloadUrl: string; filename: string; byt
|
||||
return { filename: result.filename, bytes: result.bytes || 0 };
|
||||
}
|
||||
|
||||
const PHOTOSHOP_DOWNLOAD_EXTENSIONS = new Set(["jpg", "png", "gif", "bmp", "tiff"]);
|
||||
|
||||
/** Preserve compatible originals and prepare a PNG for other stored images. */
|
||||
export function downloadOriginalImage(params: DownloadCanvasImageParams): Promise<CanvasImageDownloadResult> {
|
||||
return withActivePageDownload(() => downloadOriginalImageFile(params));
|
||||
}
|
||||
|
||||
async function downloadOriginalImageFile(params: DownloadCanvasImageParams): Promise<CanvasImageDownloadResult> {
|
||||
const { url, name, signal, onProgress } = params;
|
||||
/** Keep the source format and bytes for chat, gallery and reference downloads. */
|
||||
export async function downloadOriginalImage({ url, name, signal, onProgress }: DownloadCanvasImageParams): Promise<CanvasImageDownloadResult> {
|
||||
const source = String(url || "").trim();
|
||||
if (!source) throw new Error("图片地址无效");
|
||||
const proxy = buildImageProxyUrl(source, { delivery: "original" });
|
||||
@ -226,11 +218,6 @@ async function downloadOriginalImageFile(params: DownloadCanvasImageParams): Pro
|
||||
const metadata = await checkedFetch(target.pathname + target.search);
|
||||
const delivery = await metadata.json();
|
||||
if (delivery.delivery === "cdn") {
|
||||
// The resolver names the attachment using the stored MIME type.
|
||||
const extension = delivery.filename.split(".").pop();
|
||||
if (!PHOTOSHOP_DOWNLOAD_EXTENSIONS.has(extension)) {
|
||||
return downloadPngFile(params, "converting");
|
||||
}
|
||||
const result = triggerCdnDownload(delivery, signal);
|
||||
onProgress?.({ phase: "downloading", message: "已开始下载,可在浏览器下载列表查看进度" });
|
||||
return result;
|
||||
@ -238,16 +225,9 @@ async function downloadOriginalImageFile(params: DownloadCanvasImageParams): Pro
|
||||
if (delivery.delivery !== "proxy") throw new Error("下载链接无效");
|
||||
}
|
||||
const response = await checkedFetch(proxy);
|
||||
const contentType = response.headers.get("content-type") || "";
|
||||
if (!contentType.toLowerCase().startsWith("image/")) throw new Error("Source is not an image");
|
||||
const extension = getImageDownloadExtension(contentType);
|
||||
// A local blob can still be downloaded while its upload is in progress.
|
||||
if (/^https?:$/.test(target.protocol) && !PHOTOSHOP_DOWNLOAD_EXTENSIONS.has(extension)) {
|
||||
void response.body?.cancel().catch(() => {});
|
||||
return downloadPngFile(params, "converting");
|
||||
}
|
||||
const blob = await readResponseBlobWithProgress(response, onProgress);
|
||||
signal?.throwIfAborted();
|
||||
if (!blob.type.toLowerCase().startsWith("image/")) throw new Error("Source is not an image");
|
||||
const extension = getImageDownloadExtension(blob.type);
|
||||
const filename = extension ? `${filenameBase}.${extension}` : filenameBase;
|
||||
triggerBlobDownload(blob, filename);
|
||||
return { filename, bytes: blob.size };
|
||||
@ -272,15 +252,14 @@ function toDownloadCandidates(url: string, candidates: string[] = []) {
|
||||
|
||||
async function readResponseBlobWithProgress(
|
||||
response: Response,
|
||||
onProgress?: (progress: CanvasImageDownloadProgress) => void,
|
||||
message = "正在下载原图..."
|
||||
onProgress?: (progress: CanvasImageDownloadProgress) => void
|
||||
) {
|
||||
const totalBytes = Number(response.headers.get("content-length") || 0);
|
||||
if (!response.body) {
|
||||
const blob = await response.blob();
|
||||
onProgress?.({
|
||||
phase: "downloading",
|
||||
message,
|
||||
message: "正在下载原图...",
|
||||
loadedBytes: blob.size,
|
||||
totalBytes: totalBytes || blob.size,
|
||||
percent: 100,
|
||||
@ -300,7 +279,7 @@ async function readResponseBlobWithProgress(
|
||||
loadedBytes += value.byteLength;
|
||||
onProgress?.({
|
||||
phase: "downloading",
|
||||
message,
|
||||
message: "正在下载原图...",
|
||||
loadedBytes,
|
||||
totalBytes: totalBytes || undefined,
|
||||
percent: totalBytes > 0 ? Math.min(99, Math.round((loadedBytes / totalBytes) * 100)) : undefined,
|
||||
@ -312,17 +291,13 @@ async function readResponseBlobWithProgress(
|
||||
});
|
||||
}
|
||||
|
||||
export function downloadCanvasImageAsPng(params: DownloadCanvasImageParams): Promise<CanvasImageDownloadResult> {
|
||||
return withActivePageDownload(() => downloadPngFile(params, "preparing"));
|
||||
}
|
||||
|
||||
async function downloadPngFile({
|
||||
export async function downloadCanvasImageAsPng({
|
||||
candidates,
|
||||
name,
|
||||
onProgress,
|
||||
signal,
|
||||
url,
|
||||
}: DownloadCanvasImageParams, preparationPhase: "preparing" | "converting"): Promise<CanvasImageDownloadResult> {
|
||||
}: DownloadCanvasImageParams): Promise<CanvasImageDownloadResult> {
|
||||
const raw = String(url || "").trim();
|
||||
if (!raw) {
|
||||
throw new Error("图片地址无效");
|
||||
@ -335,9 +310,11 @@ async function downloadPngFile({
|
||||
"canvas-image"
|
||||
);
|
||||
|
||||
const isConverting = preparationPhase === "converting";
|
||||
const conversionMessage = "正在转换为兼容 PNG,完成后自动下载";
|
||||
onProgress?.({ phase: preparationPhase, message: isConverting ? conversionMessage : "正在准备原图..." });
|
||||
onProgress?.({
|
||||
phase: "preparing",
|
||||
message: "正在准备原图...",
|
||||
percent: 8,
|
||||
});
|
||||
|
||||
let response: Response | null = null;
|
||||
let errorPayload: DownloadErrorPayload | null = null;
|
||||
@ -376,10 +353,7 @@ async function downloadPngFile({
|
||||
if (Date.now() >= preparationDeadline || preparationPolls >= 60) {
|
||||
throw new CanvasImageDownloadError("原图仍在准备中", { code: "preparation_timeout", status: 202, requestId: preparing.requestId });
|
||||
}
|
||||
onProgress?.({
|
||||
phase: preparationPhase,
|
||||
message: isConverting ? conversionMessage : preparing.message || "正在准备原图,完成后将自动下载",
|
||||
});
|
||||
onProgress?.({ phase: "preparing", message: preparing.message || "正在准备原图,完成后将自动下载" });
|
||||
const delaySeconds = Math.max(preparationPolls > 5 ? 5 : 1, Math.min(5, Number(preparing.retryAfter) || 3));
|
||||
await waitForRetry(delaySeconds * 1000, signal);
|
||||
continue;
|
||||
@ -410,6 +384,7 @@ async function downloadPngFile({
|
||||
retryAfterSeconds > 0
|
||||
? `请求较多,${retryAfterSeconds} 秒后自动重试...`
|
||||
: "请求较多,正在自动重试...",
|
||||
percent: 8,
|
||||
});
|
||||
await waitForRetry(retryAfterSeconds * 1000, signal);
|
||||
}
|
||||
@ -438,9 +413,7 @@ async function downloadPngFile({
|
||||
const filename =
|
||||
parseAttachmentFilename(response.headers.get("content-disposition")) ||
|
||||
`${filenameBase}.png`;
|
||||
const downloadMessage = isConverting ? "正在下载 PNG..." : "正在下载原图...";
|
||||
onProgress?.({ phase: "downloading", message: downloadMessage });
|
||||
const blob = await readResponseBlobWithProgress(response, onProgress, downloadMessage);
|
||||
const blob = await readResponseBlobWithProgress(response, onProgress);
|
||||
|
||||
onProgress?.({
|
||||
phase: "saving",
|
||||
|
||||
@ -1,44 +1,10 @@
|
||||
export const BEFORE_PAGE_REFRESH = "app:before-page-refresh";
|
||||
export const PAGE_DOWNLOAD_ACTIVE_ATTRIBUTE = "data-page-download-active";
|
||||
export type PageRefreshRequest = {
|
||||
save: (action: () => Promise<void>) => void;
|
||||
block: (message: string) => void;
|
||||
};
|
||||
|
||||
const downloadListeners = new Set<() => void>();
|
||||
let activePageDownloads = 0;
|
||||
|
||||
export function isPageDownloadActive() {
|
||||
return activePageDownloads > 0;
|
||||
}
|
||||
|
||||
export function subscribeToPageDownloadActivity(listener: () => void) {
|
||||
downloadListeners.add(listener);
|
||||
return () => { downloadListeners.delete(listener); };
|
||||
}
|
||||
|
||||
function publishDownloadActivity() {
|
||||
if (typeof document !== "undefined") {
|
||||
document.documentElement?.toggleAttribute(PAGE_DOWNLOAD_ACTIVE_ATTRIBUTE, isPageDownloadActive());
|
||||
}
|
||||
for (const listener of downloadListeners) listener();
|
||||
}
|
||||
|
||||
export async function withActivePageDownload<T>(download: () => Promise<T>): Promise<T> {
|
||||
if (++activePageDownloads === 1) publishDownloadActivity();
|
||||
try {
|
||||
return await download();
|
||||
} finally {
|
||||
if (--activePageDownloads === 0) publishDownloadActivity();
|
||||
}
|
||||
}
|
||||
|
||||
function assertPageDownloadFinished() {
|
||||
if (isPageDownloadActive()) throw new Error("文件正在下载,请等下载完成后再刷新。");
|
||||
}
|
||||
|
||||
export async function preparePageRefresh() {
|
||||
assertPageDownloadFinished();
|
||||
const actions: Array<() => Promise<void>> = [];
|
||||
let blocked = "";
|
||||
window.dispatchEvent(new CustomEvent<PageRefreshRequest>(BEFORE_PAGE_REFRESH, {
|
||||
@ -46,5 +12,4 @@ export async function preparePageRefresh() {
|
||||
}));
|
||||
if (blocked) throw new Error(blocked);
|
||||
for (const action of actions) await action();
|
||||
assertPageDownloadFinished();
|
||||
}
|
||||
|
||||
@ -26,14 +26,14 @@ function getBatchSize() {
|
||||
return Math.max(1, Math.min(50, Math.round(parsed)));
|
||||
}
|
||||
|
||||
export async function runImageArchiveJob({ preferredTaskId }: { preferredTaskId?: string } = {}) {
|
||||
export async function runImageArchiveJob() {
|
||||
return trackRuntimeWork(async () => {
|
||||
const batchSize = getBatchSize();
|
||||
console.log(`[ImageArchiveJob] Start image archive job (batchSize=${batchSize})`);
|
||||
|
||||
await recoverStaleImageArchiveTasks();
|
||||
scheduleImageDownloadPreparation();
|
||||
const storeTasks = await getImageArchiveTasksToStore({ limit: batchSize, preferredTaskId });
|
||||
const storeTasks = await getImageArchiveTasksToStore({ limit: batchSize });
|
||||
let storeSucceeded = 0;
|
||||
let storeFailed = 0;
|
||||
|
||||
|
||||
@ -98,11 +98,8 @@ export async function enqueueImageArchiveTasks(params: {
|
||||
return tasks;
|
||||
}
|
||||
|
||||
export async function getImageArchiveTasksToStore(params: { limit: number; preferredTaskId?: string }) {
|
||||
export async function getImageArchiveTasksToStore(params: { limit: number }) {
|
||||
const now = new Date();
|
||||
const priority = params.preferredTaskId
|
||||
? [asc(sql`case when ${imageArchiveTask.id} = ${params.preferredTaskId} then 0 else 1 end`)]
|
||||
: [];
|
||||
return await db
|
||||
.select()
|
||||
.from(imageArchiveTask)
|
||||
@ -113,7 +110,7 @@ export async function getImageArchiveTasksToStore(params: { limit: number; prefe
|
||||
lt(imageArchiveTask.attemptCount, MAX_IMAGE_ARCHIVE_ATTEMPTS),
|
||||
),
|
||||
)
|
||||
.orderBy(...priority, asc(imageArchiveTask.createdAt), asc(imageArchiveTask.id))
|
||||
.orderBy(asc(imageArchiveTask.createdAt), asc(imageArchiveTask.id))
|
||||
.limit(Math.max(1, Math.min(50, params.limit)));
|
||||
}
|
||||
|
||||
|
||||
@ -6,7 +6,6 @@ type Worker = {
|
||||
running: boolean;
|
||||
scheduled: boolean;
|
||||
requested: boolean;
|
||||
preferredTaskId?: string;
|
||||
retryTimer?: ReturnType<typeof setTimeout>;
|
||||
};
|
||||
function getWorker(): Worker {
|
||||
@ -14,9 +13,8 @@ function getWorker(): Worker {
|
||||
return (root[workerKey] ??= { running: false, scheduled: false, requested: false });
|
||||
}
|
||||
|
||||
export function scheduleImageArchiveWorker(deliveryConfirmed = false, preferredTaskId?: string) {
|
||||
export function scheduleImageArchiveWorker(deliveryConfirmed = false) {
|
||||
const worker = getWorker();
|
||||
worker.preferredTaskId ??= preferredTaskId;
|
||||
worker.requested = true;
|
||||
if (worker.running || (worker.scheduled && !deliveryConfirmed)) return;
|
||||
worker.scheduled = true;
|
||||
@ -33,9 +31,7 @@ export function scheduleImageArchiveWorker(deliveryConfirmed = false, preferredT
|
||||
const { runImageArchiveJob } = await import("@/lib/jobs/image-archive-job");
|
||||
do {
|
||||
worker.requested = false;
|
||||
const nextTaskId = worker.preferredTaskId;
|
||||
worker.preferredTaskId = undefined;
|
||||
const result = await runImageArchiveJob({ preferredTaskId: nextTaskId });
|
||||
const result = await runImageArchiveJob();
|
||||
retryNeeded = result.stats.pendingStore > 0 || result.stats.pendingReplace > 0 || result.pendingDownloads === true;
|
||||
// Stop when only backoff tasks remain; do not spin while storage is down.
|
||||
if (!worker.requested && result.store.total === 0 && result.replace.total === 0 && result.downloadTasks === 0) break;
|
||||
|
||||
@ -4,7 +4,6 @@ import { findImageArchiveDownloadTask } from "./image-archive-db";
|
||||
import { inferOriginalImageUrl } from "@/lib/image-url";
|
||||
import { getImageDownloadExtension } from "@/lib/image-delivery";
|
||||
import { sanitizeCanvasDownloadFileName } from "@/lib/canvas/photoshop-safe-download";
|
||||
import { HeadObjectCommand } from "@aws-sdk/client-s3";
|
||||
|
||||
/** Resolve the archived original without waiting for a separate PNG conversion. */
|
||||
export async function resolveOriginalCdnDownload(source: string, name: string, signal: AbortSignal) {
|
||||
@ -15,10 +14,6 @@ export async function resolveOriginalCdnDownload(source: string, name: string, s
|
||||
let target = new URL(source);
|
||||
if (target.origin !== base.origin && (!origin || target.origin !== new URL(origin).origin)) {
|
||||
const task = await findImageArchiveDownloadTask([...new Set([source, inferOriginalImageUrl(source)])]);
|
||||
if (task?.status === "pending" && !task.targetUrl) {
|
||||
const { scheduleImageArchiveWorker } = await import("./image-archive-worker");
|
||||
scheduleImageArchiveWorker(false, task.id);
|
||||
}
|
||||
target = new URL(task?.targetUrl || source);
|
||||
}
|
||||
if (origin && target.origin === new URL(origin).origin && !target.searchParams.has("token")) {
|
||||
@ -33,32 +28,8 @@ export async function resolveOriginalCdnDownload(source: string, name: string, s
|
||||
// Only metadata crosses the application server. The browser receives the file
|
||||
// from the CDN, including when cross-origin fetch is disabled by storage CORS.
|
||||
const response = await fetch(target, {
|
||||
method: "HEAD", cache: "default",
|
||||
signal: AbortSignal.any([signal, AbortSignal.timeout(3_000)]),
|
||||
}).catch(async (error) => {
|
||||
signal.throwIfAborted();
|
||||
if (target.search) throw error;
|
||||
const { createS3Client, toDbS3UploadConfig } = await import("./service");
|
||||
const storage = toDbS3UploadConfig(config);
|
||||
if (!storage) throw error;
|
||||
const key = decodeURIComponent(target.pathname.slice(base.pathname.replace(/\/$/, "").length + 1));
|
||||
if (!key) throw error;
|
||||
const client = createS3Client(storage);
|
||||
try {
|
||||
const object = await client.send(new HeadObjectCommand({ Bucket: storage.bucket, Key: key }), {
|
||||
abortSignal: AbortSignal.any([signal, AbortSignal.timeout(5_000)]),
|
||||
});
|
||||
return new Response(null, { headers: {
|
||||
"content-type": object.ContentType || "",
|
||||
"content-length": String(object.ContentLength ?? 0),
|
||||
} });
|
||||
} catch (storageError) {
|
||||
const status = (storageError as { $metadata?: { httpStatusCode?: number } })?.$metadata?.httpStatusCode;
|
||||
if (status === 403 || status === 404) throw new Error(`HTTP ${status}`);
|
||||
throw error;
|
||||
} finally {
|
||||
client.destroy();
|
||||
}
|
||||
method: "HEAD", cache: "no-store",
|
||||
signal: AbortSignal.any([signal, AbortSignal.timeout(10_000)]),
|
||||
});
|
||||
if (!response.ok) throw new Error(`HTTP ${response.status}`);
|
||||
const contentType = response.headers.get("content-type") || "";
|
||||
|
||||
@ -112,10 +112,6 @@ test("compatible PNG remains byte-identical; JPEG becomes RGB PNG without resizi
|
||||
const converted = await module.convertImageToPhotoshopPng(jpeg);
|
||||
const metadata = await sharp(converted).metadata();
|
||||
expect(metadata).toMatchObject({ format: "png", space: "srgb", width: 32, height: 48, depth: "uchar" });
|
||||
const webp = await sharp(bytes).withIccProfile("p3").webp().toBuffer();
|
||||
const webpPng = await module.convertImageToPhotoshopPng(webp);
|
||||
const webpPngMetadata = await sharp(webpPng).metadata();
|
||||
expect(webpPngMetadata).toMatchObject({ format: "png", width: 32, height: 48, hasAlpha: true, hasProfile: true });
|
||||
});
|
||||
test("CDN delivery requires a ready compatible asset and a configured HTTPS storage origin", async () => {
|
||||
let url = "https://cdn.example/uploads/test.png";
|
||||
|
||||
@ -242,7 +242,7 @@ test("inline outputs have short, stable preview identities and durable queue pay
|
||||
|
||||
test("background storage starts after delivery and coalesces repeated wakeups", async () => {
|
||||
const callbacks: Array<() => Promise<void>> = [];
|
||||
const preferences: Array<string | undefined> = [];
|
||||
let runs = 0;
|
||||
const module = serverLoader({
|
||||
"next/server": {
|
||||
after: (fn: () => Promise<void>) => {
|
||||
@ -250,10 +250,10 @@ test("background storage starts after delivery and coalesces repeated wakeups",
|
||||
},
|
||||
},
|
||||
"@/lib/jobs/image-archive-job": {
|
||||
runImageArchiveJob: async ({ preferredTaskId }: { preferredTaskId?: string }) => {
|
||||
preferences.push(preferredTaskId);
|
||||
runImageArchiveJob: async () => {
|
||||
runs += 1;
|
||||
return {
|
||||
store: { total: preferences.length === 1 ? 1 : 0 },
|
||||
store: { total: runs === 1 ? 1 : 0 },
|
||||
replace: { total: 0 },
|
||||
stats: { pendingStore: 0, pendingReplace: 0 },
|
||||
downloadTasks: 0,
|
||||
@ -262,11 +262,11 @@ test("background storage starts after delivery and coalesces repeated wakeups",
|
||||
},
|
||||
})("lib/storage/image-archive-worker.ts");
|
||||
module.scheduleImageArchiveWorker();
|
||||
module.scheduleImageArchiveWorker(false, "requested-image");
|
||||
module.scheduleImageArchiveWorker();
|
||||
expect(callbacks).toHaveLength(1);
|
||||
expect(preferences).toEqual([]);
|
||||
expect(runs).toBe(0);
|
||||
await callbacks[0]();
|
||||
expect(preferences).toEqual(["requested-image", undefined]);
|
||||
expect(runs).toBe(2);
|
||||
});
|
||||
|
||||
test("bucket failure retains the provider URL and retry task", async () => {
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
import { test, expect } from "@playwright/test";
|
||||
import { serverLoader } from "../helpers/canvas-download-server-loader";
|
||||
import type { CanvasImageDownloadProgress } from "@/lib/client/canvas-image-download";
|
||||
|
||||
const config = { type: "qiniu-kodo", isEnabled: true, publicUrl: "https://cdn.example" };
|
||||
|
||||
@ -11,8 +10,7 @@ test("original downloads use the archived JPEG rather than the prepared PNG and
|
||||
"./image-archive-db": { findImageArchiveDownloadTask: async () => ({ targetUrl: "https://cdn.example/original.jpg", metadata: {
|
||||
downloadAsset: { status: "ready", url: "https://cdn.example/converted.png", contentType: "image/png" },
|
||||
} }) },
|
||||
fetch: async (url: URL, options: { method: string; cache: string }) => {
|
||||
expect(options.cache).toBe("default");
|
||||
fetch: async (url: URL, options: { method: string }) => {
|
||||
calls.push({ url: url.toString(), method: options.method });
|
||||
return { ok: true, headers: new Headers({ "content-type": "image/jpeg", "content-length": "12345" }),
|
||||
arrayBuffer() { throw new Error("Image bytes must bypass the application"); } };
|
||||
@ -54,40 +52,6 @@ test("temporary third-party URLs are never checked with HEAD when no archive is
|
||||
expect(await module.resolveOriginalCdnDownload("https://upstream.example/image.png", "image", new AbortController().signal)).toBeNull();
|
||||
});
|
||||
|
||||
test("downloading a pending original prioritizes its existing archive task and keeps the proxy available", async () => {
|
||||
const preferred: string[] = [];
|
||||
const module = serverLoader({
|
||||
"@/lib/db/queries": { getDefaultStorageConfig: async () => config },
|
||||
"./image-archive-db": { findImageArchiveDownloadTask: async () => ({ id: "pending-image", status: "pending", targetUrl: null }) },
|
||||
"./image-archive-worker": { scheduleImageArchiveWorker: (_delivery: boolean, id: string) => preferred.push(id) },
|
||||
fetch() { throw new Error("The original must remain available through the proxy while it is queued"); },
|
||||
})("lib/storage/original-image-download.ts");
|
||||
expect(await module.resolveOriginalCdnDownload("https://upstream.example/queued.png", "image", new AbortController().signal)).toBeNull();
|
||||
expect(preferred).toEqual(["pending-image"]);
|
||||
});
|
||||
|
||||
test("a CDN metadata timeout falls back to the original Kodo object without reading its body", async () => {
|
||||
let closed = false;
|
||||
const module = serverLoader({
|
||||
"@/lib/db/queries": { getDefaultStorageConfig: async () => config },
|
||||
"./image-archive-db": {},
|
||||
"./service": {
|
||||
toDbS3UploadConfig: () => ({ bucket: "images" }),
|
||||
createS3Client: () => ({
|
||||
send: async (command: { input: { Bucket: string; Key: string } }) => {
|
||||
expect(command.input).toEqual({ Bucket: "images", Key: "uploads/source.png" });
|
||||
return { ContentType: "image/jpeg", ContentLength: 12345 };
|
||||
},
|
||||
destroy: () => { closed = true; },
|
||||
}),
|
||||
},
|
||||
fetch: async () => { throw new DOMException("Timed out", "TimeoutError"); },
|
||||
})("lib/storage/original-image-download.ts");
|
||||
const result = await module.resolveOriginalCdnDownload("https://cdn.example/uploads/source.png", "图片.png", new AbortController().signal);
|
||||
expect(result).toMatchObject({ delivery: "cdn", filename: "图片.jpg", bytes: 12345 });
|
||||
expect(closed).toBe(true);
|
||||
});
|
||||
|
||||
test("original download metadata reports missing sources with cause, advice and a feedback ID", async () => {
|
||||
const route = serverLoader({
|
||||
"next/server": { NextResponse: Response },
|
||||
@ -137,18 +101,16 @@ function browserMocks() {
|
||||
|
||||
test("chat original downloads use a native CDN download without fetching the image through CORS", async () => {
|
||||
const dom = browserMocks(); const calls: string[] = [];
|
||||
const progress: CanvasImageDownloadProgress[] = [];
|
||||
const client = serverLoader({ ...dom, fetch: async (url: string) => {
|
||||
calls.push(url);
|
||||
return Response.json({ delivery: "cdn", downloadUrl: "https://cdn.example/image.jpg?attname=original.jpg", filename: "original.jpg", bytes: 5000000 });
|
||||
} })("lib/client/canvas-image-download.ts");
|
||||
const result = await client.downloadOriginalImage({ url: "https://cdn.example/image.jpg", onProgress: (event: CanvasImageDownloadProgress) => progress.push(event) });
|
||||
const result = await client.downloadOriginalImage({ url: "https://cdn.example/image.jpg" });
|
||||
expect(result).toEqual({ filename: "original.jpg", bytes: 5000000 });
|
||||
expect(calls).toHaveLength(1);
|
||||
expect(new URL(calls[0], "https://app.example").searchParams.get("download")).toBe("resolve");
|
||||
expect(dom.frames[0].src).toBe("https://cdn.example/image.jpg?attname=original.jpg");
|
||||
expect(dom.links).toHaveLength(0);
|
||||
expect(progress.map(event => event.phase)).toEqual(["preparing", "downloading"]);
|
||||
});
|
||||
|
||||
test("original fallback preserves JPEG bytes and the MIME-derived filename", async () => {
|
||||
@ -161,62 +123,6 @@ test("original fallback preserves JPEG bytes and the MIME-derived filename", asy
|
||||
URL.revokeObjectURL(dom.links[0].href);
|
||||
});
|
||||
|
||||
test("one click prepares a compatible PNG when the CDN original is WebP", async () => {
|
||||
const dom = browserMocks();
|
||||
const calls: string[] = [];
|
||||
const progress: CanvasImageDownloadProgress[] = [];
|
||||
const url = "https://cdn.example/image.png";
|
||||
const client = serverLoader({ ...dom, fetch: async (path: string, init?: RequestInit) => {
|
||||
calls.push(path);
|
||||
if (calls.length === 1) {
|
||||
return Response.json({ delivery: "cdn", downloadUrl: url, filename: "商品.webp", bytes: 500 });
|
||||
}
|
||||
expect(init?.method).toBe("POST");
|
||||
expect(JSON.parse(String(init?.body))).toMatchObject({ url, name: "商品", preparation: "async" });
|
||||
if (calls.length === 2) {
|
||||
return Response.json({ delivery: "preparing", retryAfter: 1, message: "正在准备原图" }, { status: 202 });
|
||||
}
|
||||
return Response.json({ delivery: "cdn", downloadUrl: "https://cdn.example/prepared.png", filename: "商品.png", bytes: 900 });
|
||||
} })("lib/client/canvas-image-download.ts");
|
||||
expect(await client.downloadOriginalImage({ url, name: "商品", onProgress: (event: CanvasImageDownloadProgress) => progress.push(event) }))
|
||||
.toEqual({ filename: "商品.png", bytes: 900 });
|
||||
expect(calls.slice(1)).toEqual(["/api/canvas/download-image", "/api/canvas/download-image"]);
|
||||
expect(progress.map(event => event.phase)).toEqual(["preparing", "converting", "converting", "downloading"]);
|
||||
for (const event of progress.filter(event => event.phase === "converting")) {
|
||||
expect(event.message).toContain("正在转换为兼容 PNG");
|
||||
expect(event.percent).toBeUndefined();
|
||||
}
|
||||
expect(dom.frames.map(frame => frame.src)).toEqual(["https://cdn.example/prepared.png"]);
|
||||
expect(dom.links).toHaveLength(0);
|
||||
});
|
||||
|
||||
test("one click uses the PNG preparation route without buffering an incompatible proxy response", async () => {
|
||||
const dom = browserMocks();
|
||||
const calls: string[] = [];
|
||||
const progress: CanvasImageDownloadProgress[] = [];
|
||||
let cancelled = false;
|
||||
const bytes = Uint8Array.of(137, 80, 78, 71, 13, 10, 26, 10);
|
||||
const client = serverLoader({ ...dom, fetch: async (path: string) => {
|
||||
calls.push(path);
|
||||
if (calls.length === 1) return Response.json({ delivery: "proxy" });
|
||||
if (calls.length === 2) {
|
||||
return new Response(new ReadableStream({ cancel() { cancelled = true; } }),
|
||||
{ headers: { "content-type": "image/avif" } });
|
||||
}
|
||||
return new Response(bytes, { headers: { "content-type": "image/png", "content-length": String(bytes.length) } });
|
||||
} })("lib/client/canvas-image-download.ts");
|
||||
expect(await client.downloadOriginalImage({
|
||||
url: "https://external.example/image", name: "商品", onProgress: (event: CanvasImageDownloadProgress) => progress.push(event),
|
||||
})).toEqual({ filename: "商品.png", bytes: bytes.length });
|
||||
expect(cancelled).toBe(true);
|
||||
expect(calls[2]).toBe("/api/canvas/download-image");
|
||||
expect(progress).toContainEqual({
|
||||
phase: "downloading", message: "正在下载 PNG...", loadedBytes: bytes.length, totalBytes: bytes.length, percent: 99,
|
||||
});
|
||||
expect(dom.links).toHaveLength(1);
|
||||
URL.revokeObjectURL(dom.links[0].href);
|
||||
});
|
||||
|
||||
test("original downloads reject processed references before network access", async () => {
|
||||
const client = serverLoader({ ...browserMocks(), fetch() { throw new Error("Must not fetch a processed image as an original"); } })("lib/client/canvas-image-download.ts");
|
||||
await expect(client.downloadOriginalImage({ url: "https://cdn.example/image.jpg?imageView2/2/w/320&token=signed" })).rejects.toThrow("无法确认原图");
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user