Desarrollé una pequeña extensión de Chrome, que toma una captura de pantalla de la página actual. El problema es que, cuando una parte del área actual está cubierta, por ejemplo, por el inspector o no está a la vista, la captura de pantalla se recorta. ¿Hay alguna manera de obtener la pantalla completa? Aquí mi código (despojado):
function createScreenshot() { chrome.tabs.query({active: true, lastFocusedWindow: true}, tabs => { chrome.tabs.captureVisibleTab({ format: "png" }, function (screenshotUrl) { cropImage(screenshotUrl, "Screenshot"); }); }); } function cropImage(url, fileName) { var img = new Image(); img.onload = function () { let canvas = document.createElement("canvas"); let ctx = canvas.getContext("2d"); canvas.width = img.width; canvas.height = img.height; ctx.drawImage(img, 0, 0, canvas.width, canvas.height); chrome.storage.sync.get(null, function(data) { downloadImage(canvas, fileName + ".png"); }); }; img.src = url; }por ejemplo, esta es la página que quiero fotografiar en una resolución de 4k:
como puede ver, no se ajusta a la resolución de pantalla real, pero el resultado es solo el área activa (incluso más pequeña):
¿Hay alguna manera de obtener la parte "no visible"?
Saludos, Martin
Hay una corrección menor en su código.
tienes que pasar el ancho del lienzo, la altura en drawImage
ctx.drawImage(video, 0, 0, canvas.width, canvas.height);Necesitará obtener la cadena base64
let image = canvas.toDataURL("image/png");Finalmente, obtendrás el resultado que deseas.
Espero que esta solución te ayude.