search

scaleflex / filerobot-image-editor

Edit, resize, and filter any image! Any questions or issues, please report to https://github.com/scaleflex/filerobot-image-editor/issues
MIT License
1.35k stars 342 forks source link

Can this library also apply edits to images from server environments? #434

Closed Sf298 closed 4 months ago

Sf298 commented 8 months ago

Hi firstly I'd like to say this is a great project!

TLDR: Does this library work in JS server environments like node/deno?

I want to use this project for non destructive editing in my own project. I can see that I can prevent the default saving behaviour with onBeforeSave etc, then grab the current edits.

My issue is that my plan hinges on applying the changes to photos in an edge function (I'm using supabase+deno).

AhmeeedMostafa commented 7 months ago

Hello @Sf298 , I don't get your use-case correctly but anyways the editor is not intended to be used on BE side, it is for FE side if u need to include it in your project and it is using SSR then u could add 'use client' in the file which is using the plugin or use your used framework's method to avoid rendering the editor on Server Side as there is no Canvas/window...etc. on BE and we don't simulate them there

Sf298 commented 7 months ago

Thanks for your reply @AhmeeedMostafa! Sorry about that, I really didn't explain my use-case that well. But you managed to answer my question anyway!

For anyone curious about my use-case, I'd like the user to edit photos using the UI. But I don't want to actually save the edited file. Instead I want to just save the edit settings. Each time the user wants to view the image, I'd load the original image, apply the edits, then return the edited version to the user. (this has the advantage of being able to keep both the original image and an edited version, while not using up double the storage space) This is called non-destructive editing.

Ideally id want to apply the edits (from the predefined settings) in the server so that I don't leak the original image to the FE. Just in case the user tries to redact a region of the image.

AhmeeedMostafa commented 7 months ago

Hello @Sf298 sorry for the late reply our time doesn't allow us to keep an eye on the issues regularly recently.

u could achieve that by 1- removing the save button removeSaveButton 2- use onModify callback to save the current edits state as JSON in ur DB. 3- to load the design state again on opening the image use loadableDesignState -- note: this one is experimental along time ago and we are aware of some issues related to apply the design state on diff. image size so if u are applying it to the same image everytime I think it would be fine--