জাভাস্ক্রিপ্ট সহ কোনও ওয়েবপৃষ্ঠার স্ক্রিনশট নেবেন?

148

জাভাস্ক্রিপ্ট দিয়ে কোনও ওয়েবপৃষ্ঠার স্ক্রিনশট নেওয়া এবং এটি আবার সার্ভারে জমা দেওয়া কি সম্ভব?

আমি ব্রাউজার সুরক্ষা সমস্যার সাথে এতটা উদ্বিগ্ন নই। ইত্যাদি বাস্তবায়নের হবে যেমন HTA । তবে এটা কি সম্ভব?

javascript  hta 
— স্কট বেনেট-ম্যাকলিশ
সূত্র
আপনি কেন এটি করতে চান তা পরিষ্কার করতে পারেন? স্ক্রিনশট নেওয়ার বিকল্প সমাধান রয়েছে।
— andyuk
আমি ব্যবহারকারীদের তারা যা চান মোটামুটি ডিজাইন করে দেখছি, কিছুটা স্কেচ এবং কিছুটা টেনে আনতে হবে অবজেক্টের ড্রপ। আমি তখন চাই যে এই "নকশা" কোনও উত্পাদন প্রক্রিয়ার নির্দেশের কিছু অংশ হিসাবে ব্যবহার করা হোক। এটি অবশ্যই একটি ব্যবহারকারীর সাথে জড়িত পদক্ষেপ, এখানে গোপন কিছুই নয় :)
— স্কট বেনেট-ম্যাকলিশ
— ইলহান

উত্তর:

42

আমি এইচটিএর জন্য একটি অ্যাক্টিভএক্স নিয়ন্ত্রণ ব্যবহার করে এটি করেছি। স্ক্রিনশটটি নিতে VB6 এ নিয়ন্ত্রণটি তৈরি করা বেশ সহজ ছিল। আমাকে কীবিডি_ভেন্তিক এপিআই কলটি ব্যবহার করতে হয়েছিল কারণ সেন্ডকিগুলি প্রিন্টস্ক্রিন করতে পারে না। এর জন্য কোডটি এখানে:

Declare Sub keybd_event Lib "user32" _
(ByVal bVk As Byte, ByVal bScan As Byte, ByVal dwFlags As Long, ByVal dwExtraInfo As Long)

Public Const CaptWindow = 2

Public Sub ScreenGrab()
   keybd_event &H12, 0, 0, 0
   keybd_event &H2C, CaptWindow, 0, 0
   keybd_event &H2C, CaptWindow, &H2, 0
   keybd_event &H12, 0, &H2, 0
End Sub

এটি কেবল আপনাকে উইন্ডোটি ক্লিপবোর্ডে পৌঁছে দেওয়ার মতোই পায়।

অন্য একটি বিকল্প, যদি আপনি যে উইন্ডোটির একটি স্ক্রিনশট চান সেটি যদি এইচটিএর হয় কেবল সার্ভারে DOM নোডগুলি প্রেরণের জন্য একটি এক্সএমএলএইচটিপিআরকিউস্ট ব্যবহার করা, তবে স্ক্রিনশটগুলি সার্ভার-সাইড তৈরি করুন।

— জোয়েল আনায়ের
সূত্র
আমি অ্যালেনের সাথে একমত, এটি একটি পৃষ্ঠার সম্ভাব্য স্ক্রিনশটের এক বিদগ্ধ উপায়!
— রিকিট
কি "এইচটিএ" দয়া করে?
— পিট অ্যালভিন
2
@ পেটএলভিন একটি এইচটিএ একটি হাইপারটেক্সট অ্যাপ্লিকেশন, যা ইন্টারনেট এক্সপ্লোরারে বিশেষাধিকারপ্রাপ্ত জেএস অ্যাপ্লিকেশনগুলি চালানোর উপায় ছিল। সুপার আজ প্রাসঙ্গিক নয়।
— জোয়েল আনায়ের
141

গুগল এটি Google+ এ করছে এবং একজন প্রতিভাবান বিকাশকারী এটির বিপরীত হয়েছে এবং এটি তৈরি করেছে http://html2canvas.hertzen.com/ । আইই তে কাজ করার জন্য আপনার একটি ক্যানভাস সমর্থন লাইব্রেরি যেমন http://excanvas.sourceforge.net/ প্রয়োজন

— JAAulde
সূত্র
2
ধন্যবাদ, আপনার পোস্টের লিঙ্কগুলি ভালভাবে ব্যাখ্যা দেয়
— হেসেইন বাবল
2
আপনি যদি নিজের জন্য এটি না করতে চান তবে ইউজারনেপ চেষ্টা করার মতো হতে পারে। প্লাগইন ইনস্টল না করেই (এবং কোনও জাভা, অ্যাক্টিভএক্স বা ফ্ল্যাশ নেই) আপনার দর্শকদের কাছ থেকে সঠিক ব্রাউজারের স্ক্রিনশটগুলি পাওয়ার সমাধানে এটি এক ড্রপ।
— গ্রেগর
আপনি এই চেক করুন করতে পারেন stackoverflow.com/questions/44494447/...
— abilash Er
14

আরেকটি সম্ভাব্য সমাধান যা আমি আবিষ্কার করেছি তা হ'ল http://www.phantomjs.org/ যা কাউকে খুব সহজেই পৃষ্ঠাগুলির স্ক্রিনশট এবং আরও অনেক কিছু নিতে দেয়। যদিও এই প্রশ্নের জন্য আমার মূল প্রয়োজনীয়তাগুলি আর কোনও বৈধ নয় (বিভিন্ন কাজ), আমি সম্ভবত ভবিষ্যত প্রকল্পগুলিতে ফ্যান্টমজেএসকে সংহত করব will

— স্কট বেনেট-ম্যাকলিশ
সূত্র
আপনি কি জানেন যে ফ্যান্টমজগুলি কোনও পৃষ্ঠায় কোনও উপাদানটির চিত্র তৈরি করতে পারে (পুরো পৃষ্ঠাটি নয়)?
— trusktr
হ্যা, তুমি পারো. হয় এই স্নিপেটটি ফ্যান্টমজেএস ব্যবহার করুন বা ক্যাস্পারজেএস ব্যবহার করুন ।
— zopieux
12

পাউন্ডারের যদি ক্যানভাসে পুরো শরীরের উপাদানগুলি সেট করে ক্যানভাস 2 আইমেজ ব্যবহার করে এটি করা সম্ভব হয়?

http://www.nihilogic.dk/labs/canvas2image/

— RobertPitt
সূত্র
যদি এসভিজি সাহায্য করে তবে আশ্চর্য হ'ল গুগলের উত্স
— লুক স্ট্যানলি
1
আপনি ক্যানভাসে এইচটিএমএল রেন্ডারিংয়ের জন্য নিক্লাসের এইচটিএমএল 2 ক্যানভাস কোড ব্যবহার করতে পারেন, তারপরে কোনও চিত্র সংরক্ষণ করতে এটি ব্যবহার করুন।
— trusktr
9

এটি করার একটি সম্ভাব্য উপায়, যদি উইন্ডোতে চলতে থাকে এবং নেট ইনস্টল থাকে তবে আপনি এটি করতে পারেন:

public Bitmap GenerateScreenshot(string url)
{
    // This method gets a screenshot of the webpage
    // rendered at its full size (height and width)
    return GenerateScreenshot(url, -1, -1);
}

public Bitmap GenerateScreenshot(string url, int width, int height)
{
    // Load the webpage into a WebBrowser control
    WebBrowser wb = new WebBrowser();
    wb.ScrollBarsEnabled = false;
    wb.ScriptErrorsSuppressed = true;
    wb.Navigate(url);
    while (wb.ReadyState != WebBrowserReadyState.Complete) { Application.DoEvents(); }


    // Set the size of the WebBrowser control
    wb.Width = width;
    wb.Height = height;

    if (width == -1)
    {
        // Take Screenshot of the web pages full width
        wb.Width = wb.Document.Body.ScrollRectangle.Width;
    }

    if (height == -1)
    {
        // Take Screenshot of the web pages full height
        wb.Height = wb.Document.Body.ScrollRectangle.Height;
    }

    // Get a Bitmap representation of the webpage as it's rendered in the WebBrowser control
    Bitmap bitmap = new Bitmap(wb.Width, wb.Height);
    wb.DrawToBitmap(bitmap, new Rectangle(0, 0, wb.Width, wb.Height));
    wb.Dispose();

    return bitmap;
}

এবং তারপরে পিএইচপি এর মাধ্যমে আপনি এটি করতে পারেন:

exec("CreateScreenShot.exe -url http://.... -save C:/shots domain_page.png");

তারপরে আপনার সার্ভারের পাশের স্ক্রিনশট রয়েছে।

— RobertPitt
সূত্র
1
যদিও প্রশ্নগুলির সাথে কিছুটা সম্পর্কিত নয়, এটি দুর্দান্ত একটি পরামর্শ! ধন্যবাদ!
— মিহাই
কেন এটি এমন কিছু স্টাইল লোড করে না যা আমি এমনকি তাদের আইই 9 এ লোড হওয়া দেখতে পাচ্ছি ?!
— ডাঃ টিজে
7

এটি আপনার জন্য আদর্শ সমাধান নাও হতে পারে তবে এটি এখনও উল্লেখ করার মতো হতে পারে।

স্ন্যাপসি একটি ওপেন সোর্স, অ্যাক্টিভএক্স অবজেক্ট যা ইন্টারনেট এক্সপ্লোরার স্ক্রিনশটগুলি ক্যাপচার এবং সেভ করতে সক্ষম করে। একবার ক্লায়েন্টে ডিএলএল ফাইলটি নিবন্ধিত হয়ে গেলে, আপনি স্ক্রিনশটটি ক্যাপচার করতে এবং জাভাস্ক্রিপ্ট সহ সার্ভারে ফাইলটি আপলোড করতে সক্ষম হবেন। ত্রুটিগুলি: এটির ক্লায়েন্টে ডিএলএল ফাইলটি নিবন্ধিত করতে হবে এবং এটি কেবলমাত্র ইন্টারনেট এক্সপ্লোরারের সাথে কাজ করে।

— নিখিল
সূত্র
6

বাগ রিপোর্ট করার জন্য আমাদের একইরকম প্রয়োজন ছিল। যেহেতু এটি কোনও ইন্ট্রানেট দৃশ্যের জন্য, তাই আমরা ব্রাউজার অ্যাডনগুলি ব্যবহার করতে সক্ষম হয়েছি (যেমন ফায়ারফক্সের ফায়ারশট এবং ইন্টারনেট এক্সপ্লোরারের জন্য আই স্ক্রিনশট )।

— গুলজার নাজিম
সূত্র
3

SnapEngage একটি ব্যবহার জাভা এপলেট একটি ব্রাউজার স্ক্রিনশট করতে (1.5+)। আফাইক, java.awt.Robotকাজটি করা উচিত - ব্যবহারকারীর কেবল অ্যাপলেটটিকে এটি (একবার) করার অনুমতি দিতে হবে।

এবং আমি এটি সম্পর্কে সবেমাত্র একটি পোস্ট পেয়েছি:

— xmedeko
সূত্র
1

আপনি এটি এইচটিএ এবং ভিবিএস স্ক্রিপ্ট ব্যবহার করে অর্জন করতে পারেন । স্ক্রিনশটিং করতে কেবল কোনও বাহ্যিক সরঞ্জামকে কল করুন। নামটি কী তা আমি ভুলে গিয়েছিলাম তবে উইন্ডোজ ভিস্টায় স্ক্রিনশট করার একটি সরঞ্জাম রয়েছে। এমনকি এটির জন্য আপনাকে অতিরিক্ত ইনস্টল করারও দরকার নেই।

স্বয়ংক্রিয় হিসাবে হিসাবে - এটি সম্পূর্ণরূপে আপনার ব্যবহৃত সরঞ্জামের উপর নির্ভর করে। যদি এটির একটি এপিআই থাকে তবে আমি নিশ্চিত যে আপনি কী করেছেন তা জেনেও ব্যবহারকারীরা বেশ কয়েকটি ভিজ্যুয়াল বেসিক কলগুলির মাধ্যমে স্ক্রিনশট এবং সংরক্ষণের প্রক্রিয়াটি ট্রিগার করতে পারবেন।

যেহেতু আপনি এইচটিএ উল্লেখ করেছেন, আমি ধরে নিচ্ছি যে আপনি উইন্ডোজে আছেন এবং (সম্ভবত) আপনার পরিবেশটি (যেমন ওএস এবং সংস্করণ) খুব ভাল জানেন know

— পর্যন্ত
সূত্র
তিনি ব্যক্তিগত ব্যবহারের জন্য নয় ক্লায়েন্টদের
— গণনাগুলিতে
1

আমি দেখতে পেয়েছি যে ডোম-টু-ইমেজ একটি ভাল কাজ করেছে (এইচটিএমএল 2 ক্যানভাসের চেয়ে অনেক ভাল)। নীচের প্রশ্ন ও উত্তর দেখুন: https://stackoverflow.com/a/32776834/207981

এই প্রশ্নটি এটি আবার সার্ভারে জমা দেওয়ার বিষয়ে জিজ্ঞাসা করে, যা সম্ভব হওয়া উচিত, তবে আপনি যদি চিত্রটি (গুলি) ডাউনলোড করতে চাইছেন তবে আপনি এটি ফাইলএসভার.জেএস এর সাথে সংযুক্ত করতে চাইবেন এবং যদি আপনি একটি জিপ ডাউনলোড করতে চান তবে সমস্ত উত্পন্ন ক্লায়েন্ট-সাইড একাধিক চিত্র ফাইলগুলি jszip দেখুন ।

— bszom
সূত্র
0

জাভাস্ক্রিপ্ট মধ্যে স্ক্রিনশট নেওয়ার জন্য একটি মহান সমাধান দ্বারা এক https://grabz.it ।

তাদের কাছে একটি নমনীয় এবং সহজেই ব্যবহারযোগ্য স্ক্রিনশট এপিআই রয়েছে যা কোনও প্রকার জেএস অ্যাপ্লিকেশন দ্বারা ব্যবহার করা যেতে পারে।

আপনি যদি এটি চেষ্টা করতে চান তবে প্রথমে আপনার অনুমোদন অ্যাপ্লিকেশন কী + গোপন এবং নিখরচায় এসডিকে পাওয়া উচিত

তারপরে, আপনার অ্যাপ্লিকেশনটিতে প্রয়োগের পদক্ষেপগুলি হ'ল:

// include the grabzit.min.js library in the web page you want the capture to appear
<script src="grabzit.min.js"></script>

//use the key and the secret to login, capture the url
<script>
GrabzIt("KEY", "SECRET").ConvertURL("http://www.google.com").Create();
</script>

স্ক্রিনশটটি বিভিন্ন পরামিতিগুলির সাথে কাস্টমাইজ করা যায় । উদাহরণ স্বরূপ:

GrabzIt("KEY", "SECRET").ConvertURL("http://www.google.com", 
{"width": 400, "height": 400, "format": "png", "delay", 10000}).Create();
</script>

এখানেই শেষ. তারপরে কিছুক্ষণ অপেক্ষা করুন এবং আপনার পৃষ্ঠাটি পুনরায় লোড করার প্রয়োজন ছাড়াই চিত্রটি স্বয়ংক্রিয়ভাবে পৃষ্ঠার নীচে উপস্থিত হবে।

স্ক্রিনশট প্রক্রিয়াতে অন্যান্য কার্যকারিতা রয়েছে যা আপনি এখানে অন্বেষণ করতে পারেন ।

স্থানীয়ভাবে স্ক্রিনশট সংরক্ষণ করাও সম্ভব। তার জন্য আপনাকে গ্র্যাবজিট সার্ভার সাইড এপিআই ব্যবহার করতে হবে। আরও তথ্যের জন্য এখানে বিস্তারিত গাইড চেক করুন ।

— জনি
সূত্র
0

আপনি যদি সার্ভারের পক্ষ থেকে এটি করতে ইচ্ছুক হন তবে ফ্যান্টমজেএস এর মতো বিকল্প রয়েছে যা এখন অবহিত । যেতে ভাল উপায় মত কিছু দিয়ে মস্তিষ্কহীন ক্রোম হবে Puppeteer Node.JS. উপর নীচে পপিটার ব্যবহার করে একটি ওয়েব পৃষ্ঠা ক্যাপচার করা সহজ হবে:

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  await page.screenshot({path: 'example.png'});

  await browser.close();
})();

তবে এটি আপনার সার্ভারগুলিতে চালনার জন্য হেডলেস ক্রোম প্রয়োজন, যার কিছুটা নির্ভরতা রয়েছে এবং এটি সীমিত পরিবেশে উপযুক্ত নাও হতে পারে। (এছাড়াও, আপনি যদি নোড.জেএস ব্যবহার না করে থাকেন তবে আপনাকে নিজেরাই ব্রাউজারগুলির ইনস্টলেশন / প্রবর্তন পরিচালনা করতে হবে))

আপনি যদি কোনও সাএস পরিষেবা ব্যবহার করতে ইচ্ছুক হন তবে অনেকগুলি বিকল্প রয়েছে

— একিন কোক
সূত্র
0

আজকের এপ্রিল 2020 গিটহাব লাইব্রেরি এইচটিএমএল 2 ক্যানভাস https://github.com/niklasvh/html2 ক্যানভাস

GitHub 20K তারা | আজুর পাইপগুলি: সফল | ডাউনলোডগুলি 1.3M / mo |

উদ্ধৃতি: " জাভাস্ক্রিপ্ট এইচটিএমএল রেন্ডারার স্ক্রিপ্টটি আপনাকে সরাসরি ওয়েবপৃষ্ঠাগুলি বা এর অংশগুলির" স্ক্রিনশট "গ্রহণ করতে দেয় , সরাসরি ব্যবহারকারী ব্রাউজারে The একটি আসল স্ক্রিনশট তৈরি করে না, তবে পৃষ্ঠায় উপলব্ধ তথ্যের উপর ভিত্তি করে স্ক্রিনশট তৈরি করে।

— zennni
সূত্র
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.