imgproxy-url-builder

A helper library for building Imgproxy URLs.

Installation

npm i --save @bitpatty/imgproxy-url-builder

Usage

You can simply import the param builder and chain your transformations.

For a list of available transformations visit the API documentation page.

import pb from '@bitpatty/imgproxy-url-builder';

// Just the transformer params
// Returns rot:90/bl:10
pb().rotate(90).blur(10).build();

// The transformer params with the target image
// Returns /-/rot:90/bl:10/czM6Ly9teWJ1Y2tldC9teWltYWdlLnBuZw
pb().rotate(90).blur(10).build({
  path: 's3://mybucket/myimage.png',
});

// You can disable path encoding by setting 'plain' to true
// Returns /-/rot:90/bl:10/plain/s3://mybucket/myimage.png
pb().rotate(90).blur(10).build({
  plain: true,
  path: 's3://mybucket/myimage.png',
});

// To sign your URL provide the key and salt
// The path is required to sign your URL!
// Returns /TXf2QXtZkU-ULvrg0pLDqJlWUb7XdHkXD0h6NFWD-mo/rot:90/bl:10/czM6Ly9teWJ1Y2tldC9teWltYWdlLnBuZw
pb()
  .rotate(90)
  .blur(10)
  .build({
    path: 's3://mybucket/myimage.png',
    signature: {
      key: 'a91bdcda48ce22cd7d8d3a0eda93',
      salt: 'a91bdcda48ce22cd7d8d3a0eda93',
    },
  });

// To automatically prepend the imgproxy URL
// provide it as the 'baseUrl' setting
// Returns https://my-imgproxy-instance.example.com/-/rot:90/bl:10/czM6Ly9teWJ1Y2tldC9teWltYWdlLnBuZw
pb().rotate(90).blur(10).build({
  path: 's3://mybucket/myimage.png',
  baseUrl: 'https://my-imgproxy-instance.example.com',
});

Supported Imgproxy Transformations

Transformation	Supported
Signature	☑
Blur	☑
Resize	☑
Size	〰 (via Resize)
Width	〰 (via Resize)
Height	〰 (via Resize)
Dpr	☑
Enlarge	☑
Extend	☑
Gravity	☑
Crop	☑
Padding	☑
Trim	☑
Rotate	☑
Quality	☑
Max Bytes	☑
Background	☑
Sharpen	☑
Watermark	☑
Preset	☑
Cache Buster	☑
Strip Metadata	☑
Strip Color Profile	☑
Auto Rotate	☑
Filename	☑
Format	☑

Suported Imgproxy PRO transformations

Transformation	Supported
Resizing Algorithm	☑
Background Alpha	☑
Adjust	〰 (via brightness / contrast / saturation)
Brightness	☑
Contrast	☑
Saturation	☑
Pixelate	☑
Unsharpening	☑
Watermark URL	☑
Style	❌
JPEG options	☑
PNG options	☑
GIF options	☑
Page	☑
Video Thumbnail Second	☑