API et Intégration
Installation de rembg.js
npm i @remove-background-ai/rembg.js
Utilisation de l'API dans Node en utilisant rembg.js
En exploitant la bibliothèque rembg.js dans un environnement Node, vous pouvez facilement intégrer des capacités de suppression d'arrière-plan dans votre application. Voici un guide étape par étape sur la configuration et l'utilisation de l'API :
Configuration de votre environnement : Assurez-vous d'avoir un fichier .env dans la racine de votre projet contenant votre clé API.
Importation des modules nécessaires : Commencez par importer la fonction rembg de @remove-background-ai/rembg.js et le module dotenv pour gérer les variables d'environnement.
Configuration des callbacks de progression : La bibliothèque offre des callbacks onDownloadProgress et onUploadProgress pour suivre la progression des opérations de fichier. Dans l'exemple fourni, nous enregistrons ces événements directement dans la console.
Maintenant, regardons de plus près un exemple d'utilisation :
// script.mjs file
import { rembg } from '@remove-background-ai/rembg.js';
import dotenv from 'dotenv';
// Load environment variables from .env file
dotenv.config();
// API_KEY will be loaded from the .env file
const API_KEY = process.env.API_KEY;
// log upload and download progress
const onDownloadProgress = console.log;
const onUploadProgress = console.log;
rembg({
apiKey: API_KEY,
inputImage: './input.png', //inputImage can be one of these: string | Buffer | { base64: string };
onDownloadProgress,
onUploadProgress
}).then(({ outputImagePath, cleanup }) => {
console.log('✅🎉 background removed and saved under path=', outputImagePath);
// if called, it will cleanup (remove from disk) your removed background image
// cleanup();
});
N'oubliez pas, la fonction de nettoyage peut être appelée si vous souhaitez supprimer l'image traitée de votre disque après la suppression de l'arrière-plan.
Affichage de la barre de progression
Lors de l'intégration d'un service de suppression d'arrière-plan, il est souvent bénéfique de fournir aux utilisateurs un retour sur la progression de leur demande de téléchargement ou de téléversement. Pour faciliter cela, vous pouvez définir vos propres callbacks onDownloadProgress et onUploadProgress. Ces deux callbacks acceptent AxiosProgressEvent comme paramètre d'événement. Au fur et à mesure de la progression de la demande, ces callbacks sont invoqués plusieurs fois, vous permettant, par exemple, d'afficher une barre de progression et d'ajuster sa longueur en fonction de la progression.
(base) root@DESKTOP-C0Q8KK7:~/rembg.js-test# node index.mjs
{
loaded: 65687,
total: 68474,
progress: 0.9592984198381868, <---- @95% progress
bytes: 65687,
rate: undefined,
estimated: undefined,
upload: true <---- upload progress
}
{
loaded: 68474,
total: 68474,
progress: 1, <---- @100% progress
bytes: 2787,
rate: undefined,
estimated: undefined,
upload: true <---- upload progress
}
{
loaded: 1002,
total: 68824,
progress: 0.014558874811112402, <---- @1% progress
bytes: 1002,
rate: undefined,
estimated: undefined,
download: true <---- download progress
}
{
loaded: 68824,
total: 68824,
progress: 1, <---- @100% progress
bytes: 67822,
rate: undefined,
estimated: undefined,
download: true <---- download progress
}
✅🎉 background removed and saved under path=/tmp/rembg--3339-DBqqeJ2eOs4D-.png