高速で画像リサイズができるセキュアな画像プロキシサーバーimgproxyを使う

version: "3.7"
services: 
  imgproxy:
    image: darthsim/imgproxy:latest
    environment:
      # 本番環境ではランダムな16進数の値を用いる
      IMGPROXY_KEY: 1111
      IMGPROXY_SALT: 1111
    ports:
      - "3002:8080"
    restart: always

/%signature/%resizing_type/%width/%height/%gravity/%enlarge/%encoded_source_url.%extension

import { createHmac } from "crypto";

type ImgproxyOptions = {
  resizeTypes: "fit" | "fill" | "auto";
  width: number;
  height: number;
  /**
   * 画像が切り取られたときにどこに合わせるか  
   * `"no" | "so" | "ea" | "we" | "noea" | "nowe" | "soea" | "sowe" | "ce" | "sm" | "fp:%x:%y"` 
   */
  gravity: string;
  enlarge: number;
  extension: "jpg" | "png" | "webp" | "gif" | "ico" | "heic" | "tiff" | "mp4";
};

/**
 * 文字列をURL-SafeなBase64に変換する
 */
const encode = (str: string | Buffer): string => Buffer.from(str as string)
  .toString("base64")
  .replace(/=/g, "")
  .replace(/\+/g, "-")
  .replace(/\//g, "_");

const decode = (hex: string): Buffer => Buffer.from(hex, "hex");

const { IMGPROXY_ORIGIN, IMGPROXY_KEY, IMGPROXY_SALT } = process.env;
const [KEY, SALT] = [IMGPROXY_KEY, IMGPROXY_SALT].map(decode);

const sign = (path: string): string => encode(
  createHmac("sha256", KEY)
    .update(SALT)
    .update(path)
    .digest()
);

export default (url: string | URL, {
  resizeTypes = "auto",
  width = 500,
  height = 500,
  gravity = "ce",
  enlarge = 1,
  extension,
}: Partial<ImgproxyOptions> = {}): URL => {
  if (url instanceof URL) url = url.href;

  const encodedUrl = encode(url);

  let path = "/" + [resizeTypes, width, height, gravity, enlarge, encodedUrl].join("/");
  if (extension) path += `.${extension}`;
  path = sign(path) + path;

  return new URL(path, IMGPROXY_ORIGIN);
};