Combine 2 image and upload

NPM

npm install jimp
npm install @google-cloud/storage
const express = require("express");
const app = express();

const {Storage} = require('@google-cloud/storage');
var Jimp = require("jimp");
const fs = require("fs");
const os = require("os")
const path = require("path");


app.get("/", (req, res) => {
  res.send("Hello from Docial Engine!");
});

app.get("/image/:id", async (req,res)=>{

	const tokenId = req.params.id;

	const bucketName="MYBUCKETNAME";
	const baseImage=`baseImageLink.com/${tokenId}.png`;
	
	const storage = new Storage({ keyFilename: "./googleKey.json" });
	const randomNumber = Math.floor(Math.random() * 2) + 1;

	let textBase;
	if (randomNumber === 1)
	 	textBase = "https://storage.googleapis.com/ethskeptics.appspot.com/bubbles/text1.png";
	else
		textBase= "https://storage.googleapis.com/ethskeptics.appspot.com/bubbles/text2.png";


	try {
		const image =  await Jimp.read(baseImage);
		const texts =  await Jimp.read(textBase);
		const bgChar = image.blit(texts, 0, 0);

		const tempName = `${tokenId}.png`;
		const tempFilePath = path.join(os.tmpdir(), tempName);
		await bgChar.writeAsync(tempFilePath);
		console.log(`Temp created ${tempName}`)


		//upload new file
		const bucket = storage.bucket(bucketName);
		const result = await  bucket.upload(tempFilePath, {
			destination: `meta/${tokenId}.png`,
		});

		if(result) {
			console.log(`meta/${tokenId}.png uploaded`);
			fs.unlinkSync(tempFilePath)};

		const myJson = {
			url: `https://storage.googleapis.com/YOUR_BUCKET_NAME/meta/${tokenId}.png`,
			bucket: bucketName,
			file: baseImage,
			tokenId: tokenId,
			textBase:textBase,
			randomNumber:randomNumber
		};
		
		return res.status(200).send(myJson); 
		} catch (error) {
			return res.status(400).send(error.message); 
		}


})

const PORT = process.env.PORT || 8080;
app.listen(PORT, () => {
  console.log(`Server listening on port ${PORT}...`);
});

Last updated

Was this helpful?