How do I generate a png file w/ selenium/phantomjs

2019-01-25 16:21发布

问题:

I am using selenium/phantomjs to create png files of html in python. Is there a way to generate the png from an html string or filehandle (instead of a website)? I've searched through the selenium docs and googled but couldn't find an answer. I have:

htmlString = '<html><body><div style="background-color:red;height:500px;width:500px;">This is a png</div></body></html>'
myFile = 'tmp.html'
f = open(myFile,'w')
f.write(htmlString) 

from selenium import webdriver  

driver = webdriver.PhantomJS()
driver.set_window_size(1024, 768) 
#driver.get('https://google.com/') # this works fine
driver.get(myFile) # passing the file name or htmlString doesn't work...creates a blank png with nothing
driver.save_screenshot('screen.png') 
driver.quit()

print "png file created"

回答1:

PhantomJS

var page = require('webpage').create();
page.open('http://github.com/', function () {
    page.render('github.png');
    phantom.exit();
});

This is how to get a screenshot in phantomJS, I've used phantomJS for some time now.

You can find more information here.

Selenium

driver = webdriver.Chrome();
driver.get('http://www.google.com');
driver.save_screenshot('out.png');
driver.quit();

Hope this helps.



回答2:

Pure good old python - set the content on any opened page to your target html - through JS. Taking your example code:

from selenium import webdriver

htmlString = '<html><body><div style="background-color:red;height:500px;width:500px;">This is a png</div></body></html>'

driver = webdriver.PhantomJS() # the normal SE phantomjs binding
driver.set_window_size(1024, 768)
driver.get('https://google.com/') # whatever reachable url
driver.execute_script("document.write('{}');".format(htmlString))  # changing the DOM

driver.save_screenshot('screen.png')   #screen.png is a big red rectangle :)
driver.quit()

print "png file created"


回答3:

PhantomJS

var page = require('webpage').create();
page.content = '<html><body><p>Hello world</p></body></html>';
page.render('name.png');

You set the content of the page using page.content Then you render it using page.render

Example using phantomjs-node

phantom.create(function (ph) {
  ph.createPage(function (page) {
      page.set('viewportSize', {width:1440,height:900})

      //like this
      page.set('content', html);

      page.render(path_to_pdf, function() { 
        //now pdf is written to disk.
        ph.exit();
      });
  });
});


回答4:

It seems the lines

f = open(myFile,'w')
f.write(htmlString) 

Are problematic, as the generated file is empty.

I fixed this issue with

with open(myFile,'wt') as f:
    f.write(htmlString)

or you might have to add a

f.close() to your code