Node.JS Python Selenium Script to Take Screenshot of Website & Download It as PNG Image in Express

You are currently viewing Node.JS Python Selenium Script to Take Screenshot of Website & Download It as PNG Image in Express

Node.js Python Selenium Script to Take Screenshot of Website & Download it as PNG Image in Express

from selenium import webdriver
import sys
import time
 
def takescreenshot(url):
    
    driver = webdriver.Chrome("chromedriver.exe")
    
    driver.get(url)
    
    time.sleep(5)
    
    driver.save_screenshot('website.png')
    
 
if __name__ == "__main__":
    takescreenshot(sys.argv[1])

const express = require('express')
const bodyparser = require('body-parser')
const {exec} = require('child_process')
const app = express()
 
app.use(bodyparser.urlencoded({ extended: false }))
 
app.use(bodyparser.json())
 
app.set('view engine','ejs')
 
app.get('/', (req, res) => {
    res.render('index')
})
 
app.post('/takescreenshot', (req, res) => {
    exec(`python takescreenshot.py ${req.body.url}`, (err, stdout, stderr) => {
        if (err) {
            console.log(err)
        }
        else {
            console.log("screenshot saved")
 
            res.download("website.png", () => {
                console.log("Screenshot Downloaded")
            })
        }
    })
})
 
app.listen(5000)

<!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>Take Screenshot of Website in Node.js</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">
            Take Screenshot of Website as PNG Image
        </h1>
        <form action="/takescreenshot" method="post">
            <div class="form-group">
                <label for="url">Enter Website Name:</label>
                <input type="text" name="url" required placeholder="Enter Website Name" class="form-control">
            </div>
            <div class="form-group">
                <button class="btn btn-danger btn-block">
                    Download Image
                </button>
            </div>
        </form>
</body>
</html>

Ranjith

Hi, I'm Manoj a full-time Blogger, YouTuber, Affiliate Marketer, & founder of Coding Diksha. Here, I post about programming to help developers.

Leave a Reply