Chụp ảnh màn hình của Chrome bằng Công cụ dành cho nhà phát triển Chrome?

Question

Có thể chụp ảnh màn hình của một cửa sổ đang mở bằng trình gỡ lỗi từ xa Công cụ phát triển Chrome không?

Ví dụ, tôi đang kết nối vào cổng debug từ xa và tôi có mã này mà bật một cửa sổ trống:

private void sendWindowPop(int width, int height) throws 
IOException { 
     hsc.send("{\"method\": \"Runtime.evaluate\", \"id\": " 
       + hsc.nextInt() 
       + ", \"params\": {" 
       + "\"expression\": 
\"window.open('about:blank','name','toolbar=0,scrollbars=0," 
       + "location=0,status=0,menubar=0,resizable=0,width=" 
       + width 
       + ",height=" 
       + height 
       + "');\"" 
       + "}}"); 

(HSC là kết nối của tôi đến debugger tại http://localhost:9222)

Sau đó, tôi tải lên URL mục tiêu của mình với điều này:

private void loadPage(String uriString) throws IOException { 
     hsc.send("{\"method\": \"Page.open\", \"id\": " + 
     hsc.nextInt() + ", \"params\": {\"url\": \"" + uriString + "\"}}"); 
     hsc.waitFor(ChromeNotifications.PAGE_LOADEVENTFIRED, DEFAULT_TIMEOUT_MILLIS); 
    } 

Mã ở trên hoạt động tốt và trước tiên bật cửa sổ và sau đó tải URL. Lý tưởng nhất, điều tiếp theo tôi muốn làm là lấy một ảnh chụp màn hình của trang web đã tải. Ngay bây giờ, các cửa sổ trình duyệt này bật lên màn hình ảo Xvfb và tôi có thể sử dụng công cụ nhập của ImageMagick để chụp ảnh chụp màn hình của cửa sổ mục tiêu, nhưng chỉ nếu ở trong foreground.

Đây là một vấn đề, vì ứng dụng này được thiết kế để chạy trong song song với nhiều cửa sổ bật vào màn hình ảo. Mọi cửa sổ chồng lên cửa sổ mục tiêu của tôi sẽ chỉ cho tôi một ảnh chụp màn hình màu đen , vì Xfvb chỉ hiển thị nội dung hiển thị.

Tôi cũng đã xem xét tham chiếu API, chrome.tabs.captureVisibleTab. Không có may mắn ở đó, nó không nắm bắt những gì không nhìn thấy được.

Có cách nào, sử dụng trình gỡ lỗi từ xa, để chụp ảnh màn hình của một cửa sổ mở không?

(cho mục đích tham khảo, lệnh ImageMagick tôi nhập khẩu là này)

DISPLAY=:0.0 import -window "Google - Chromium" screenshot.png 

Nơi tôi mở URL http://www.google.com trong trình duyệt crom của tôi sử dụng loadPage() ở trên. Nó hoạt động tuyệt vời miễn là cửa sổ "Google - Chromium" bật lên không bị cản trở và có tiêu điểm. Thả một cửa sổ khác trên một phần của nó, và tôi nhận được một khu vực màu đen lớn mà không được trả lại.

Cảm ơn!

Answer 1

Chrome Remote Debugging Nghị định thư bây giờ hỗ trợ các Page.captureScreenshot chức năng

Dưới đây là một ví dụ trong cà phê kịch bản

screenshot: (name, callback)=> 
    safeName = name.replace(/[^()^a-z0-9._-]/gi, '_') + ".png" 
    png_File = "./_screenshots".append_To_Process_Cwd_Path().folder_Create() 
           .path_Combine(safeName) 

    @chrome._chrome.Page.captureScreenshot (err, image)-> 
     require('fs').writeFile png_File, image.data, 'base64',(err)-> 
     callback() 

(đoạn từ https://github.com/TeamMentor/TM_4_0_Design/blob/Issue_80_Jade_Cleanup/QA/API/QA-TM_4_0_Design.coffee#L54)

Answer 2

Thử Aviary Screen Capture

Kiểm tra trang web này quá:

http://www.webdesignerdepot.com/2011/08/25-must-have-chrome-extensions-for-web-designers-and-developers/

Answer 3

Nếu bạn cần Java dựa trên giải pháp sử dụng cdp4j để nắm bắt trang đầy đủ màn hình.

public static void main(String[] args) throws IOException, InterruptedException { 
    SessionFactory factory = new Launcher().launch(); 

    Path file = createTempFile("screenshot", ".png"); 

    try (Session session = factory.create()) { 
     session.navigate("https://webfolder.io"); 
     session.waitDocumentReady(); 
     byte[] data = session.captureScreenshot(); 
     write(file, data); 
    } 

    if (isDesktopSupported()) { 
     getDesktop().open(file.toFile()); 
    } 

    factory.close(); 
} 

Screenshot.java