Can we remove media formats stream from core API Responses?

Questions and Answers Strapi Backend
3

Strapi version : 4.1.1

TLTR:

The following steps will help you to remove the stream property that was present on each media object.

  1. Go to your src/index.js file :
const FileUploadOverride = require('./extensions/file-upload-override');

module.exports = {
  // ...
  register({ strapi }) {
    // Load our override module
    FileUploadOverride.register(strapi);
  },
  // ...
  1. Next create the file src/extensions/file-upload-override.js :

const _ = require('lodash')

module.exports = {
  /**
   * Register the module
   * @param strapi
   */
  register (strapi) {
    // Register custom methods on the service under override property to clearly identify them
    strapi.plugin('upload').services.upload.override = {
      generateBlurredFilePlaceholder: this.generateBlurredFilePlaceholder,
      transformMediaObject: this.transformMediaObject
    }

    // Override the uploadFileAndPersist method to hook or custom functions
    strapi.plugin('upload').services.upload.uploadFileAndPersist = this.uploadFileAndPersist;
  },

  /**
   * Override the upload service method to add our function
   *
   * @see {import('@strapi/plugin-upload/server/services/upload')}
   *
   * {@link https://forum.strapi.io/t/adding-blurhash-to-image-uploads/1802/13}
   * {@link
    * https://github.com/strapi/strapi/blob/637f51270fd95bc1d59bf5dfe7d837e0b8b1cada/packages/core/upload/server/services/upload.js#L158
  *   The method source code}
   *
   * @param fileData
   * @param user
   * @return {Promise<*>}
   */
  uploadFileAndPersist: async function (fileData, { user } = {}) {
    const config = strapi.config.get('plugin.upload')

    const {
      getDimensions,
      generateThumbnail,
      generateResponsiveFormats,
      isSupportedImage
    } = strapi.plugin('upload').service('image-manipulation')

    await strapi.plugin('upload').service('provider').upload(fileData)

    if (await isSupportedImage(fileData)) {
      const thumbnailFile = await generateThumbnail(fileData)

      if (thumbnailFile) {
        await strapi.plugin('upload').service('provider').upload(thumbnailFile)


        delete thumbnailFile.buffer
        _.set(fileData, 'formats.thumbnail', thumbnailFile)
      }

      const formats = await generateResponsiveFormats(fileData)

      if (Array.isArray(formats) && formats.length > 0) {
        for (const format of formats) {
          if (!format) { continue }

          const { key, file } = format

          strapi.plugin('upload').service('provider').upload(file)

          // Remove any stream property from the file data
          this.override.transformMediaObject(fileData);

          _.set(fileData, ['formats', key], file)
        }
      }

      const { width, height } = await getDimensions(fileData)

      _.assign(fileData, {
        provider: config.provider,
        width,
        height
      })
    }

    return this.add(fileData, { user })
  },


  /**
   * Transform a fileData object before persist it into the DB
   * @param fileData
   */
  transformMediaObject: (fileData) => {
    if (!_.isNil(fileData.stream))
      delete (fileData.stream);
  },
}
  1. Restart your server and you are good to go !

Detailled

I was searching a way to remove the stream property that was on each media format and which was containing the entire buffer of each format file. It was stored in the DB (even if files was stored on the server) and returned into the API. To avoid getting +1MB request size for getting my post, I removed them.

The code above is highly inspired of the solution found on this thread Adding Blurhash to image uploads - #13 by SoftCreatR

1 Like