flyimg/flyimg

Server image resizing and cropping on the fly base on ImageMagick+MozJPEG

Fund package maintenance!
Open Collective
paypal.me/sadokf

Installs: 242

Dependents: 0

Suggesters: 0

Security: 0

Stars: 798

Watchers: 21

Forks: 86

Open Issues: 33

Type:project


README

Flyimglogo

Backers on Open Collective Sponsors on Open Collective Build Status Codecov License Latest Stable Version]

Image resizing, cropping and compression on the fly with the impressive MozJPEG compression algorithm. One Docker container to build your own Cloudinary-like service.

Fetch an image from anywhere; resize, compress, cache and serve... and serve, and serve, and serve...

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.

<!-- https://mudawn.com/assets/butterfly-3000.jpg -->
<img
  src="https://oi.flyimg.io/upload/w_300,q_90/https://mudawn.com/assets/butterfly-3000.jpg"
/>

Flyimg-demo

Cloud Run Button

Flyimg can be deployed to GCP as a serverless container in one click with Cloud Run Button: Run on Google Cloud

Requirements

You will need to have Docker on your machine. Optionally you can use Docker machine to create a virtual environment. We have tested on Mac, Windows and Ubuntu.

Installation [Deployment mode]

Pull the docker image

docker pull flyimg/flyimg-build

Start the container

docker run -itd -p 8080:80 flyimg/flyimg-build

To use custom parameters, make a copy of parameters.yml to your current directory. Update to suit your needs and run the command with volume parameter to replace the original parameters file.

docker run -itd -p 8080:80 -v $(pwd)/parameters.yml:/var/www/html/config/parameters.yml flyimg/flyimg-build

Check how to provision the application

Installation [Development Mode]

You can spin up your own working server in 10 minutes using the provision scripts for AWS Elastic Beanstalk or the DigitalOcean Ubuntu Droplets (more environments to come). For other environments or if you want to tweak and play in your machine before rolling out, read along...

Installation

You can use git or composer for the first step.

with git

git clone https://github.com/flyimg/flyimg.git

with composer

Create the project with composer create .

composer create-project flyimg/flyimg

CD into the folder and to build the docker image by running:

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 similar, try this same command again.

IMPORTANT! If you cloned the project, only for the first time, you need to run composer install inside the container:

docker exec -it flyimg composer install

Again, it will take a few minutes to download the dependencies. Same as before, if you get some errors you should try running composer install again.

Then run the container:

docker run -itd -p 8080:80 -v $(pwd):/var/www/html --name flyimg flyimg

For Fish shell users:

docker run -itd -p 8080:80 -v $PWD:/var/www/html --name flyimg flyimg

The above command will make the Dockerfile run supervisord command which launches 2 processes: nginx and php-fpm and starts listening on port 8080.

Testing Flyimg service

You can navigate to your machine's IP in port 8080 (ex: http://127.0.0.1:8080/ ) ; you should get a message saying: Hello from Flyimg! and a small homepage of Flyimg already working. If you get any errors at this stage it's most likely that composer has not finished installing or skipped something.

You can test your image resizing service by navigating to: http://127.0.0.1:8080/upload/w_130,h_113,q_90/https://mudawn.com/assets/butterfly-3000.jpg

It's working!

This is fetching an image from Mozilla, resizing it, saving it and serving it.

Full Documentation

Full documentation available here docs/full-documentation.md

How to transform images

You go to your server URLhttp://imgs.kitty.com and append /upload/; after that you can pass these options below, followed by an underscore and a value w_250,q_50 Options are separated by coma (configurable to other separator).

After the options put the source of your image, it can be relative to your server or absolute: /https://my.storage.io/imgs/pretty-kitten.jpg

So to get a pretty kitten at 250 pixels wide, with 50% compression, you would write. <img src="http://imgs.kitty.com/upload/w_250,q_50/https://my.storage.io/imgs/pretty-kitten.jpg">

Demo Application running

https://oi.flyimg.io

https://oi.flyimg.io/upload/w_300,h_250,c_1,o_jpg/https://mudawn.com/assets/butterfly-3000.jpg

resize-test

Community

Supporters

A special thanks to JetBrains for supporting our project with their open source license program.

Jetbrains

Contributors

This project exists thanks to all the people who contributed to it. 68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f666c79696d672f636f6e7472696275746f72732e7376673f77696474683d383930

Backers & Sponsors

Support us with a monthly donation and help us continue our activities.[opencollective.com]

68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f666c79696d672f6261636b6572732e7376673f77696474683d383930 68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f666c79696d672f73706f6e736f722f302f6176617461722e737667 68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f666c79696d672f73706f6e736f722f312f6176617461722e737667 68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f666c79696d672f73706f6e736f722f322f6176617461722e737667 68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f666c79696d672f73706f6e736f722f332f6176617461722e737667 68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f666c79696d672f73706f6e736f722f342f6176617461722e737667 68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f666c79696d672f73706f6e736f722f352f6176617461722e737667 68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f666c79696d672f73706f6e736f722f362f6176617461722e737667 68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f666c79696d672f73706f6e736f722f372f6176617461722e737667 68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f666c79696d672f73706f6e736f722f382f6176617461722e737667 68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f666c79696d672f73706f6e736f722f392f6176617461722e737667

License

The MIT License (MIT). Please see License File for more information.

Enjoy your Flyimaging!