পেজের বিভিন্ন ফরম্যাটে (PNG, JPEG, PDF) স্ক্রিনশট নেওয়া

পেজ রেন্ডারিং এবং স্ক্রিনশট তোলা - ফ্যান্টমজেএস (PhantomJS) - Web Development

273

PhantomJS একটি headless WebKit ভিত্তিক ব্রাউজার যা JavaScript এর মাধ্যমে ওয়েব পেজকে প্রোগ্রামেটিক্যালি পরিচালনা করতে সক্ষম। এটি কোনো UI ছাড়াই ওয়েব পেজের স্ক্রিনশট, রেন্ডারিং, DOM ম্যানিপুলেশন এবং আরও অনেক কাজ করতে ব্যবহৃত হয়। বিশেষ করে ওয়েব পেজের স্ক্রিনশট নেওয়ার জন্য এটি অনেক কার্যকরী। PhantomJS এর সাহায্যে আপনি ওয়েব পেজের ছবি, পিডিএফ এবং অন্যান্য ফরম্যাটে স্ক্রিনশট নিতে পারেন।

PhantomJS দিয়ে স্ক্রিনশট নেওয়া (PNG, JPEG, PDF)

PhantomJS এর মাধ্যমে স্ক্রিনশট নেওয়া অনেক সহজ। আপনি JavaScript কোড ব্যবহার করে পেজ রেন্ডার করতে পারেন এবং এরপর তা বিভিন্ন ফরম্যাটে (PNG, JPEG, PDF) আউটপুট হিসেবে গ্রহণ করতে পারেন।

PhantomJS দিয়ে স্ক্রিনশট নেওয়ার জন্য পদক্ষেপ:

  1. PhantomJS ইনস্টলেশন:

    • প্রথমে আপনাকে PhantomJS ইনস্টল করতে হবে। এটি npm বা সরাসরি PhantomJS এর ওয়েবসাইট থেকে ডাউনলোড করা যেতে পারে।

    npm মাধ্যমে ইনস্টল:

    npm install -g phantomjs
    
  2. PhantomJS স্ক্রিপ্ট তৈরি:

    PhantomJS স্ক্রিপ্ট তৈরি করতে JavaScript কোড লিখে আপনি ওয়েব পেজ থেকে স্ক্রিনশট নিতে পারেন।

PhantomJS স্ক্রিপ্ট উদাহরণ:

var page = require('webpage').create();  // Create a new page object

// Set the URL to capture
page.open('https://www.example.com', function(status) {
    if (status === "success") {
        // Capture screenshot in PNG format
        page.render('screenshot.png');  // For PNG format

        // Capture screenshot in JPEG format
        page.render('screenshot.jpg', { format: 'jpeg', quality: 100 });  // For JPEG format

        // Capture screenshot as PDF
        page.render('screenshot.pdf', { format: 'pdf' });  // For PDF format
    }
    phantom.exit();  // Close PhantomJS instance
});

Explanation:

  • webpage.create(): একটি নতুন ওয়েবপেজ তৈরি করে, যা PhantomJS দ্বারা রেন্ডার করা হবে।
  • page.open(): এটি ওয়েবপেজটি খোলার জন্য ব্যবহৃত হয় এবং পেজের লোড হওয়া অবস্থার উপর ভিত্তি করে স্ক্রিনশট নেওয়ার কাজ সম্পাদিত হয়।
  • page.render(): এটি স্ক্রিনশট গ্রহণ করতে ব্যবহৃত হয় এবং আপনি আউটপুট ফাইল ফরম্যাট নির্বাচন করতে পারেন। এখানে PNG, JPEG, এবং PDF ফরম্যাটে স্ক্রিনশট নেওয়া হচ্ছে।

PhantomJS স্ক্রিপ্ট রান করা:

একটি ফাইল তৈরি করুন, যেমন captureScreenshot.js এবং তারপর PhantomJS দিয়ে স্ক্রিপ্টটি রান করুন:

phantomjs captureScreenshot.js

এর মাধ্যমে, আপনার ওয়েব পেজের স্ক্রিনশটটি screenshot.png, screenshot.jpg, এবং screenshot.pdf ফরম্যাটে তৈরি হয়ে যাবে।


PhantomJS এর অন্যান্য স্ক্রিনশট বিকল্প:

  1. স্ক্রিনশটের সাইজ কাস্টমাইজ করা:

    আপনি স্ক্রিনশটের সাইজ কাস্টমাইজ করতে পারেন যাতে এটি পেজের নির্দিষ্ট অংশ বা পুরো পেজের স্ক্রিনশট নেয়।

    page.viewportSize = { width: 1280, height: 1024 };  // Set custom viewport size
    page.render('screenshot.png');
    
  2. ডেলেটেড এলিমেন্টের স্ক্রিনশট নেওয়া:

    আপনি নির্দিষ্ট একটি এলিমেন্টের স্ক্রিনশটও নিতে পারেন:

    var clipRect = { top: 0, left: 0, width: 500, height: 500 };  // Define a clip area
    page.clipRect = clipRect;  // Set clipping area
    page.render('elementScreenshot.png');
    
  3. অটোমেটেড স্ক্রিনশটিং এবং ব্রেকপয়েন্টস:

    PhantomJS স্বয়ংক্রিয়ভাবে বিভিন্ন ব্রেকপয়েন্টে স্ক্রিনশট নিতে সক্ষম। আপনি বিভিন্ন স্ক্রিন রেজুলেশন অনুযায়ী স্ক্রিনশট নিতে পারেন।

    page.viewportSize = { width: 1024, height: 768 };
    page.render('tabletScreenshot.png');
    
    page.viewportSize = { width: 1920, height: 1080 };
    page.render('desktopScreenshot.png');
    

PhantomJS দিয়ে স্ক্রিনশট নেওয়ার উপকারিতা:

  1. Automated Screenshot Capture:
    • PhantomJS দিয়ে আপনি ওয়েবসাইটের স্বয়ংক্রিয় স্ক্রিনশট গ্রহণ করতে পারেন, যা ওয়েব ডেভেলপমেন্ট এবং টেস্টিং এর জন্য উপকারী।
  2. No UI Required (Headless Browser):
    • PhantomJS একটি headless browser, তাই এটি কোনও গ্রাফিকাল ইউজার ইন্টারফেস ছাড়াই কাজ করে। এর মানে হল যে, এটি কম্পিউটারের গ্রাফিক্স রিসোর্সকে ব্যবহার না করে ওয়েবপেজ রেন্ডার করতে সক্ষম।
  3. Performance Monitoring:
    • আপনি ওয়েবসাইটের লোড টাইম এবং রেন্ডারিং পারফরম্যান্স মনিটর করতে PhantomJS ব্যবহার করতে পারেন এবং স্ক্রিনশটের মাধ্যমে বিভিন্ন ব্রাউজার বা ডিভাইসে ওয়েবসাইট কেমন দেখায় তা দেখতে পারেন।
  4. Automated Testing and Documentation:
    • PhantomJS ব্যবহার করে আপনি ওয়েবসাইটের স্ক্রিনশটের মাধ্যমে UI testing এবং documentation তৈরি করতে পারেন, বিশেষ করে যখন ডিজাইন চেক করা দরকার।

PhantomJS একটি শক্তিশালী টুল যা স্ক্রিনশট এবং ওয়েব পেজ রেন্ডারিং জন্য ব্যবহৃত হয়। আপনি এটি দিয়ে স্ক্রিনশট নিতে পারেন এবং ওয়েব পেজের বিভিন্ন ফরম্যাটে (PNG, JPEG, PDF) রেন্ডার করতে পারেন। এর মাধ্যমে ওয়েব ডেভেলপাররা স্ক্রিনশট ক্যাপচার, ওয়েব পেজের পারফরম্যান্স ম্যানেজমেন্ট, এবং UI টেস্টিং কার্যক্রম অনেক সহজভাবে করতে পারেন।

Content added By
Promotion

Are you sure to start over?

Loading...