js获取鼠标位置的HMTL元素

在图形化的网络爬虫软件中,都会集成一个chrome内容的浏览器,用于配置爬虫流程和需要采集的数据。它通过使用代理或者chrome插件的方式,向chrome获取的html代码中注入javascript代码,javascript代码中,阻止正常的鼠标点击和键盘事件,根据鼠标位置获取HTML元素并与windows软件交互。在这个过程中需要解决三个问题:javascript如何注入?如何写js阻止鼠标键盘事件?如何根据鼠标位置获取html元素并且与Windows软件通信?

  1. javascript的注入
    1.1 通过代理注入
    这里的代理,不严谨的说,就是请求和应答的中转方,它先获得真实web服务器的应答,修改后再发给真实的web客户端。因为代理有修改应答的机会,所以它可以随意修改html代码,往其中注入任意代码,自然也可以注入javascript。
    1.2 通过chrome插件注入
    chrome扩展运行在chrome浏览器中,用于扩展chrome功能,也可以做到任意更改html代码,常用的adblock等插件,都是通过对页面html代码的删改实现的。通过插件往html注入代码最简单的实现如下:
    const theScript = document.createElement('script');
    theScript.innerHTML = '"your code here"';//注入的javascript代码
    document.body.appendChild(theScript);

    这样之后,注入的javascript代码就成为html的一部分。
    1.3 通过iframe注入
    将需要爬取的页面设置为一个iframe的src属性值,这样就可以将目标页面嵌入到一个网页中,然后就可以在网页的javascript代码中往目标页面嵌入javascript代码,样例如下:
    var original_html=”hello,world”
    var inject_script=’’
    var html_src=’data:text/html;charset=utf-8’+encodeURI(html+inject_script)
    iframe.src=html_src
  2. javascript阻止鼠标和键盘事件
    修改window对象的事件响应函数,可以打一些简单的日志,然后全部停止掉事件的继续流转。
    function ec_click (event){
    var elementMouseIsOver = get_current_element(event)
    console.log('当前鼠标指向的元素是:', elementMouseIsOver)
    event.stopPropagation
    } window.onmousemove = ec_click
  3. javascript与windows软件或者其他javascript通信
    可以使用WebSocket完成通信,WebSocket相对于HTTP的优势时双向通信,服务器端可以主动给客户端推送消息,消息将被客户端注册的事件处理函数处理。使用websocket可以在javascript与windows软件或其他javascript之间通信,只需要找个linux主机做一个websocket服务器,中转一下消息即可。