@websolutespa/bom-mixer-image 1.8.2 → 1.8.4

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @websolutespa/bom-mixer-image
 
+## 1.8.4
+
+### Patch Changes
+
+- Fixing: handling latin1 src
+
+## 1.8.3
+
+### Patch Changes
+
+- Added: ImageStrategy.Token
+- Updated dependencies
+  - @websolutespa/bom-core@1.8.4
+
 ## 1.8.2
 
 ### Patch Changes

package/dist/index.d.ts

@@ -1,7 +1,15 @@
-declare function imageHandler({ domains, sizes, quality, }: {
+import { IImageResize } from '@websolutespa/bom-core';
+
+type IImageHandlerOptions = {
     domains: string[];
     sizes: number[];
     quality: number;
-}): any;
+};
+type IImageOptions = IImageResize & {
+    origin: string;
+    search: string;
+    url: string;
+};
+declare function imageHandler({ domains, sizes, quality, }: IImageHandlerOptions): any;
 
-export { imageHandler };
+export { IImageHandlerOptions, IImageOptions, imageHandler };

package/dist/index.js

@@ -38,6 +38,7 @@ module.exports = __toCommonJS(src_exports);
 var fs = __toESM(require("fs"));
 var path = __toESM(require("path"));
 var import_sharp = __toESM(require("sharp"));
+var import_bom_core = require("@websolutespa/bom-core");
 
 // src/api/api.handler.ts
 function apiHandler(handler) {
@@ -67,7 +68,10 @@ function errorHandler(error, response) {
 }
 
 // src/image/image.handler.ts
+var IMAGE_STRATEGY = process.env.IMAGE_STRATEGY ? process.env.IMAGE_STRATEGY : import_bom_core.ImageStrategy.Mixer;
 var IMAGE_MAX_AGE = 604800;
+var IMAGE_FOCAL_X = 50;
+var IMAGE_FOCAL_Y = 50;
 var IMAGE_QUALITY = 90;
 function imageHandler({
   domains = [],
@@ -78,26 +82,17 @@ function imageHandler({
     // Defining the 'get' method for handling GET requests
     get: async (request, response) => {
       try {
-        const { slugs, origin = "", search = "", w, h, x, y, q } = request.query;
-        if (!Array.isArray(slugs) || slugs.length === 0) {
-          return response.status(400).send("missing slugs parameter");
-        }
-        const width = typeof w === "string" ? parseInt(w) : void 0;
-        if (!width) {
-          return response.status(400).send("missing w parameter");
-        }
-        if (!sizes.includes(width)) {
-          return response.status(400).send("invalid w parameter");
-        }
-        const height = typeof h === "string" ? parseInt(h) : void 0;
-        const focalX = typeof x === "string" ? parseInt(x) : 50;
-        const focalY = typeof y === "string" ? parseInt(y) : 50;
-        const imageQuality = Math.max(30, Math.min(100, typeof q === "string" ? parseInt(q) : quality));
-        if (imageQuality !== quality) {
-          return response.status(400).send("invalid q parameter");
+        let imageOptions;
+        try {
+          imageOptions = IMAGE_STRATEGY === import_bom_core.ImageStrategy.Token ? getEncryptedImageOptions(request, { domains, sizes, quality }) : getImageOptions(request, { domains, sizes, quality });
+        } catch (error) {
+          return response.status(400).json({
+            errors: [{
+              message: error
+            }]
+          });
         }
-        const url = origin + "/" + slugs.join("/") + search;
-        const cachedName = urlToCachedName(url, width, height, focalX, focalY, imageQuality);
+        const cachedName = urlToCachedName(imageOptions);
         if (fs.existsSync(cachedName)) {
           const cachedImage = await getCachedImage(cachedName);
           response.setHeader("Content-Type", "image/webp");
@@ -105,21 +100,18 @@ function imageHandler({
           response.setHeader("Cache-Control", `public, max-age=${IMAGE_MAX_AGE}`);
           return response.send(cachedImage);
         }
-        const { headers } = request;
-        const referer = headers.referer;
-        const publicUrl = process.env.NEXT_PUBLIC_URL || "";
-        if (referer && publicUrl !== "https://" && referer.indexOf(publicUrl) !== 0) {
+        if (isInvalidReferer(request)) {
           return response.status(401).send("you are not authorized to perform this action");
         }
-        if (url.indexOf("http") === -1 && isVercel()) {
-          response.redirect(307, url);
+        if (imageOptions.url.indexOf("http") === -1 && isVercel()) {
+          response.redirect(307, imageOptions.url);
         }
-        const originalImageBuffer = await getOriginalImage(url, domains, request.headers);
+        const originalImageBuffer = await getOriginalImage(imageOptions.url, domains, request.headers);
         if (originalImageBuffer) {
           const originalImage = (0, import_sharp.default)(originalImageBuffer);
-          const resizedImage = await resizeImage(originalImage, width, height, focalX, focalY);
+          const resizedImage = await resizeImage(originalImage, imageOptions);
           const compressedImage = resizedImage.webp({
-            quality: imageQuality
+            quality: imageOptions.q
             // nearLossless: true,
           });
           compressedImage.toFile(cachedName).then(() => console.log("imageHandler.sharp.cached", cachedName)).catch((error) => console.error("imageHandler.sharp.error", cachedName, error));
@@ -131,12 +123,86 @@ function imageHandler({
         }
       } catch (error) {
         console.error("imageHandler.error", error);
-        throw error;
+        return response.status(error.status || 500).json({
+          errors: [{
+            message: error.message || error.name || error.statusText || "An error occurred"
+          }]
+        });
       }
     }
   });
 }
-async function resizeImage(originalImage, resizeWidth, resizeHeight, focalX, focalY) {
+function isInvalidReferer(request) {
+  const { headers } = request;
+  const referer = headers.referer;
+  const publicUrl = process.env.NEXT_PUBLIC_URL || "";
+  if (IMAGE_STRATEGY !== import_bom_core.ImageStrategy.Token && referer && publicUrl !== "https://" && referer.indexOf(publicUrl) !== 0) {
+    return true;
+  }
+  return false;
+}
+function getImageOptions(request, options) {
+  const { slugs, origin = "", search = "", w, h, x, y, q } = request.query;
+  if (!Array.isArray(slugs) || slugs.length === 0) {
+    throw "missing slugs parameter";
+  }
+  const width = typeof w === "string" ? parseInt(w) : void 0;
+  if (!width) {
+    throw "missing w parameter";
+  }
+  if (!options.sizes.includes(width)) {
+    throw "invalid w parameter";
+  }
+  const height = typeof h === "string" ? parseInt(h) : void 0;
+  const focalX = typeof x === "string" ? parseInt(x) : IMAGE_FOCAL_X;
+  const focalY = typeof y === "string" ? parseInt(y) : IMAGE_FOCAL_Y;
+  const imageQuality = Math.max(30, Math.min(100, typeof q === "string" ? parseInt(q) : options.quality));
+  if (imageQuality !== options.quality) {
+    throw "invalid q parameter";
+  }
+  const url = origin + "/" + slugs.join("/") + search;
+  return height ? {
+    w: width,
+    h: height,
+    x: focalX,
+    y: focalY,
+    q: imageQuality,
+    src: url,
+    url,
+    origin: String(origin),
+    search: String(search)
+  } : {
+    w: width,
+    q: imageQuality,
+    src: url,
+    url,
+    origin: String(origin),
+    search: String(search)
+  };
+}
+function getEncryptedImageOptions(request, options) {
+  const { slugs, origin = "", search = "", t } = request.query;
+  if (!Array.isArray(slugs) || slugs.length === 0) {
+    throw "missing slugs parameter";
+  }
+  if (typeof t !== "string") {
+    throw "missing t parameter";
+  }
+  const imageResize = (0, import_bom_core.decryptImageResize)(t);
+  imageResize.src = decodeURIComponent(imageResize.src);
+  const url = decodeURIComponent(origin + "/" + slugs.join("/") + search);
+  if (imageResize.src !== url) {
+    throw `invalid src parameter ${imageResize.src} ${url}`;
+  }
+  return {
+    ...imageResize,
+    url,
+    origin: String(origin),
+    search: String(search)
+  };
+}
+async function resizeImage(originalImage, imageOptions) {
+  const { w: resizeWidth, h: resizeHeight, x: focalX = IMAGE_FOCAL_X, y: focalY = IMAGE_FOCAL_Y } = imageOptions;
   const defaultResizeOptions = () => {
     return originalImage.resize({
       width: resizeWidth,
@@ -146,7 +212,7 @@ async function resizeImage(originalImage, resizeWidth, resizeHeight, focalX, foc
       withoutEnlargement: true
     });
   };
-  if (resizeHeight && (focalX !== 50 || focalY !== 50)) {
+  if (resizeHeight && (focalX !== IMAGE_FOCAL_X || focalY !== IMAGE_FOCAL_Y)) {
     const { width: originalWidth, height: originalHeight } = await originalImage.metadata();
     if (originalWidth && originalHeight) {
       const resizeAspectRatio = resizeWidth / resizeHeight;
@@ -186,10 +252,10 @@ async function resizeImage(originalImage, resizeWidth, resizeHeight, focalX, foc
     return defaultResizeOptions();
   }
 }
-function getOriginalImage(url, domains, headers, skipUrlValidity = false) {
+function getOriginalImage(url, domains, headers) {
   return new Promise((resolve, reject) => {
     if (url.indexOf("http") === 0) {
-      if (!skipUrlValidity && !checkUrlValidity(url, domains)) {
+      if (isInvalidDomain(url, domains)) {
         return reject({ status: 401, message: "invalid origin" });
       }
       fetch(url, {
@@ -242,19 +308,22 @@ function urlToFileName(url) {
 function isVercel() {
   return process && process.env && String(process.env.VERCEL) === "1";
 }
-function urlToCachedName(url, width, height, focalX, focalY, quality) {
-  const fileName = urlToFileName(url);
+function urlToCachedName(options) {
+  const fileName = urlToFileName(options.url);
   const parsedName = path.parse(fileName);
   const cacheDir = isVercel() ? path.join("/tmp", ".cache") : path.join(process.cwd(), ".cache");
   if (!fs.existsSync(cacheDir)) {
     fs.mkdirSync(cacheDir);
   }
-  const cachedName = path.join(cacheDir, `${parsedName.name}_w_${width}_h_${height || 0}_x_${focalX || 50}_y_${focalY || 50}_q_${quality}${parsedName.ext}`);
+  const cachedName = options.h ? path.join(cacheDir, `${parsedName.name}_w_${options.w}_h_${options.h || 0}_x_${options.x || IMAGE_FOCAL_X}_y_${options.y || IMAGE_FOCAL_Y}_q_${options.q}${parsedName.ext}`) : path.join(cacheDir, `${parsedName.name}_w_${options.w}_q_${options.q}${parsedName.ext}`);
   return cachedName;
 }
-function checkUrlValidity(src, domains) {
+function isInvalidDomain(src, domains) {
+  if (IMAGE_STRATEGY === import_bom_core.ImageStrategy.Token) {
+    return false;
+  }
   const url = new URL(src);
-  return domains.includes(url.hostname);
+  return !domains.includes(url.hostname);
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/index.mjs

@@ -2,6 +2,7 @@
 import * as fs from "fs";
 import * as path from "path";
 import sharp from "sharp";
+import { decryptImageResize, ImageStrategy } from "@websolutespa/bom-core";
 
 // src/api/api.handler.ts
 function apiHandler(handler) {
@@ -31,7 +32,10 @@ function errorHandler(error, response) {
 }
 
 // src/image/image.handler.ts
+var IMAGE_STRATEGY = process.env.IMAGE_STRATEGY ? process.env.IMAGE_STRATEGY : ImageStrategy.Mixer;
 var IMAGE_MAX_AGE = 604800;
+var IMAGE_FOCAL_X = 50;
+var IMAGE_FOCAL_Y = 50;
 var IMAGE_QUALITY = 90;
 function imageHandler({
   domains = [],
@@ -42,26 +46,17 @@ function imageHandler({
     // Defining the 'get' method for handling GET requests
     get: async (request, response) => {
       try {
-        const { slugs, origin = "", search = "", w, h, x, y, q } = request.query;
-        if (!Array.isArray(slugs) || slugs.length === 0) {
-          return response.status(400).send("missing slugs parameter");
-        }
-        const width = typeof w === "string" ? parseInt(w) : void 0;
-        if (!width) {
-          return response.status(400).send("missing w parameter");
-        }
-        if (!sizes.includes(width)) {
-          return response.status(400).send("invalid w parameter");
-        }
-        const height = typeof h === "string" ? parseInt(h) : void 0;
-        const focalX = typeof x === "string" ? parseInt(x) : 50;
-        const focalY = typeof y === "string" ? parseInt(y) : 50;
-        const imageQuality = Math.max(30, Math.min(100, typeof q === "string" ? parseInt(q) : quality));
-        if (imageQuality !== quality) {
-          return response.status(400).send("invalid q parameter");
+        let imageOptions;
+        try {
+          imageOptions = IMAGE_STRATEGY === ImageStrategy.Token ? getEncryptedImageOptions(request, { domains, sizes, quality }) : getImageOptions(request, { domains, sizes, quality });
+        } catch (error) {
+          return response.status(400).json({
+            errors: [{
+              message: error
+            }]
+          });
         }
-        const url = origin + "/" + slugs.join("/") + search;
-        const cachedName = urlToCachedName(url, width, height, focalX, focalY, imageQuality);
+        const cachedName = urlToCachedName(imageOptions);
         if (fs.existsSync(cachedName)) {
           const cachedImage = await getCachedImage(cachedName);
           response.setHeader("Content-Type", "image/webp");
@@ -69,21 +64,18 @@ function imageHandler({
           response.setHeader("Cache-Control", `public, max-age=${IMAGE_MAX_AGE}`);
           return response.send(cachedImage);
         }
-        const { headers } = request;
-        const referer = headers.referer;
-        const publicUrl = process.env.NEXT_PUBLIC_URL || "";
-        if (referer && publicUrl !== "https://" && referer.indexOf(publicUrl) !== 0) {
+        if (isInvalidReferer(request)) {
           return response.status(401).send("you are not authorized to perform this action");
         }
-        if (url.indexOf("http") === -1 && isVercel()) {
-          response.redirect(307, url);
+        if (imageOptions.url.indexOf("http") === -1 && isVercel()) {
+          response.redirect(307, imageOptions.url);
         }
-        const originalImageBuffer = await getOriginalImage(url, domains, request.headers);
+        const originalImageBuffer = await getOriginalImage(imageOptions.url, domains, request.headers);
         if (originalImageBuffer) {
           const originalImage = sharp(originalImageBuffer);
-          const resizedImage = await resizeImage(originalImage, width, height, focalX, focalY);
+          const resizedImage = await resizeImage(originalImage, imageOptions);
           const compressedImage = resizedImage.webp({
-            quality: imageQuality
+            quality: imageOptions.q
             // nearLossless: true,
           });
           compressedImage.toFile(cachedName).then(() => console.log("imageHandler.sharp.cached", cachedName)).catch((error) => console.error("imageHandler.sharp.error", cachedName, error));
@@ -95,12 +87,86 @@ function imageHandler({
         }
       } catch (error) {
         console.error("imageHandler.error", error);
-        throw error;
+        return response.status(error.status || 500).json({
+          errors: [{
+            message: error.message || error.name || error.statusText || "An error occurred"
+          }]
+        });
       }
     }
   });
 }
-async function resizeImage(originalImage, resizeWidth, resizeHeight, focalX, focalY) {
+function isInvalidReferer(request) {
+  const { headers } = request;
+  const referer = headers.referer;
+  const publicUrl = process.env.NEXT_PUBLIC_URL || "";
+  if (IMAGE_STRATEGY !== ImageStrategy.Token && referer && publicUrl !== "https://" && referer.indexOf(publicUrl) !== 0) {
+    return true;
+  }
+  return false;
+}
+function getImageOptions(request, options) {
+  const { slugs, origin = "", search = "", w, h, x, y, q } = request.query;
+  if (!Array.isArray(slugs) || slugs.length === 0) {
+    throw "missing slugs parameter";
+  }
+  const width = typeof w === "string" ? parseInt(w) : void 0;
+  if (!width) {
+    throw "missing w parameter";
+  }
+  if (!options.sizes.includes(width)) {
+    throw "invalid w parameter";
+  }
+  const height = typeof h === "string" ? parseInt(h) : void 0;
+  const focalX = typeof x === "string" ? parseInt(x) : IMAGE_FOCAL_X;
+  const focalY = typeof y === "string" ? parseInt(y) : IMAGE_FOCAL_Y;
+  const imageQuality = Math.max(30, Math.min(100, typeof q === "string" ? parseInt(q) : options.quality));
+  if (imageQuality !== options.quality) {
+    throw "invalid q parameter";
+  }
+  const url = origin + "/" + slugs.join("/") + search;
+  return height ? {
+    w: width,
+    h: height,
+    x: focalX,
+    y: focalY,
+    q: imageQuality,
+    src: url,
+    url,
+    origin: String(origin),
+    search: String(search)
+  } : {
+    w: width,
+    q: imageQuality,
+    src: url,
+    url,
+    origin: String(origin),
+    search: String(search)
+  };
+}
+function getEncryptedImageOptions(request, options) {
+  const { slugs, origin = "", search = "", t } = request.query;
+  if (!Array.isArray(slugs) || slugs.length === 0) {
+    throw "missing slugs parameter";
+  }
+  if (typeof t !== "string") {
+    throw "missing t parameter";
+  }
+  const imageResize = decryptImageResize(t);
+  imageResize.src = decodeURIComponent(imageResize.src);
+  const url = decodeURIComponent(origin + "/" + slugs.join("/") + search);
+  if (imageResize.src !== url) {
+    throw `invalid src parameter ${imageResize.src} ${url}`;
+  }
+  return {
+    ...imageResize,
+    url,
+    origin: String(origin),
+    search: String(search)
+  };
+}
+async function resizeImage(originalImage, imageOptions) {
+  const { w: resizeWidth, h: resizeHeight, x: focalX = IMAGE_FOCAL_X, y: focalY = IMAGE_FOCAL_Y } = imageOptions;
   const defaultResizeOptions = () => {
     return originalImage.resize({
       width: resizeWidth,
@@ -110,7 +176,7 @@ async function resizeImage(originalImage, resizeWidth, resizeHeight, focalX, foc
       withoutEnlargement: true
     });
   };
-  if (resizeHeight && (focalX !== 50 || focalY !== 50)) {
+  if (resizeHeight && (focalX !== IMAGE_FOCAL_X || focalY !== IMAGE_FOCAL_Y)) {
     const { width: originalWidth, height: originalHeight } = await originalImage.metadata();
     if (originalWidth && originalHeight) {
       const resizeAspectRatio = resizeWidth / resizeHeight;
@@ -150,10 +216,10 @@ async function resizeImage(originalImage, resizeWidth, resizeHeight, focalX, foc
     return defaultResizeOptions();
   }
 }
-function getOriginalImage(url, domains, headers, skipUrlValidity = false) {
+function getOriginalImage(url, domains, headers) {
   return new Promise((resolve, reject) => {
     if (url.indexOf("http") === 0) {
-      if (!skipUrlValidity && !checkUrlValidity(url, domains)) {
+      if (isInvalidDomain(url, domains)) {
         return reject({ status: 401, message: "invalid origin" });
       }
       fetch(url, {
@@ -206,19 +272,22 @@ function urlToFileName(url) {
 function isVercel() {
   return process && process.env && String(process.env.VERCEL) === "1";
 }
-function urlToCachedName(url, width, height, focalX, focalY, quality) {
-  const fileName = urlToFileName(url);
+function urlToCachedName(options) {
+  const fileName = urlToFileName(options.url);
   const parsedName = path.parse(fileName);
   const cacheDir = isVercel() ? path.join("/tmp", ".cache") : path.join(process.cwd(), ".cache");
   if (!fs.existsSync(cacheDir)) {
     fs.mkdirSync(cacheDir);
   }
-  const cachedName = path.join(cacheDir, `${parsedName.name}_w_${width}_h_${height || 0}_x_${focalX || 50}_y_${focalY || 50}_q_${quality}${parsedName.ext}`);
+  const cachedName = options.h ? path.join(cacheDir, `${parsedName.name}_w_${options.w}_h_${options.h || 0}_x_${options.x || IMAGE_FOCAL_X}_y_${options.y || IMAGE_FOCAL_Y}_q_${options.q}${parsedName.ext}`) : path.join(cacheDir, `${parsedName.name}_w_${options.w}_q_${options.q}${parsedName.ext}`);
   return cachedName;
 }
-function checkUrlValidity(src, domains) {
+function isInvalidDomain(src, domains) {
+  if (IMAGE_STRATEGY === ImageStrategy.Token) {
+    return false;
+  }
   const url = new URL(src);
-  return domains.includes(url.hostname);
+  return !domains.includes(url.hostname);
 }
 export {
   imageHandler

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@websolutespa/bom-mixer-image",
-  "version": "1.8.2",
+  "version": "1.8.4",
   "description": "Mixer Image module of the BOM Repository",
   "keywords": [
     "bom",

package/src/image/image.handler.ts

@@ -8,63 +8,55 @@ import * as path from 'path';
 // Importing 'sharp' for image processing
 import sharp from 'sharp';
 // Importing 'apiHandler' from '../api/api.handler'
+import { decryptImageResize, IImageResize, ImageStrategy } from '@websolutespa/bom-core';
 import { apiHandler } from '../api/api.handler';
 
+const IMAGE_STRATEGY: ImageStrategy = process.env.IMAGE_STRATEGY ?
+  process.env.IMAGE_STRATEGY as ImageStrategy :
+  ImageStrategy.Mixer;
+
 const IMAGE_MAX_AGE = 604800;
 const IMAGE_FOCAL_X = 50;
 const IMAGE_FOCAL_Y = 50;
 const IMAGE_QUALITY = 90;
 
+export type IImageHandlerOptions = {
+  domains: string[];
+  sizes: number[];
+  quality: number;
+};
+
+export type IImageOptions = IImageResize & {
+  origin: string;
+  search: string;
+  url: string;
+};
+
 // Exporting the 'imageHandler' function
 export function imageHandler({
   domains = [],
   sizes = [],
   quality = IMAGE_QUALITY,
-}: {
-  domains: string[];
-  sizes: number[];
-  quality: number;
-}) {
+}: IImageHandlerOptions) {
   // Returning the 'apiHandler' function with a configuration object
   return apiHandler({
     // Defining the 'get' method for handling GET requests
     get: async (request: NextApiRequest, response: NextApiResponse) => {
       try {
-        // Destructuring 'url', 'w', 'h', 'x', 'y', 'q' from the request query
-        const { slugs, origin = '', search = '', w, h, x, y, q } = request.query;
-        // Checking slugs
-        if (!Array.isArray(slugs) || slugs.length === 0) {
-          // console.error('imageHandler', 'missing slugs parameter');
-          return response.status(400).send('missing slugs parameter');
-        }
-        // Parsing 'w' to an integer and assigning it to 'width'
-        const width = typeof w === 'string' ? parseInt(w) : undefined;
-        // Checking if 'width' is not defined
-        if (!width) {
-          // Logging an error message and returning a 400 status code with a message
-          // console.error('imageHandler', 'missing w parameter');
-          return response.status(400).send('missing w parameter');
-        }
-        // if (width > 2048) {
-        if (!sizes.includes(width)) {
-          return response.status(400).send('invalid w parameter');
-        }
-        // Parsing 'h' to an integer and assigning it to 'height'
-        const height = typeof h === 'string' ? parseInt(h) : undefined;
-        // Parsing 'x' to an integer and assigning it to 'focalX'
-        const focalX = typeof x === 'string' ? parseInt(x) : 50;
-        // Parsing 'y' to an integer and assigning it to 'focalY'
-        const focalY = typeof y === 'string' ? parseInt(y) : 50;
-        // Parsing 'q' to an integer, ensuring it's between 30 and 100, and assigning it to 'imageQuality'
-        const imageQuality = Math.max(30, Math.min(100, (typeof q === 'string' ? parseInt(q) : quality)));
-        // if (width > 2048) {
-        if (imageQuality !== quality) {
-          return response.status(400).send('invalid q parameter');
+        let imageOptions: IImageOptions;
+        try {
+          imageOptions = (IMAGE_STRATEGY === ImageStrategy.Token ?
+            getEncryptedImageOptions(request, { domains, sizes, quality }) :
+            getImageOptions(request, { domains, sizes, quality }));
+        } catch (error) {
+          return response.status(400).json({
+            errors: [{
+              message: error,
+            }],
+          });
         }
-        // Generating url
-        const url = origin + '/' + slugs.join('/') + search;
         // Generating a cached name for the image
-        const cachedName = urlToCachedName(url, width, height, focalX, focalY, imageQuality);
+        const cachedName = urlToCachedName(imageOptions);
         // Checking if the cached image exists
         if (fs.existsSync(cachedName)) {
           // console.log('imageHandler.fromCache', cachedName);
@@ -80,33 +72,25 @@ export function imageHandler({
           return response.send(cachedImage);
         }
         // Check referrer
-        const { headers } = request;
-        const referer = headers.referer;
-        const publicUrl = process.env.NEXT_PUBLIC_URL || '';
-        // console.log('referef', referer, 'publicUrl', publicUrl);
-        if (
-          referer &&
-          publicUrl !== 'https://' &&
-          referer.indexOf(publicUrl) !== 0
-        ) {
+        if (isInvalidReferer(request)) {
           return response.status(401).send('you are not authorized to perform this action');
         }
         // Temporarily fix Vercel local image issue
-        if (url.indexOf('http') === -1 && isVercel()) {
-          response.redirect(307, url);
+        if (imageOptions.url.indexOf('http') === -1 && isVercel()) {
+          response.redirect(307, imageOptions.url);
         }
         // Reading the original image
-        const originalImageBuffer = await getOriginalImage(url, domains, request.headers);
+        const originalImageBuffer = await getOriginalImage(imageOptions.url, domains, request.headers);
         // Checking if the original image exists
         if (originalImageBuffer) {
           // Original image
           const originalImage = sharp(originalImageBuffer);
           // Resizing the original image and converting it to WebP format
-          const resizedImage = await resizeImage(originalImage, width, height, focalX, focalY);
+          const resizedImage = await resizeImage(originalImage, imageOptions);
           // Converting resized image to WebP format
           const compressedImage = resizedImage
             .webp({
-              quality: imageQuality,
+              quality: imageOptions.q,
               // nearLossless: true,
             });
           // Saving the resized image to the cache
@@ -124,16 +108,135 @@ export function imageHandler({
           // Sending data in the response
           return response.end(data);
         }
-      } catch (error) {
+      } catch (error: any) {
         // Logging an error message and throwing the error
         console.error('imageHandler.error', error);
-        throw error;
+        return response.status(error.status || 500).json({
+          errors: [{
+            message: error.message || error.name || error.statusText || 'An error occurred',
+          }],
+        });
       }
     },
   });
 }
 
-async function resizeImage(originalImage: sharp.Sharp, resizeWidth: number, resizeHeight: number | undefined, focalX: number, focalY: number): Promise<sharp.Sharp> {
+function isInvalidReferer(request: NextApiRequest): boolean {
+  const { headers } = request;
+  const referer = headers.referer;
+  const publicUrl = process.env.NEXT_PUBLIC_URL || '';
+  // console.log('referef', referer, 'publicUrl', publicUrl, 'IMAGE_STRATEGY', IMAGE_STRATEGY, ImageStrategy.Token);
+  if (
+    IMAGE_STRATEGY !== ImageStrategy.Token &&
+    referer &&
+    publicUrl !== 'https://' &&
+    referer.indexOf(publicUrl) !== 0
+  ) {
+    return true;
+  }
+  return false;
+}
+
+function getImageOptions(request: NextApiRequest, options: IImageHandlerOptions): IImageOptions {
+  // Destructuring 'slugs', 'origin', 'search', 'w', 'h', 'x', 'y', 'q' from the request query
+  const { slugs, origin = '', search = '', w, h, x, y, q } = request.query;
+  // Checking slugs
+  if (!Array.isArray(slugs) || slugs.length === 0) {
+    // console.error('imageHandler', 'missing slugs parameter');
+    throw 'missing slugs parameter';
+  }
+  // Parsing 'w' to an integer and assigning it to 'width'
+  const width = typeof w === 'string' ? parseInt(w) : undefined;
+  // Checking if 'width' is not defined
+  if (!width) {
+    // Logging an error message and returning a 400 status code with a message
+    // console.error('imageHandler', 'missing w parameter');
+    throw 'missing w parameter';
+  }
+  // if (width > 2048) {
+  if (!options.sizes.includes(width)) {
+    throw 'invalid w parameter';
+  }
+  // Parsing 'h' to an integer and assigning it to 'height'
+  const height = typeof h === 'string' ? parseInt(h) : undefined;
+  // Parsing 'x' to an integer and assigning it to 'focalX'
+  const focalX = typeof x === 'string' ? parseInt(x) : IMAGE_FOCAL_X;
+  // Parsing 'y' to an integer and assigning it to 'focalY'
+  const focalY = typeof y === 'string' ? parseInt(y) : IMAGE_FOCAL_Y;
+  // Parsing 'q' to an integer, ensuring it's between 30 and 100, and assigning it to 'imageQuality'
+  const imageQuality = Math.max(30, Math.min(100, (typeof q === 'string' ? parseInt(q) : options.quality)));
+  // if (width > 2048) {
+  if (imageQuality !== options.quality) {
+    throw 'invalid q parameter';
+  }
+  // Generating url
+  const url = origin + '/' + slugs.join('/') + search;
+  //
+  return height ? {
+    w: width,
+    h: height,
+    x: focalX,
+    y: focalY,
+    q: imageQuality,
+    src: url,
+    url: url,
+    origin: String(origin),
+    search: String(search),
+  } : {
+    w: width,
+    q: imageQuality,
+    src: url,
+    url: url,
+    origin: String(origin),
+    search: String(search),
+  };
+}
+
+function getEncryptedImageOptions(request: NextApiRequest, options: IImageHandlerOptions): IImageOptions {
+  // Destructuring 'slugs', 'origin', 'search', 't' from the request query
+  const { slugs, origin = '', search = '', t } = request.query;
+  // Checking slugs
+  if (!Array.isArray(slugs) || slugs.length === 0) {
+    // console.error('imageHandler', 'missing slugs parameter');
+    throw 'missing slugs parameter';
+  }
+  if (typeof t !== 'string') {
+    throw 'missing t parameter';
+  }
+  const imageResize = decryptImageResize(t);
+  /*
+  // Checking if 'w' is not defined
+  if (!imageResize.w) {
+    throw 'missing w parameter';
+  }
+  // if (width > 2048) {
+  if (!options.sizes.includes(imageResize.w)) {
+    throw 'invalid w parameter';
+  }
+  // Ensuring 'q' is between 30 and 100, and assigning it to 'imageQuality'
+  const imageQuality = Math.max(30, Math.min(100, imageResize.q || options.quality));
+  if (imageQuality !== options.quality) {
+    throw 'invalid q parameter';
+  }
+  */
+  imageResize.src = decodeURIComponent(imageResize.src);
+  // Generating url
+  const url = decodeURIComponent(origin + '/' + slugs.join('/') + search);
+  //
+  if (imageResize.src !== url) {
+    throw `invalid src parameter ${imageResize.src} ${url}`;
+  }
+  //
+  return {
+    ...imageResize,
+    url: url,
+    origin: String(origin),
+    search: String(search),
+  };
+}
+
+async function resizeImage(originalImage: sharp.Sharp, imageOptions: IImageOptions): Promise<sharp.Sharp> {
+  const { w: resizeWidth, h: resizeHeight, x: focalX = IMAGE_FOCAL_X, y: focalY = IMAGE_FOCAL_Y } = imageOptions;
   const defaultResizeOptions = () => {
     return originalImage.resize({
       width: resizeWidth,
@@ -143,7 +246,7 @@ async function resizeImage(originalImage: sharp.Sharp, resizeWidth: number, resi
       withoutEnlargement: true,
     });
   };
-  if (resizeHeight && (focalX !== 50 || focalY !== 50)) {
+  if (resizeHeight && (focalX !== IMAGE_FOCAL_X || focalY !== IMAGE_FOCAL_Y)) {
     const { width: originalWidth, height: originalHeight } = await originalImage.metadata();
     if (originalWidth && originalHeight) {
       const resizeAspectRatio = resizeWidth / resizeHeight;
@@ -191,16 +294,12 @@ async function resizeImage(originalImage: sharp.Sharp, resizeWidth: number, resi
 }
 
 // Defining the 'getOriginalImage' function
-function getOriginalImage(url: string, domains: string[], headers: IncomingHttpHeaders, skipUrlValidity: boolean = false): Promise<Buffer> {
+function getOriginalImage(url: string, domains: string[], headers: IncomingHttpHeaders): Promise<Buffer> {
   // Returning a new promise
   return new Promise((resolve, reject) => {
     // Checking if 'url' starts with 'http'
     if (url.indexOf('http') === 0) {
-      if (
-        !skipUrlValidity &&
-        !checkUrlValidity(url, domains)
-      ) {
-        // console.error('imageHandler.getOriginalImage.error invalid origin');
+      if (isInvalidDomain(url, domains)) {
         return reject({ status: 401, message: 'invalid origin' });
       }
       // Fetching the image from the URL
@@ -236,21 +335,6 @@ function getOriginalImage(url: string, domains: string[], headers: IncomingHttpH
         // Resolving the promise with the image data
         return resolve(data);
       });
-      /*
-      // Check if the file exists
-      if (fs.existsSync(filePath)) {
-        fs.readFile(filePath, (error, data) => {
-          if (error) {
-            return reject(error);
-          }
-          // Resolving the promise with the image data
-          return resolve(data);
-        });
-      } else {
-        const origin = getOrigin(headers);
-        return getOriginalImage(`${origin}${url}`, domains, headers, true);
-      }
-      */
     }
   });
 }
@@ -291,9 +375,9 @@ function isVercel(): boolean {
 }
 
 // Defining the 'urlToCachedName' function
-function urlToCachedName(url: string, width: number, height: number | undefined, focalX: number | undefined, focalY: number | undefined, quality: number): string {
+function urlToCachedName(options: IImageOptions): string {
   // Converting the URL to a file name
-  const fileName = urlToFileName(url);
+  const fileName = urlToFileName(options.url);
   // Parsing the file name
   const parsedName = path.parse(fileName);
   // Defining the cache directory
@@ -306,12 +390,17 @@ function urlToCachedName(url: string, width: number, height: number | undefined,
     fs.mkdirSync(cacheDir);
   }
   // Generating the cached name
-  const cachedName = path.join(cacheDir, `${parsedName.name}_w_${width}_h_${height || 0}_x_${focalX || 50}_y_${focalY || 50}_q_${quality}${parsedName.ext}`);
+  const cachedName = options.h ?
+    path.join(cacheDir, `${parsedName.name}_w_${options.w}_h_${options.h || 0}_x_${options.x || IMAGE_FOCAL_X}_y_${options.y || IMAGE_FOCAL_Y}_q_${options.q}${parsedName.ext}`) :
+    path.join(cacheDir, `${parsedName.name}_w_${options.w}_q_${options.q}${parsedName.ext}`);
   // Returning the cached name
   return cachedName;
 }
 
-function checkUrlValidity(src: string, domains: string[]): boolean {
+function isInvalidDomain(src: string, domains: string[]): boolean {
+  if (IMAGE_STRATEGY === ImageStrategy.Token) {
+    return false;
+  }
   const url = new URL(src);
-  return domains.includes(url.hostname);
+  return !domains.includes(url.hostname);
 }