search

imgly / background-removal-js

Remove backgrounds from images directly in the browser environment with ease and no additional costs or privacy concerns. Explore an interactive demo.
https://img.ly/showcases/cesdk/web/background-removal/web
GNU Affero General Public License v3.0
5.89k stars 362 forks source link

API request keeps failing #121

Open almirchowdhury opened 6 months ago

almirchowdhury commented 6 months ago

here is my backend: import express from 'express'; import multer from 'multer'; import { removeBackground } from '@imgly/background-removal-node';

const router = express.Router(); const upload = multer({ storage: multer.memoryStorage() });

router.post('/remove-background', upload.single('image'), async (req, res) => { try { const imageBuffer = req.file.buffer; const blob = await removeBackground(imageBuffer);

    const buffer = Buffer.from(await blob.arrayBuffer());
    const dataURL = `data:image/png;base64,${buffer.toString("base64")}`;

    res.json({ imageUrl: dataURL });
} catch (error) {
    res.status(500).json({ error: 'Failed to remove background', message: error.message });
}

});

export default router;

FE Implentation: const handleRemoveBackground = async () => { if (!imageFile) { console.error('No image file available for background removal.'); return; }

setLoading(true);
const formData = new FormData();
formData.append('image', imageFile);

try {
  const response = await fetch('http://localhost:8080/api/v1/background/remove-background', {
    method: 'POST',
    body: formData
  });
  if (!response.ok) {
    throw new Error('Network response was not ok');
  }
  const data = await response.json();
  setImageSrc(data.imageUrl);
} catch (error) {
  console.error('Error removing background:', error);
} finally {
  setLoading(false);
}

}; keep getting internal server error plz help