npm init -y
npm i node-base64-image
npm i express multer ejs
npm i image-to-base64
USAGE
index.js
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
const encode = require("node-base64-image").encode; const decode = require("node-base64-image").decode; const url = "https://freemediatools.com/img/profile.jpg"; const options = { string: true, headers: { "User-Agent": "my-app", }, }; let image; async function encodeImage(url) { image = await encode(url, options); console.log(image); await decode(image, { fname: "example", ext: "jpg" }); } encodeImage(url); |
FULL EXAMPLE
views/index.ejs
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>base64 decode and encode in Javascript</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> </head> <body> <div class="container"> <h1 class="text-center"> Base64 Decode & Encode </h1> <form action="/encode" method="post" enctype="multipart/form-data"> <div class="form-group container"> <label for="file">Upload File:</label> <input class="form-control" type="file" name="file" id="" required> </div> <div class="form-group container"> <button class="btn btn-danger btn-block"> Encode Image </button> </div> </form> <form action="/decode" method="post" enctype="multipart/form-data"> <div class="form-group container"> <label for="file">Upload Base64 Code File:</label> <input class="form-control" type="file" name="file" id="" required> </div> <div class="form-group container"> <button class="btn btn-danger btn-block"> Decode Image </button> </div> </form> </div> </body> </html> |
index.js
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 |
const express = require('express') const multer = require('multer') const imageToBase64 = require("image-to-base64"); const decode = require('node-base64-image').decode const fs = require('fs') const path = require('path') const bodyparser = require('body-parser'); const { fstat } = require('fs'); const app = express() var storage = multer.diskStorage({ destination: function (req, file, cb) { cb(null, "public/uploads"); }, filename: function (req, file, cb) { cb(null, file.fieldname + "-" + Date.now() + path.extname(file.originalname)); }, }); var upload = multer({ storage: storage }).single('file'); app.use(bodyparser.urlencoded({ extended: false })) app.use(bodyparser.json()) app.use(express.static('public/uploads')) app.set('view engine','ejs') const PORT = process.env.PORT || 5000 app.get('/', (req, res) => { res.render('index') }) app.post('/encode', (req, res) => { // upload the file output = Date.now() + "output.txt" upload(req, res, (err) => { if (err) { console.log("some error occured in uploading the file") return } else { console.log(req.file.path) // encode to base64 imageToBase64(req.file.path) // Path to the image .then((response) => { console.log(response); // "cGF0aC90by9maWxlLmpwZw==" fs.writeFileSync(output, response) res.download(output, () => { console.log("file is downloaded") }) }) .catch((error) => { console.log(error); // Logs an error if there was one }); } }) }) app.post('/decode', async (req, res) => { output = Date.now() + "output" upload(req, res,async (err) => { if (err) { console.log("error takes place") return } else { console.log(req.file.path) const base64code = fs.readFileSync(req.file.path, "utf8"); console.log(base64code) await decode(base64code, { fname: output, ext: "jpg" }); res.download(output + ".jpg", () => { console.log("file is downloaded") }) } }) }) app.listen(PORT, () => { console.log("App is listening on port 5000") }) |
