वेब कॅप्चर आणि रूपांतरित करण्यासाठी साधने

वेबसाइट स्क्रीनशॉट कॅप्चर करा किंवा प्रतिमांमध्ये एचटीएमएल रूपांतरित करा

नोड.जेएस एपीआय

खालील वैशिष्ट्यांचा वापर करुन वेबसाइटचे अचूक प्रतिमा स्क्रीनशॉट तयार करा GrabzIt चे Node.js API. तथापि आपण सुरू करण्यापूर्वी लक्षात ठेवा की कॉल केल्यावर url_to_image, html_to_image or file_to_image पद्धती save or save_to स्क्रीनशॉट घेण्यासाठी पद्धत कॉल करणे आवश्यक आहे.

मूलभूत पर्याय

वेब पृष्ठाचा स्क्रीनशॉट घेण्यासाठी फक्त एक पॅरामीटर आवश्यक आहे किंवा एचटीएमएल रूपांतरित करा intओए प्रतिमा पुढील उदाहरणात दर्शविल्याप्रमाणे.

client.url_to_image("https://www.tesla.com");
//Then call the save or save_to method
client.html_to_image("<html><body><h1>Hello World!</h1></body></html>");
//Then call the save or save_to method
client.file_to_image("example.html");
//Then call the save or save_to method

प्रतिमा स्क्रीनशॉट स्वरूप

जीआरजीआयटीचे नोड.जेएसआयपीपी जेपीजी, पीएनजी, डब्ल्यूईबीपी, बीएमपी (एक्सएनयूएमएक्स बिट, एक्सएनयूएमएक्स बिट, एक्सएनयूएमएक्स बिट किंवा एक्सएनयूएमएक्स बिट) आणि टीआयएफएफ यासह अनेक स्वरूपांमध्ये प्रतिमा स्क्रीनशॉट घेऊ शकतात. प्रतिमेच्या स्क्रीनशॉटचे डीफॉल्ट स्वरूप जेपीजी आहे. तथापि जेपीजी प्रतिमेची गुणवत्ता काही अनुप्रयोगांसाठी चांगली नसते कदाचित या परिस्थितीत प्रतिमा स्क्रीनशॉटसाठी पीएनजी स्वरुपाची शिफारस केली जाते कारण ते गुणवत्ता आणि फाईल आकारामध्ये चांगले संतुलन देते. खाली दिलेली उदाहरणे पीएनजी स्वरूप वापरुन घेतलेला एक प्रतिमा स्क्रीनशॉट दर्शविते.

var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"format":"png"};

client.url_to_image("https://www.tesla.com", options);
//Then call the save or save_to method
client.save_to("result.png", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});
var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"format":"png"};

client.html_to_image("<html><body><h1>Hello World!</h1></body></html>", options);
//Then call the save or save_to method
client.save_to("result.png", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});
var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"format":"png"};

client.file_to_image("example.html", options);
//Then call the save or save_to method
client.save_to("result.png", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});

ब्राउझर आकार

ब्राउझर आकार ब्राउझर विंडोच्या आकारास संदर्भित करतो जे बहुतेक प्रकरणांमध्ये स्क्रीनशॉट कॅप्चर करताना वापरला जाईल हे डीफॉल्ट ब्राउझर आकार सर्व कार्यांसाठी पुरेसा असेल म्हणून सेट करण्याची आवश्यकता नाही. तथापि आपण ब्राउझरची रुंदी आणि उंची सेट करू इच्छित नसल्यास एक उदाहरण खाली दर्शविले आहे.

var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"browserWidth":1366, "browserHeight":768};

client.url_to_image("https://www.tesla.com", options);
//Then call the save or save_to method
client.save_to("result.jpg", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});
var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"browserWidth":1366, "browserHeight":768};

client.html_to_image("<html><body><h1>Hello World!</h1></body></html>", options);
//Then call the save or save_to method
client.save_to("result.jpg", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});
var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"browserWidth":1366, "browserHeight":768};

client.file_to_image("example.html", options);
//Then call the save or save_to method
client.save_to("result.jpg", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});

प्रतिमा आकार बदला

प्रतिमेचा आकार बदलणे सोपे आहे, प्रतिमा विकृत न करता ते करणे थोडे कठिण आहे. संपूर्ण प्रक्रिया सुलभ करण्यासाठी आम्ही आपल्याला याचा वापर करण्याची शिफारस करतो साधे प्रतिमा परिमाण कॅल्क्युलेटर.

आपण ब्राउझरच्या रुंदी आणि उंचीपेक्षा मोठ्या आकारात प्रतिमेची रुंदी आणि उंची वाढवू इच्छित असल्यास, डीफॉल्टनुसार एक्सएनयूएमएक्सने एक्सएनयूएमएक्स पिक्सलद्वारे, ब्राउझरची रुंदी आणि उंची देखील जुळण्यासाठी वाढविली पाहिजे.

सानुकूल अभिज्ञापक

आपण एक सानुकूल अभिज्ञापक पास करू शकता प्रतिमा खाली दर्शविल्या गेलेल्या पद्धती, हे मूल्य नंतर आपल्या GrabzIt Node.js हँडलरला परत केले जाईल. उदाहरणार्थ हा सानुकूल अभिज्ञापक डेटाबेस अभिज्ञापक असू शकतो, ज्यामुळे स्क्रीनशॉटला विशिष्ट डेटाबेस रेकॉर्डशी संबद्ध होऊ दिले जाते.

var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"customId":123456};

client.url_to_image("https://www.tesla.com", options);
//Then call the save method
client.save("http://www.example.com/handler", function (error, id){
    if (error != null){
        throw error;
    }
});
var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"customId":123456};

client.html_to_image("<html><body><h1>Hello World!</h1></body></html>", options);
//Then call the save method
client.save("http://www.example.com/handler", function (error, id){
    if (error != null){
        throw error;
    }
});
var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"customId":123456};

client.file_to_image("example.html", options);
//Then call the save method
client.save("http://www.example.com/handler", function (error, id){
    if (error != null){
        throw error;
    }
});

पूर्ण लांबी स्क्रीनशॉट

GrabzIt आपल्याला संपूर्ण वेब पृष्ठाचा संपूर्ण लांबीचा स्क्रीनशॉट घेण्याची परवानगी देते हे करण्यासाठी आपल्याला -1 ला जाण्याची आवश्यकता आहे browserHeight मालमत्ता. प्रतिमा ब्राउझरच्या आकाराशी जुळत असल्याचे सुनिश्चित करण्यासाठी हे एक -1 पास करते height आणि width गुणधर्म.

var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"browserHeight":-1,"width":-1, "height":-1};

client.url_to_image("https://www.tesla.com", options);
//Then call the save or save_to method
client.save_to("result.jpg", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});
var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"browserHeight":-1,"width":-1, "height":-1};

client.html_to_image("<html><body><h1>Hello World!</h1></body></html>", options);
//Then call the save or save_to method
client.save_to("result.jpg", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});
var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"browserHeight":-1,"width":-1, "height":-1};

client.file_to_image("example.html", options);
//Then call the save or save_to method
client.save_to("result.jpg", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});

आपण क्रॉप न केलेले लघुप्रतिमा देखील परत येऊ शकता परंतु सावधगिरी बाळगा यामुळे मोठ्या प्रतिमा तयार होऊ शकतात. हे करण्यासाठी एक -1 पास करा height आणि / किंवा width गुणधर्म. -एक्सएनयूएमएक्स उत्तीर्ण होणारे परिमाण क्रॉप केले जाणार नाही.

var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"width":-1, "height":-1};

client.url_to_image("https://www.tesla.com", options);
//Then call the save or save_to method
client.save_to("result.jpg", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});
var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"width":-1, "height":-1};

client.html_to_image("<html><body><h1>Hello World!</h1></body></html>", options);
//Then call the save or save_to method
client.save_to("result.jpg", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});
var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

var options = {"width":-1, "height":-1};

client.file_to_image("example.html", options);
//Then call the save or save_to method
client.save_to("result.jpg", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});
लक्षात ठेवा ब्राउझरची पूर्ण लांबी नाही.

ही विशेष मूल्ये वापरण्याचा अर्थ असा आहे की आपण इच्छित असल्यास आपण संपूर्ण वेब पृष्ठाची संपूर्ण आवृत्ती असलेली स्क्रीनशॉट तयार करू शकता!

पृष्ठ घटकांचा स्क्रीनशॉट घ्या

ग्रॅबझिट आपल्याला एचटीएमएल घटकाचा स्क्रीनशॉट घेण्यास अनुमती देते, जसे की div or span टॅग करा आणि त्याची सर्व सामग्री कॅप्चर करा. हे करण्यासाठी एचटीएमएल घटक आपण स्क्रीनशॉट करू इच्छित एक म्हणून निर्दिष्ट करणे आवश्यक आहे सीएसएस निवडकर्ता.

...
<div id="features">
	<img src="http://www.example.com/boat.jpg"/><h3>New Boat Launched</h3>
</div>
...

खाली दिलेल्या उदाहरणासाठी आम्ही आयडी "वैशिष्ट्ये" सह डिव्ह निवडू आणि त्यास एक्सएनयूएमएक्स एक्स एक्सएनयूएमएक्सपीएक्स जेपीईजी प्रतिमा म्हणून आउटपुट करू.

var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

// The 250 parameters indicates that image should be sized to 250 x 250 px
var options = {"width":250, "height":250, "format":"jpg","target":"#features"};

client.url_to_image("http://www.bbc.co.uk/news", options);
//Then call the save or save_to method
client.save_to("result.jpg", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});

पुढील उदाहरण "वैशिष्ट्ये" डिव्ह चे आणखी एक स्क्रीनशॉट घेते परंतु यावेळी एक जेपीईजी प्रतिमा दर्शवितो जी Div चा अचूक आकार आहे.

var grabzit = require('grabzit');

var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret");

// The minus ones indicates that image should not be cropped
var options = {"browserHeight":-1, "width":-1, "height":-1, "format":"jpg", "target":"#features"};

client.url_to_image("http://www.bbc.co.uk/news", options);
//Then call the save or save_to method
client.save_to("result.jpg", function (error, id){
    //this callback is called once the capture is downloaded
    if (error != null){
        throw error;
    }
});