Marc Mintel
1478909a73
All checks were successful
Build & Deploy / 🔍 Prepare (push) Successful in 13s
Build & Deploy / 🧪 QA (push) Successful in 1m27s
Build & Deploy / 🏗️ Build (push) Successful in 7m41s
Build & Deploy / 🚀 Deploy (push) Successful in 26s
Build & Deploy / 🧪 Smoke Test (push) Successful in 49s
Build & Deploy / ⚡ Lighthouse (push) Successful in 4m6s
Build & Deploy / 🔔 Notify (push) Successful in 1s
Use plain/ source URL format instead of base64 encoding. Base64 was causing 404 errors from imgproxy. Plain format verified working via direct curl tests.
65 lines
2.1 KiB
TypeScript
65 lines
2.1 KiB
TypeScript
/**
|
|
* Generates an imgproxy URL for a given source image and options.
|
|
*
|
|
* Documentation: https://docs.imgproxy.net/usage/processing
|
|
*/
|
|
|
|
interface ImgproxyOptions {
|
|
width?: number;
|
|
height?: number;
|
|
resizing_type?: 'fit' | 'fill' | 'fill-down' | 'force' | 'auto';
|
|
gravity?: string;
|
|
enlarge?: boolean;
|
|
extension?: string;
|
|
}
|
|
|
|
export function getImgproxyUrl(src: string, options: ImgproxyOptions = {}): string {
|
|
// Use local proxy path which is rewritten in next.config.mjs
|
|
const baseUrl = '/_img';
|
|
|
|
// Handle local paths or relative URLs
|
|
let absoluteSrc = src;
|
|
if (src.startsWith('/')) {
|
|
const baseUrlForSrc =
|
|
process.env.NEXT_PUBLIC_BASE_URL ||
|
|
(typeof window !== 'undefined' ? window.location.origin : 'https://klz-cables.com');
|
|
if (baseUrlForSrc) {
|
|
absoluteSrc = `${baseUrlForSrc.replace(/\/$/, '')}${src}`;
|
|
}
|
|
}
|
|
|
|
// Development mapping: Map local domains to internal Docker hostnames
|
|
// so imgproxy can fetch images without SSL issues or external routing
|
|
if (process.env.NODE_ENV === 'development') {
|
|
if (absoluteSrc.includes('klz.localhost')) {
|
|
absoluteSrc = absoluteSrc.replace(/^https?:\/\/klz\.localhost/, 'http://klz-app:3000');
|
|
} else if (absoluteSrc.includes('cms.klz.localhost')) {
|
|
absoluteSrc = absoluteSrc.replace(/^https?:\/\/cms\.klz\.localhost/, 'http://klz-cms:8055');
|
|
}
|
|
// Also handle direct container names if needed
|
|
}
|
|
|
|
const {
|
|
width = 0,
|
|
height = 0,
|
|
resizing_type = 'fit',
|
|
gravity = 'sm', // Default to smart gravity
|
|
enlarge = false,
|
|
extension = '',
|
|
} = options;
|
|
|
|
// Processing options
|
|
// Format: /rs:<type>:<width>:<height>:<enlarge>/g:<gravity>
|
|
const processingOptions = [
|
|
`rs:${resizing_type}:${width}:${height}:${enlarge ? 1 : 0}`,
|
|
`g:${gravity}`,
|
|
].join('/');
|
|
|
|
// Using /unsafe/ with plain/ source URL format
|
|
// plain/ format works reliably with imgproxy URL mapping
|
|
// Format: <base_url>/unsafe/<options>/plain/<source_url>[@<extension>]
|
|
const suffix = extension ? `@${extension}` : '';
|
|
|
|
return `${baseUrl}/unsafe/${processingOptions}/plain/${absoluteSrc}${suffix}`;
|
|
}
|