imgbb-uploader
Lightweight Nodejs module to upload local pictures files to imgbb API and get display URLs in response.
Primary use is letting imgBB handle the hosting & serving of images.
Compatibility:
Node >= 8 ( this module uses async/await )
Care: this module uses fs
under the hood. It means it WON'T work outside the node environment !
You really SHOULDN'T use API keys from your frontend. But, if you're the yolo type, you could use window.File & window.fetch. PLEASE DON'T DO THAT !!!
Blah blah blah, my soul is lost already, bring it on
Install
npm install imgbb-uploader
Use with two string params (legacy, LTS)
const imgbbUploader = require("imgbb-uploader");
imgbbUploader(
"your-imgbb-api-key-string",
"absolute/path/to/your/image/image.png",
)
.then((response) => console.log(response))
.catch((error) => console.error(error));
.then((response) => console.log(response))
output example :
{
id: '26Sy9tM',
title: '5e7599f65f27',
url_viewer: 'https://ibb.co/26Sy9tM',
url: 'https://i.ibb.co/z5FrMR2/5e7599f65f27.png',
display_url: 'https://i.ibb.co/z5FrMR2/5e7599f65f27.png',
size: 260258,
time: '1609336605',
expiration: '0',
image: {
filename: '5e7599f65f27.png',
name: '5e7599f65f27',
mime: 'image/png',
extension: 'png',
url: 'https://i.ibb.co/z5FrMR2/5e7599f65f27.png'
},
thumb: {
filename: '5e7599f65f27.png',
name: '5e7599f65f27',
mime: 'image/png',
extension: 'png',
url: 'https://i.ibb.co/26Sy9tM/5e7599f65f27.png'
},
delete_url: 'https://ibb.co/26Sy9tM/087a7edaaac26e1c940283df07d0b1d7'
}
This async function returns a promise, so this is normal :
console.log(imgbbUploader(myKey, myPath)) // output : Promise { <pending> }
Your data is available in .then((response) => response)
as shown above.
Use with options object (more features, yay! )
From version 1.2.0 onward, you can also pass an options object as param.
Use it to customize filename and/or a set duration after which the image will be deleted, cf their docs.
const imgbbUploader = require("imgbb-uploader");
const options = {
apiKey: process.env.IMGBB_API_KEY,
imagePath: "./your/image/path",
name: "yourCustomFilename",
expiration: 3600 ,
base64string:
"data:image/jpeg;base64,blahblahblah" ,
};
imgbbUploader(options)
.then((response) => console.log(response))
.catch((error) => console.error(error));
This module is tiny & totally unlicensed: to better fit your need, please fork away !
Basic instructions for tweaking
More examples using option object
Using options.base64string:
const imgbbUploader = require("imgbb-uploader");
const base64str = () =>
new Promise((resolve) => {
return setTimeout(() => {
resolve(
"iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAEklEQVR42mNcLVNbzwAEjDAGACcSA4kB6ARiAAAAAElFTkSuQmCC",
);
}, 1000);
});
const myFunc = async (name) => {
try {
return await imgbbUploader({
apiKey: "definitely-not-a-valid-key",
base64string: await base64str(),
name: name,
});
} catch (e) {
throw e;
}
};
myFunc("Dolunay_Obruk-Sama_<3")
.then((res) => console.log(res))
.catch((e) => console.error(e));
Learn more
This module doesn't support array uploads. For heavy duty, you'll probably have to work with fs.readdir and async forEach (you may also be interested in path ).
For example, you can create a baseDir.js
file wherever it suits you:
// baseDir.js
const path = require('path');
const dirPath = path.join(__dirname);
module.exports = dirPath;
Then you can require this file elsewhere and use something like path.join(myDirpath, "subfolder")
to dig into directories programmatically. Once there, you can f.e. fs.readdir
and iterate forEach
file of that directory.
See fs
documentation and Stack Overflow for more inspiration on the matter.
CHANGELOG
1.3.0
Issue #6 brought an interesting feature idea. Took a bit of time because I first had to adapt the module used by the tests (waifu-generator owo).
Everything seem to work as intended.
Took the opportunity to reduce insanity within test code. Not perfect, but still less horrible than before.
Finally, I'm abandoning the idea of making this frontend-compatible some day. I don't want to endorse terrorism, and it's definitely not reasonable to encourage people to throw API keys into their frontends (even free API key - remember this module will stop working the day imgBB stop providing their service).
What I could do, aside writing this in the README, is perhaps redirecting to a working HTML/JS or React snippet, so people looking for a quick solution without any regard for security (for POC/hackathon/pet project) could gain some time.