Code Monkey home page Code Monkey logo

flyimg / flyimg Goto Github PK

View Code? Open in Web Editor NEW
929.0 21.0 102.0 5.15 MB

Cloud-native application that resizes and crops images on the fly, delivering optimized images in formats such as AVIF, WebP, MozJPEG, or PNG using ImageMagick, with an efficient caching system.

Home Page: https://demo.flyimg.io

License: MIT License

PHP 77.74% CSS 0.59% Shell 0.93% Dockerfile 0.20% HTML 4.56% Python 7.46% JavaScript 8.53%
image-processing resize-images crop-image docker mozjpeg imagemagick compression crop face-detection flyimg

flyimg's Introduction

Flyimg

Flyimg

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

The Flyimg project is a Dockerized application that allows you to resize, crop, and compress images on the fly. One Docker container to build your own Cloudinary-like service.

By default, Flyimg generates the AVIF image format (when the browser supports it) which provides superior compression compared to other formats.

Additionally, Flyimg also generates the WebP format, along with the impressive MozJPEG compression algorithm to optimize images, other formats are supported also such as PNG and GIF.

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://demo.flyimg.io/upload/w_300,q_90/https://mudawn.com/assets/butterfly-3000.jpg"
/>

Flyimg-demo

Demo

Check out our demo page where you can test and review Flying's features:

https://demo.flyimg.io/

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://demo.flyimg.io

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

resize-test

Community

Adopters

See the ADOPTERS.md file for a list of companies / organisations that are using Flyimg.

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.

Backers & Sponsors

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

License

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

Enjoy your Flyimaging!

flyimg's People

Contributors

ahmetb avatar ankush981 avatar baamenabar avatar dependabot[bot] avatar dv336699 avatar grantbirki avatar jamesward avatar jonathanlundstrom avatar lorello avatar louisl avatar opencontent avatar sadok-f avatar schmelto avatar semantic-release-bot avatar wybrenkoelmans avatar xdamman avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

flyimg's Issues

Fix the failed unit test

After merging the last PR #105 the unit test is failing because of the new parameters.
to fix that it need to add new param in OutputImageTest.php

Return 403 when domain is not allowed

Currently only returning 500
Even if I try to exit with error code the framework seems to be catching me first.

public function saveNewFile($sourceFile, $newFileName, $options)
    {
        $newFilePath = TMP_DIR . $newFileName;
        try {
            $tmpFile = $this->saveToTemporaryFile($sourceFile);
        } catch (Exception $e) {
            http_response_code($e->getCode());
            exit($e->getMessage());
        }
        $commandStr = $this->generateCmdString($newFilePath, $tmpFile, $options);

        exec($commandStr, $output, $code);
        if (count($output) === 0) {
            $output = $code;
        } else {
            $output = implode(PHP_EOL, $output);
        }

        if ($code !== 0) {
            throw new \Exception($output . ' Command line: ' . $commandStr);
        }
        $this->filesystem->write($newFileName, stream_get_contents(fopen($newFilePath, 'r')));
        unlink($tmpFile);
        unlink($newFilePath);
    }

and then

public function saveToTemporaryFile($fileUrl)
    {
        //check restricted_domains is enabled
        if ($this->params['restricted_domains'] &&
            is_array($this->params['whitelist_domains']) &&
            !in_array(parse_url($fileUrl, PHP_URL_HOST), $this->params['whitelist_domains'])
        ) {
            throw  new \Exception('Restricted domains enabled, the domain your fetching from is not allowed: ' . parse_url($fileUrl, PHP_URL_HOST), 403);

        }

        if (!$resource = @fopen($fileUrl, "r")) {
            throw  new \Exception('Error occured while trying to read the file Url : ' . $fileUrl, 400);
        }
        $content = "";
        while ($line = fread($resource, 1024)) {
            $content .= $line;
        }
        $tmpFile = TMP_DIR . uniqid("", true);
        file_put_contents($tmpFile, $content);
        return $tmpFile;
    }

but it doesn't work

Concurrency problem

Using ab Apache (Apache HTTP server benchmarking tool) reveal concurrency issue with the app.
After checking, it appears like it's related to the hash generated to each image, in the case of refresh option it should add another random hash to image generated.

Improve current architecture

Current architecture needs to be refactored and improved.

  • Split logic Image processing between resize and face detection.
  • Separating the Image Entity class into 2 classes: InputImage, OutputImage
  • Improve folders and classes naming.

[RFC] Add signature generation

Hey,

Didn't find this in the doc, but maybe it's already implemented ?

Goal of this RFC is to be able to use flyimg as a public hosting media (no domain restriction) but still provides security to avoid "bad" users to generate their owns image (like doing a loop with +1 pixel width) and doing a DDOS attack.

A way to achieve that is to have on the page creating the url to this service, and on flyimage a shared key whichs allows to encode all the parameters with the url into a signature, and check this on the server (if signature invalid throw a 403 / 404 ?). It's very similar on how thumbor works.

WDYT ?

Enhance security logic

In order to add more Security logic and checks, It'll be good to move the check restricted domains logic to a specific Hander: SecurityHandler.

Resource storage URL auto-mapping

If you request a resource to the server's URL it should match automatically to the stored file, where ever it may be.

clarification needed

Improve Logging output

Improve Logging output:

  • Remove access log from the container output
  • Add ExceptionHandler in app.php
  • Add Handler to output catched exception to Stderr

Create transformations API

The idea is to return a URL to the resource instead of an image.
Consider the case where the resource has been uploaded to s3 maybe give the amazon URL.
This may be configurable according to the storage selected.

Update the repo description

how a bout this?

A Dockerized PHP Microservice application to resize and crop images on the fly. Get optimized images with MozJPEG, WebP or PNG using ImageMagick to do Face detection, cropping, Face Blurring, Rotation and many other options. Runs inside a Docker container for easy to deployment. Abstract storage based on FlySystem in order to store images on any provider (local, S3,...).

Send adequate http caching headers

When not requesting a refresh response should be cacheable, but we are sending: Cache-Control:no-cache with all responses.

As a bonus cache expiry times should be configurable. (In the params file maybe? )

Running without Docker

Hi,
i'm trying to make flyimg running without Docker (replace with Apache, and htaccess rewrite) but no luck. Any suggestion ?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.