Skip to content
This repository has been archived by the owner on Dec 23, 2023. It is now read-only.

[Future Request] response not only a link to the original image, but also a collection with modified dimensions using strapi-plugin-responsive-image #6

Closed
Yurgeman opened this issue Oct 19, 2021 · 5 comments

Comments

@Yurgeman
Copy link

Using the strapi-plugin-responsive-image plugin allows you to generate several image formats, it is very convenient.

It would be great if strape-plugin-react-editor js in response gave an array of images of different formats

Снимок экрана 2021-10-19 в 22 29 01

To do this, you need to add the format field to the loader's response, which comes in the response from Strapi Upload
EditorJs allows you to give any additional fields in the response

@melishev
Copy link
Owner

Hi @Yurgeman, thanks for your input, I am pleased.

I don't quite understand what this might be useful for. Standard use of Editor.js means embedding an image either at the full width of the screen or at the width of the text (again, this is the standard solution, and which I personally adhere to in my projects).

At the moment, I do not see a plus from adding this functionality to this project. If you want to use images of smaller formats to implement lazy-load or something similar, then this can be solved in another way. On the contrary, I see only a drawback - the response from the server will become quite large for comfortable use. If we implement your proposal, then most of the information given by the server will be occupied by built-in additional extensions, which will have a negative effect.

At the time of plugin development, as far as I remember, I specially removed all parameters except 'src' from the response with the image transmitted from strapi media, so that the answer was as easy as possible.

@Yurgeman
Copy link
Author

Hi @melishev
lazyload is a good practice. But you need to keep in mind that people watch websites at different screen resolutions and at different Internet speeds.

In addition, you may need to use webp or a standard image format. Depending on browser support.

It is also necessary to take into account the human factor. A content Manager "with the best intentions" can upload a 10-20 MB image.

So I believe a few kilobytes of json and a few milliseconds of server response. worth it :-)

@melishev
Copy link
Owner

@Yurgeman

1 - I totally agree and lazy-load is really good, but now it is not necessary to use several formats of one image, it is quite possible to use the same base64 and implement something similar as on medium.com, when the blurry image is loaded first, and after original.

2 - I don't see any point in this, strapi currently does not have a built-in ability to load the same file in different formats. And even if there is, then it already needs to be controlled at the stage of adding content.

3 - no matter how ideal the system is, again, you have to control your managers, give guidelines, or write your controller according to the maximum size of the input data, depending on the type. In my opinion, strapi has such an opportunity. Strapi also has a built-in optimization of the used images, which is configurable in the settings. In any case, this problem should not be solved by my plugin, but by you personally!

So in any case, all the above proposals you have given need to be publicly reviewed and voted on, because even if this approach is implemented, it will significantly increase the data returned by the plugin, which may not be liked by many users.

@melishev
Copy link
Owner

@Yurgeman

If you are really interested in implementing these suggestions, then you could create a settings section inside strapi itself, where users could customize what they need. But at the moment I would not do this, in order to wait for Strapiv4, and already implement all the innovations based on it

@melishev
Copy link
Owner

Hello @Yurgeman, if you have no desire to continue this PR offer or new ideas, please let me know so that I could close this Issue

github-actions bot pushed a commit that referenced this issue Mar 13, 2022
# [2.0.0-beta.2](v2.0.0-beta.1...v2.0.0-beta.2) (2022-03-13)

### Bug Fixes

* fixed the image tool. Now able to add images from the media library, and automatically shuts the media library window after saving. ([fb5a907](fb5a907))
* include label for the rich text editor field ([73187d7](73187d7))
* refactored to allow copy and paste images from another website ([3330250](3330250)), closes [#5](#5)
* returned to making API route only be 'react-editorjs' ([ee9b747](ee9b747))
* solution for [#5](#5) axios ([1f2d9a7](1f2d9a7))

### Features

* add background to focused block & differentiate image tool caption ([a5d2b1b](a5d2b1b))
* add width, height, size, mime, responsive data to image tool ([e07548c](e07548c)), closes [#6](#6) [#16](#16)
* enabled inline links ([ad11533](ad11533))
github-actions bot pushed a commit that referenced this issue Mar 19, 2022
# [2.0.0](v1.5.1...v2.0.0) (2022-03-19)

### Bug Fixes

* added /api/ to byUrl and byFile ([211c1f3](211c1f3))
* fixed the image tool. Now able to add images from the media library, and automatically shuts the media library window after saving. ([fb5a907](fb5a907))
* include label for the rich text editor field ([73187d7](73187d7))
* refactored to allow copy and paste images from another website ([3330250](3330250)), closes [#5](#5)
* returned to making API route only be 'react-editorjs' ([ee9b747](ee9b747))
* solution for [#5](#5) axios ([1f2d9a7](1f2d9a7))

* feat!: updates to allow Strapi v4 functionality ([72b4913](72b4913))

### Features

* add background to focused block & differentiate image tool caption ([a5d2b1b](a5d2b1b))
* add width, height, size, mime, responsive data to image tool ([e07548c](e07548c)), closes [#6](#6) [#16](#16)
* enabled inline links ([ad11533](ad11533))

### BREAKING CHANGES

* This update refactors the plugin to work in Strapi v4. This code will not work in Strapi v3. At this time, the Image tool is not functioning. The link tool works, but thumbnails are being blocked by Strapi 4's contentSecurityPolicy. The current workaround for this is to replace the 'strapi::security' default export in ./config/middlewares.js to the following code (do this at your own risk):

"{
    name: 'strapi::security',
    config: {
      contentSecurityPolicy: false
    },
  },"

I've yet to find a solution that can be baked into the plugin itself. I have also added "auth: false" to the routes config so that it is not necessary to give authenticated and public permissions to the plugin. This may need to be removed if it is seen as a security risk.

Custom styles have been added to Wysiwyg/wrapper.js for headers (H1-H6) because Strapi resets styles and there is no styling for the plugin without them.

I have updated editorjs to 2.23.2 and several other of the plugins (see package.json). I've also added @buffetjs/core and @buffetjs/styles to package.json because the library is not in Strapi now. I also removed "axios" because that library is in Strapi. I updated node to the following: "node": ">=10.16.0 <=16.x.x"
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants