小花仙通过远程Chrome远程调试来高清截图

鄙人一直在竭力简化小花仙高清截图的操作步骤。这次再来尝试使用原生的Chrome远程调试来操作CDP的指令。
参考之前的文章python selenium chrome 控制devtools 一些线索将一个可以使用Flash的浏览器添加一个启动参数--remote-debugging-port=9222，然后访问http://hua.61.com/Client.swf，登录账号，然后打开要截图的玩家面板。
再开一个浏览器，访问http://localhost:9222，按F12打开开发者工具，切换到Console。粘贴下列代码，按照注释修改开头的那几个参数并回车（这里写的参数是截图玩家面板的形象，如果是截取这个形象的就可以不用修改直接回车）。稍等片刻即可从第二个打开的浏览器看到下载文件的提示。

var shotWidth = 4320; // 截图宽
var shotHeight = 7680; // 截图高
var scale = 20; // 100除以缩放倍率的商，例如缩放5.0倍就是100/5.0=20
var panX = -4500; // Flash缩放后的移动视野X
var panY = -2000; // Flash缩放后的移动视野Yfunction downloadFile(fileName, content) { //下载base64图片var base64ToBlob = function(code) {let raw = window.atob(code);let rawLength = raw.length;let uInt8Array = new Uint8Array(rawLength);for(let i = 0; i < rawLength; ++i) {uInt8Array[i] = raw.charCodeAt(i);}return new Blob([uInt8Array], {type: "image/png"});};let aLink = document.createElement('a');let blob = base64ToBlob(content); //new Blob([content]);let evt = document.createEvent("HTMLEvents");evt.initEvent("click", true, true); //initEvent 不加后两个参数在FF下会报错  事件类型，是否冒泡，是否阻止浏览器的默认行为aLink.download = fileName;aLink.href = URL.createObjectURL(blob);aLink.click();
};var fileBase64 = "";let sleep = (time) => {return new Promise(resolve => setTimeout(resolve, time))
}var xmlhttp;
if (window.XMLHttpRequest)
{//  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码xmlhttp=new XMLHttpRequest();
}
else
{// IE6, IE5 浏览器执行代码xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{if (xmlhttp.readyState==4 && xmlhttp.status==200){let responseJSON = JSON.parse(xmlhttp.responseText);let wsURL = "";for (var x in responseJSON) {if (responseJSON[x].url.lastIndexOf("http://hua.61.com/Client.swf") != -1) {wsURL = responseJSON[x].webSocketDebuggerUrl;}}let ws = new WebSocket(wsURL);ws.onopen = async function (d) {console.log('chrome remote debugger connected');ws.send(`{"id": 1, "method": "Emulation.clearDeviceMetricsOverride", "params": {}}`);ws.send(`{"id": 1, "method": "Emulation.setDeviceMetricsOverride", "params": {"mobile":false, "width":` + shotWidth + `, "height":` + shotHeight + `, "deviceScaleFactor": 1}}`);ws.send(`{"id": 1, "method": "Page.navigate", "params": {"url": "javascript:document.getElementsByTagName('embed')[0].Zoom(500);"}}`);await sleep(2000);ws.send(`{"id": 1, "method": "Page.navigate", "params": {"url": "javascript:document.getElementsByTagName('embed')[0].Zoom(` + scale + `);"}}`);await sleep(5000);console.log("flash zoomed");ws.send(`{"id": 1, "method": "Page.navigate", "params": {"url": "javascript:document.getElementsByTagName('embed')[0].Pan(` + panX + `,` + panY + `,0);"}}`);await sleep(5000);console.log("flash view moved");await sleep(5000);ws.send(`{"id": 155, "method": "Page.captureScreenshot", "params": {"fromSurface":true}}`);await sleep(5000);ws.send(`{"id": 1, "method": "Emulation.clearDeviceMetricsOverride", "params": {}}`);console.log("cleared emulation");ws.send(`{"id": 1, "method": "Page.navigate", "params": {"url": "javascript:document.getElementsByTagName('embed')[0].Zoom(500);"}}`);console.log("flash zoom reset");}ws.onmessage = function(d) {if (JSON.parse(d.data)['id'] == '155') {console.log('screenshot captured');console.log('png base64 length: ' + JSON.parse(d.data)['result']['data'].length);fileBase64 = JSON.parse(d.data)['result']['data'];downloadFile('output.png', fileBase64);}}}
}
xmlhttp.open("GET","http://localhost:9222/json",true);
xmlhttp.send();

参考资料：http://fex.baidu.com/blog/2014/06/remote-debugging-protocol/

小花仙通过远程Chrome远程调试来高清截图相关推荐

【全网首发最全】首届盘古石杯全国电子数据取证大赛晋级赛write up 2023年奇安信取证比赛高清截图
2023盘古石杯晋级赛write up技术交流wechat N34939 高清截图解析引用xiang同学https://mp.weixin.qq.com/s/NLuj2g7vrZHCaitUjUz5 ...
h5跨域访问图片_网页保存为图片及高清截图的优化 | canvas跨域图片配置
本次技术调研来源于H5项目中的一个重要功能需求:实现微信长按网页保存为截图. 这里有个栗子(请用微信打开,长按图片即可保存):3分钟探索你的知识边界将整个网页保存为图片是一个十分有趣的功能,常见于H ...
网页保存为图片及高清截图的优化 | canvas跨域图片配置
本次技术调研来源于H5项目中的一个重要功能需求:实现微信长按网页保存为截图. 这里有个栗子(请用微信打开,长按图片即可保存):3分钟探索你的知识边界将整个网页保存为图片是一个十分有趣的功能,常见于H ...
【高清截图】UbuntuKylin 14.04 桌面版安装步骤
Ubuntu 14.04 北京时间今日凌晨3点发布,守了一夜,一发布就立即下载了镜像文件,要知道明天下载服务器都比较繁忙.因为官方网站直接跳转到中文麒麟版本的页面,我先下载了麒麟版本,先用用这个吧!当 ...
【Unity】游戏高清截图
需求截取游戏实时截图,作为宣传图. 具体要求 (1)图片五张或以上: 图片尺寸以游戏实际画面为准.(2)横版游戏建议尺寸: 16:9,1280*720及以上. 解决思路 (1)因为是横版2D休闲游戏 ...
Adobe acrobat 获得PDF高清截图的两种方法(翻译外文用)
第一种方法也是最推荐(最高清的截图)的方法: 1 打开PDF然后,文件->导出->图像->png:最后再选择保存的文件夹就可以了,这样就能保存高清的图像.如果需要裁减边缘就把图像用普 ...
【截取整个网页】Chrome浏览器快速截屏，高清截图
Chrome版本78,window 10系统第一步:打开 Chrome 浏览器,输入网址,例如输入网址:https://www.golianghao.com. 第二步:Ctrl + shift + ...
swift 高清截图 ScrollView截图
extension UIScrollView {var capture: UIImage? {var image: UIImage? = nilUIGraphicsBeginImageContext( ...
Kubuntu 15.10 高清截图欣赏
KUbuntu 15.10 发布有一段时间了,个人非常喜欢 KDE 的设计,而且 KUbuntu 包括大量的改进,提供最新的 Plasma 5.4 桌面作为默认桌面环境,并提供最新的 KDE Appl ...

小花仙通过远程Chrome远程调试来高清截图

小花仙通过远程Chrome远程调试来高清截图相关推荐

最新文章

热门文章

小花仙 通过远程Chrome远程调试来高清截图

小花仙 通过远程Chrome远程调试来高清截图相关推荐

最新文章

热门文章

小花仙通过远程Chrome远程调试来高清截图

小花仙通过远程Chrome远程调试来高清截图相关推荐