fengyuanchen / compressorjs

JavaScript image compressor.
https://fengyuanchen.github.io/compressorjs/
MIT License
5.23k stars 439 forks source link

Why does my compressed size remain the same? #187

Closed bbhxwl closed 4 months ago

bbhxwl commented 4 months ago

Why does my compressed size remain the same?

vue

<script setup lang="ts">
import Compressor from 'compressorjs';
onMounted(()=>{
    document.getElementById('upload').addEventListener('change', function(event) {
        const file = event.target.files[0];
        if (!file) return;

        new Compressor(file, {
            quality: 0.8,
            success(result) {
                const url = URL.createObjectURL(result);
                const downloadBtn = document.getElementById('downloadBtn');
                downloadBtn.style.display = 'block';
                downloadBtn.href = url;
                downloadBtn.download = 'compressed_image.jpg';
            },
            error(err) {
                console.error('Error:', err);
            },
        });
    });

    document.getElementById('downloadBtn').addEventListener('click', function() {
        const link = document.createElement('a');
        link.href = this.href;
        link.download = this.download;
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
    });
})
</script>

<template>
    <input type="file" id="upload" accept="image/*">

    <button id="downloadBtn" style="display:none;">Download Compressed Image</button>

</template>

<style scoped>

</style>
fengyuanchen commented 4 months ago

You can set the strict option to false, but the output result size may be larger than your original image file.