Я новичок в strapi, и я пытаюсь найти способ сжать изображение, которое загружается на strapi, которое затем будет отправлено на статический сайт gatsby. Как я могу это сделать? Я нашел библиотеку npm image-compress.js, но я не знаю, как интегрировать ее в strapi как для поля в каждом типе контента, так и для редактора WYSWYG. Кто-нибудь может мне помочь? Если возможно, можем ли мы настроить его при загрузке в Strapi в зависимости от размера дисплея в gatsby?
1-я попытка интеграции компрессора изображений:
Вот мой upload.js:
const Compressor = require('image-compressor')
module.exports = {
upload: async (ctx) => {
// Retrieve provider configuration.
const config = await strapi.store({
environment: strapi.config.environment,
type: 'plugin',
name: 'upload'
}).get({ key: 'provider' });
// Verify if the file upload is enable.
if (config.enabled === false) {
strapi.log.error('File upload is disabled');
return ctx.badRequest(null, ctx.request.admin ? [{ messages: [{ id: 'Upload.status.disabled' }] }] : 'File upload is disabled');
}
// Extract optional relational data.
const { refId, ref, source, field } = ctx.request.body.fields;
let { files = {} } = ctx.request.body.files;
if (_.isEmpty(files)) {
return ctx.send(true);
}
//integrate image-compressor library to enhance uploaded image
var imageCompressor = new Compressor.ImageCompressor;
var compressorSettings = {
toWidth : 100,
toHeight : 100,
mimeType : 'image/png',
mode : 'strict',
quality : 0.6,
grayScale : true,
sepia : true,
threshold : 127,
vReverse : true,
hReverse : true,
speed : 'low'
};
files.map(file => imageCompressor.run(file, compressorSettings), () => {})
// Transform stream files to buffer
// const buffers = await strapi.plugins.upload.services.upload.bufferize(ctx.request.body.files.files);
const buffers = await strapi.plugins.upload.services.upload.bufferize(files.files);
const enhancedFiles = buffers.map(file => {
if (file.size > config.sizeLimit) {
return ctx.badRequest(null, ctx.request.admin ? [{ messages: [{ id: 'Upload.status.sizeLimit', values: {file: file.name} }] }] : `${file.name} file is bigger than limit size!`);
}
// Add details to the file to be able to create the relationships.
if (refId && ref && field) {
Object.assign(file, {
related: [{
refId,
ref,
source,
field
}]
});
}
return file;
});
// Something is wrong (size limit)...
if (ctx.status === 400) {
return;
}
const uploadedFiles = await strapi.plugins.upload.services.upload.upload(enhancedFiles, config);
// Send 200 `ok`
ctx.send(uploadedFiles.map((file) => {
// If is local server upload, add backend host as prefix
if (file.url && file.url[0] === '/') {
file.url = strapi.config.url + file.url;
}
if (_.isArray(file.related)) {
file.related = file.related.map(obj => obj.ref || obj);
}
return file;
}));
},
и я получил эту ошибку, запустив strapi start:
/home/mike/Desktop/clik.asia.admin/node_modules/image-compressor/image-compressor.js:295
})(window, document);
^
ReferenceError: window is not defined
at Object.<anonymous> (/home/mike/Desktop/clik.asia.admin/node_modules/image-compressor/image-compressor.js:295:4)
at Module._compile (module.js:652:30)
at Object.Module._extensions..js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
at Object.<anonymous> (/home/mike/Desktop/clik.asia.admin/plugins/upload/controllers/Upload.js:10:20)
at Module._compile (module.js:652:30)