Flyimg
Image resizing, cropping and compression on the fly with the impressive MozJPEG compression algorithm. A one Docker container to build your own Cloudinary-like service.
You pass the image URL and a set of keys with options, like size or compression. Flyimg will fetch the image, convert it, store it, cache it and serve it. The next time the request comes, it will serve the cached version.
The application is based on Silex microframework.
Installation and setup
Requirements
You will need to have Docker on your machine. Optionally you can use Docker machine to create a virtual environment.
Instalation
Create the project with composer create
or clone it into your server.
composer create-project flyimg/flyimg
CD into the folder and to build the images run:
docker build -t flyimg .
This will download and build the main image, It will take a few minutes. If you get some sort of error related to files not found by apt-get or simmilar, try this same command again.
Then run the container:
docker run -t -d -i -p 8080:80 -v /Users/s.ferjani/DockerProjects/flyimg:/var/www/html --name flyimg flyimg
Dockerfile run supervisord command which lunch 2 process nginx and php-fpm
If you cloned the project, for the first time you need to run composer install inside the main container:
docker exec -it flyimg composer install
Again, it will take a few minutes. Same as before, if you get some errors you should try running composer install
again. After it's done, you can navigate to your machine's IP in port 8080 (ex: http://192.168.99.100:8080/ ) an you should get a message saying: Hello from Docker!. This means fpm is ready to work.
You can test your image resizing service by navigating to: http://127.0.0.1:8080/upload/w_333,h_333,q_90/https://www.mozilla.org/media/img/firefox/firefox-256.e2c1fc556816.jpg
This is fetching an image from Mozilla, resizing it, saving it and serving it.
More configuration details below.
Storage:
Storage files based on Flysystem which is a filesystem abstraction allows you to easily swap out a local filesystem for a remote one. Technical debt is reduced as is the chance of vendor lock-in.
Default storage is Local, but you can use other Adapters like AWS S3, Azure, FTP, Dropbox, ...
Currently, only the local and S3 are implemented as Storage Provider in Flyimg application, but you can add your specific one easily in src/Core/Provider/StorageProvider.php
Using AWS S3 as Storage Provider:
in parameters.yml change the storage_system
option from local to s3, and fill in the aws_s3 options :
storage_system: s3
aws_s3:
access_id: "s3-access-id"
secret_key: "s3-secret-id"
region: "s3-region"
bucket_name: "s3-bucket-name"
Options keys:
options_keys:
moz: mozjpeg
q: quality
unsh: unsharp
w: width
h: height
c: crop
bg: background
st: strip
rz: resize
g: gravity
f: filter
r: rotate
sc: scale
sf: sampling-factor
rf: refresh
Default options values:
default_options:
mozjpeg: 1
quality: 90
unsharp: null
width: null
height: null
crop: null
background: null
strip: 1
resize: null
gravity: Center
filter: Lanczos
rotate: Lanczos
scale: null
sampling-factor: 1x1
refresh: false
Most of these options are ImageMagick flags, many can get pretty advanced, use the ImageMagick docs.
bool
mozjpeg default: 1 : Use moz-jpeg compression library, if false
it fallback to the default ImageMagick compression algorithm.
int
(0-100)
quality default: 90 : Sets the compression level for the output image.
int
width default: null : Sets the target width of the image. If not set, width will be calculated in order to keep aspect ratio.
int
height default: null : Sets the target height of the image. If not set, height will be calculated in order to keep aspect ratio.
Using width AND height
By default setting width and height together, works like defining a rectangle that will define a max-width and max-height and the image will scale propotionally to fit that area without cropping.
By default; width, height, or both will not scale up an image that is smaller than the defined dimensions.
bool
crop default: false : When both width and height are set, this allows the image to be cropped so it fills the width x height area.
string
gravity default: Center : When crop is applied, changing the gravity will define which part of the image is kept inside the crop area.
The basic options are: NorthWest
, North
, NorthEast
, West
, Center
, East
, SouthWest
, South
, SouthEast
.
[...] -gravity NorthWest ...
color
(multiple formats)
background default: white : Sets the background of the canvas for the cases where padding is added to the images. It supports hex, css color names, rgb.
Only css color names are supported without quotation marks.
For the hex code, the hash #
character should be replaced by %23
[...] -background red ...
[...] -background "#ff4455" -> "%23ff4455"
[...] -background "rgb(255,120,100)" ...
int
strip default: 1 : removes exif data and additional color profile.
int
resize default: null : The alternative resizing method to -thumbnail.
radiusxsigma{+gain}{+threshold}
unsharp default: null : Sharpens an image with a convolved Gausian operator. A good example 0.25x0.25+8+0.065
.
[...] -unsharp 0.25x0.25+8+0.065 ...
string
filter default: Lanczos : Resizing algorithm, Triangle is a smoother lighter option
[...] -filter Triangle
int
scale default: null : The "-scale" resize operator is a simplified, faster form of the resize command. Useful for fast exact scaling of pixels.
string
rotate default: null : Apply image rotation (using shear operations) to the image.
example: r_90
or r_-180
int
refresh default: false : Refresh will delete the local cached copy of the file requested and will generate the image again. Also it will send headers with the command done on the image + info returned by the command identity from IM.
Enable Restricted Domains:
Restricted domains disabled by default. This means that you can fetch a resource from any URL. To enable the domain restriction, change in config/parameters.yml
restricted_domains: true
After enabling, you need to put the white listed domains
whitelist_domains:
- www.domain-1.org
- www.domain-2.org
More Examples:
Our application is available here: flyimg.io