When I upload image in editor, I am able to find it's size. But I want it's height and width to restrict for height and width above particular limit. Below is result which I'm getting when I upload image.

See image to image upload result

For size restriction it's working as below-

onImageUpload(images, insertImage) {
    if (images[0].size <= 100000) {
        for (let i = 0; i < images.length; i  ) {
            const reader = new FileReader();
            reader.onloadend = () => {
                insertImage(reader.result);
            };
            reader.readAsDataURL(images[i]);
        }
    } else {
        alert('Image not saved, max allowed image size is 100kb');
    }

};

CodePudding user response：

What editor are you using? UEditor is a very good rich-text editor.

CodePudding user response：

onImageUpload(images, insertImage) {
    console.log('onImageUpload', images);
    if (images[0].size <= 100000) {
        for (let i = 0; i < images.length; i  ) {
            const reader = new FileReader();
            reader.onloadend = () => {
                var i = new Image();
                i.src = reader.result;
                i.onload = function () {
                    if (i.width <= 200 && i.height <= 200) {
                        insertImage(reader.result);
                    } else {
                        cogoToast.warn('Image not saved, image width and height should be less than 200*200');
                    }
                };
            };
            reader.readAsDataURL(images[i]);
        }
    } else {
        cogoToast.warn('Image not saved, max allowed image size is 100kb');
    }
};

It will work in this way.Thanks!