爬虫补环境案例---问财网(rpc,jsdom,代理,selenium)

目录

一.环境检测

1. 什么是环境检测

2.案例讲解

二 .吐环境脚本

1. 简介

2. 基础使用方法

3.数据返回

4. 完整代理使用

5. 代理封装

6. 封装所有使用方法

jsdom补环境

1. 环境安装

2. 基本使用

3. 添加参数形式

Selenium补环境

1. 简介

2.实战案例

1. 逆向目标

2. 实现代码

3.实现接口

1.实际使用

RPC

1. RPC 简介

补环境案例

找加密位置

开始补环境

方法1:传统补

方法二-jsdom

方法三----利用selenium补环境

方法四:rpc

一.环境检测

1. 什么是环境检测
  • 由于浏览器和node的差别,会导致浏览器的js代码在node没有办法执行,js代码会根据浏览器的这些属性来判断你是不是在真正的浏览器执行的代码,要不是正确的浏览器环境则不会返回正确的数据信息.
  • 拿到代码在node里面执行、经常看到这一类型的错误,提示xxx未定义,其实这一块就是浏览器对象的一些特征
 if (navigator['userAgent']){^
​
ReferenceError: navigator is not defined
2.案例讲解
  • 检测执行代码是否存在navigator, 可以通过补空的方式

navigator = {}
navigator.userAgent = '11111'
​
function ps(){if (navigator['userAgent']){return 'hello world'} else {return  '失败'}
}
​
console.log(ps());
 
  • 检测属性长度,会根据长度来判断你的数据是否正确,是不是一个空数据

location = {}
location.href = '123123'
function ps(){if (location['href'].length > 3){return 'hello world'} else {return  '失败'}
}
​
console.log(ps());
  • js异常代码捕获,很多情况下可能js代码会把异常给捕获掉导致我们结果不对
  • 可以输出异常捕获的内容, 或者可以直接把异常捕获的代码直接删除,把错误暴露出来
location = {}
location.host = '12334'
navigator = {}
navigator.userAgent = '1231234'
function pn() {// try {verify_local()if (navigator['userAgent']) {return 'hello world'}// } catch (e) {//     console.log(e)//     return '错误的数据'// }
}
​
function verify_local() {if (location.host.length > 2) {return 'xxx'}
}
​
console.log(pn());
  • 浏览器和node环境差异
  • 在 Node.js 中,exports 是一个用于导出模块中的函数、对象、变量等的对象。
  • 浏览器是undefined
  • 可以删除, 或者可以修改的判断成功
// 浏览器和 node差异
sss = "undefined" != typeof exports ? exports : void 0
console.log(typeof sss);
  • global检测
glb= "undefined" == typeof window ? global:window

二 .吐环境脚本

1. 简介

Proxy可以理解为,在目标对象之前设一层"拦截",外界对该对象的访问,都必须通过这层拦截,可以对外界的访问进行过滤和改写(表示可以用它"代理"某些操作,可以翻为“代理器")。

api地址: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Prox

Proxy对象由两个部分组成:target、handler

target:目标对象handler:是一个对象,声明了代理target的指定行为,支持的拦截操作,一共13种:

  • get(target,propKey,receiver):拦截对象属性的读取。
    • target: 目标对象
    • propKey: 被获取的属性名。
    • receiver: Proxy 或者继承 Proxy 的对象
  • set(target,propKey,value,receiver):拦截对象属性的设置,返回一个布尔值(修改成功)。
    • target: 目标对象
    • propKey : 被获取的属性名。
    • value: 新属性值。
    • receiver: Proxy 或者继承 Proxy 的对象

一般的补环境的是通过运行程序后的undefined报错去一点一点分析,一点一点的去补一些环境,是非常掉头发的。

所以我们使用 Proxy 对全局遍历window、document、navigator等常见环境检测点进行代理,拦截代理对象的读取、函数调用等操作,并通过控制台输出,这样的话我们就能够实现检测环境自吐的功能,后续我们再针对吐出来的环境统一的进行补环境,这样就会方便的多。

2. 基础使用方法
var target = {name: 'JACK',age: 18,
};
​
var p = new Proxy(target, {
​get: function (target, propertyKey, receiver) {// 1 原对象// 2 访问属性// 3 代理器处理对象console.log(target, propertyKey, receiver)},set: function(target,propertyKey,value,receiver){// 1. 原对象// 2. 设置的属性// 3. 设置的值// 4. 代理器代理的对象console.log(target, propertyKey, value, receiver)}
})
p.age
p.user = 'aa'

注意:

我们现在写的代码,已经能够去拦截到取值和设置的操作,但是这个代码会打乱代码的后续运行,还并没有把对应的操作作用在原对象上,怎么解决呢?

3.数据返回

Reflect.get(target, propertyKey, receiver); //查找并返回target对象的name属性,receiver绑定this
Reflect.set(target, propertyKey, value, receiver); //设置target对象的name属性等于value

Reflect.set(target, name, value, receiver) 是 JavaScript 中的 Reflect 对象的一个方法。它用于设置指定对象的属性值,并返回一个布尔值,表示设置是否成功。

参数的含义如下:

  • target:要设置属性值的目标对象。
  • propertyKey:要设置的属性名。
  • value:要设置的属性值。
  • receiver(可选):设置属性时绑定的 this 值。

4. 完整代理使用


var target = {name: 'JACK',age: 18,
};
​
var p = new Proxy(target, {
​get: function (target, propertyKey, receiver) {temp = Reflect.get(target, propertyKey, receiver); //查找并返回target对象的name属性,receiver绑定this// 1 原对象// 2 访问属性// 3 代理器处理对象// console.log(target, propertyKey, receiver)console.log(`对象${target}--> get了属性--> ${propertyKey} 值是--> ${temp}`);return temp},set: function(target,p,value,receiver){temp = Reflect.set(target, p, value, receiver);// 1. 原对象// 2. 设置的属性// 3. 设置的值// 4. 代理器代理的对象// console.log(target, propertyKey, value, receiver)console.log("set: ", target, p, target[p]);return temp}
})
// console.log(p.age);
p.user = 'aa'
console.log(p.user)
​
 

5. 代理封装

// 目标对象(被代理对象)
var target = {name: 'JACK',age: 18,lili:{zs:'nana'}
};
​
function XlProxy(obj,name){return new Proxy(obj,{get(target, p, receiver) {temp = Reflect.get(target,p,receiver)console.log(`对象${name}--> get了属性--> ${p} 值是--> ${temp}`);if (typeof temp == 'object'){// 对于对象套对象进行挂代理temp = XlProxy(temp,name + '-->' + p)}return temp}})
}
sss = XlProxy(target,'target')
sss.name
sss.lili.zs
6. 封装所有使用方法


// 代理器封装
function get_enviroment(proxy_array) {for(var i=0; i<proxy_array.length; i++){handler = '{\n' +'    get: function(target, property, receiver) {\n' +'        console.log("方法:", "get  ", "对象:", ' +'"' + proxy_array[i] + '" ,' +'"  属性:", property, ' +'"  属性类型:", ' + 'typeof property, ' +// '"  属性值:", ' + 'target[property], ' +'"  属性值类型:", typeof target[property]);\n' +'        return target[property];\n' +'    },\n' +'    set: function(target, property, value, receiver) {\n' +'        console.log("方法:", "set  ", "对象:", ' +'"' + proxy_array[i] + '" ,' +'"  属性:", property, ' +'"  属性类型:", ' + 'typeof property, ' +// '"  属性值:", ' + 'target[property], ' +'"  属性值类型:", typeof target[property]);\n' +'        return Reflect.set(...arguments);\n' +'    }\n' +'}'eval('try{\n' + proxy_array[i] + ';\n'+ proxy_array[i] + '=new Proxy(' + proxy_array[i] + ', ' + handler + ')}catch (e) {\n' + proxy_array[i] + '={};\n'+ proxy_array[i] + '=new Proxy(' + proxy_array[i] + ', ' + handler + ')}')}
}
proxy_array = ['window', 'document', 'location', 'navigator', 'history','screen']
get_enviroment(proxy_array)
 

jsdom补环境

参考地址:Create new page · jsdom/jsdom Wiki · GitHub中文文档

jsdom是一个纯粹由 javascript 实现的一系列 web标准,特别是 WHATWG 组织制定的DOM和 HTML 标准,用于在nodejs中使用。大体上来说,该项目的目标是模拟足够的Web浏览器子集,以便用于测试和挖掘真实世界的Web应用程序

1. 环境安装
npm install jsdom --save
2. 基本使用
const jsdom = require("jsdom");
const { JSDOM } = jsdom;
const dom = new JSDOM(`<!DOCTYPE html><p>Hello world</p>`);
title = dom.window.document.querySelector("p").textContent
console.log(title)
3. 添加参数形式
const dom = new JSDOM(``, {url: "http://q.10jqka.com.cn/",referrer: "http://q.10jqka.com.cn/",contentType: "text/html",includeNodeLocations: true,storageQuota: 10000000
});

Selenium补环境

1. 简介

Selenium就是一个真实的环境地址,对于我们拿下来的js代码,在node是需要补环境的,但是在浏览器去执行的话,他就是一个真实的浏览器环境,所以可以节省我们扣代码的时间,我们可以把扣下来的代码直接用Selenium来进行访问

2.实战案例
1. 逆向目标
  • 网址:A股市场_同花顺行情中心_同花顺财经网
  • 参数:cookie :v
2. 实现代码
  • 我们把同花顺的js代码直接放到html文件
  • python代码
import os
from selenium import webdriver
​
PRO_DIR = os.path.dirname(os.path.abspath(__file__))
def driver_sig(html_file):option = webdriver.ChromeOptions()option.add_argument('--disable-blink-features=AutomationControlled')option.add_argument('headless')driver = webdriver.Chrome(options=option)driver.get(PRO_DIR +'\\'+ html_file)# time.sleep(2)# sig = driver.execute_script('return window.aaa()')# print(sig)return driver
​
html_file = 'index.html'
driv = driver_sig(html_file)
​
print(driv.execute_script('return window.aaa()'))
​

3.实现接口

pip install flask
from flask import Flask
​
# 创建 Flask 应用实例
app = Flask(__name__)
​
# 定义路由和视图函数
@app.route('/')
def hello():return 'Hello, Flask!'
​
# 启动应用
if __name__ == '__main__':app.run()
  • Flask 是一个基于 Python 的轻量级、简单易用的 Web 应用框架。它提供了一个灵活且容易扩展的方式来构建 Web 应用程序。以下是一个简单的示例展示了如何使用 Flask 框架创建一个简易的 Web 应用:
  • 在上述示例中,我们首先导入了 Flask 模块,并创建了一个 Flask 应用实例 app。然后,使用 @app.route() 装饰器定义了一个路由以及对应的视图函数。在本例中,根路由 '/' 对应的视图函数是 hello(),它返回了一个简单的字符串 'Hello, Flask!'。最后,通过调用 app.run() 来启动应用。
  • 要运行这个应用,你需要确保已经安装了 Flask 模块。运行应用后,在浏览器中访问 http://localhost:5000/,你将看到输出的 'Hello, Flask!'。
1.实际使用
# -*- coding: utf-8 -*-
​
from flask import Flask, request
​
from selenium import webdriver
import os
from selenium.webdriver.common.by import By
# pip install flask
from flask import Flask, jsonify
​
PRO_DIR = os.path.dirname(os.path.abspath(__file__))
​
​
def driver_sig(html_file):option = webdriver.ChromeOptions()option.add_argument('--disable-blink-features=AutomationControlled')option.add_argument('headless')driver = webdriver.Chrome(options=option)driver.get(PRO_DIR + '\\' + html_file)# time.sleep(2)# sig = driver.execute_script('return window.aaa()')# print(sig)return driver
​
​
html_file = 'index.html'
driv = driver_sig(html_file)
​
# 创建 Flask 应用实例
app = Flask(__name__)
​
​
# 定义路由和视图函数
@app.route('/s', methods=['get', 'post'])
def hello():context = {# 加载本地地址 生成cookie值'v': driv.execute_script('return window.aaa()')}# 返回cookie值return jsonify(context=context)
​
​
​
# 启动应用
if __name__ == '__main__':app.run()
​

RPC

1. RPC 简介

为什么要使用RPC技术呢?我们在使用websocket时候可以发现,python在操作的时候,需要创建连接,还需要不断去接受传递数据,非常的麻烦, 那这个时候rpc技术可以帮助到我们,简单来说就是网页直接和rpc服务器进行交互,我们python可以直接调用,rpc暴露的接口,不需要关心,创建连接这一块的问题.

RPC 技术是非常复杂的,对于我们搞爬虫、逆向的来说,不需要完全了解,只需要知道这项技术如何在逆向中应用就行了。

RPC 在逆向中,简单来说就是将本地和浏览器,看做是服务端和客户端,二者之间通过 WebSocket 协议进行 RPC 通信,在浏览器中将加密函数暴露出来,在本地直接调用浏览器中对应的加密函数,从而得到加密结果,不必去在意函数具体的执行逻辑,也省去了扣代码、补环境等操作,可以省去大量的逆向调试时间。

补环境案例

案例站:688262.SH - 同花顺问财

接口:

找加密位置

xhr断点发现段不住,原因就是他不是ajax发包的

请求堆栈里面断点

这个地方的接口是公用的

往上多看几个站,发现是在这里弄的

但是发现这里也是公用的多过几个

这个时候并没有加密,逐行运行

f10一次之后发现就加密了

所以是 document.getElementsByTagName("head")[0].appendChild(d),加密的

f11进去

r是script标签

所以加密的方法就在

L方法里面

把整个文件扣下来

因为他是动态的,所以我们请求这个文件,在改代码

网站的调用方式是

 var d = document.createElement("script");e.cache || n.cache ? d.setAttribute("src", "" + o) : (o += -1 === o.indexOf("?") ? "?" : "&",d.setAttribute("src", "" + o + s + "=" + c)),e.charset && d.setAttribute("charset", e.charset),d.id = f,document.getElementsByTagName("head")[0].appendChild(d),

我们也这么干

 var d = document.createElement("script");// # e.cache || n.cache ? d.setAttribute("src", "" + o) : (o += -1 === o.indexOf("?") ? "?" : "&",d.setAttribute("src","https://d.10jqka.com.cn/v6/line/17_688262/01/today.jscallback=quotebridge_v6_line_17_688262_01_today"),// #e.charset && d.setAttribute("charset", e.charset),d.id ="callback_quotebridge_v6_line_17_688262_01_today",document.getElementsByTagName("head")[0].appendChild(d)

那我们在浏览器运行成功了,下一步放在node.js里面

运行

开始补环境

方法1:传统补

对比发现真实的环境中q是ture,所以这里逻辑有问题,找到赋值的位置

方法二-jsdom

我们在开头加入

const jsdom = require("jsdom");
const {JSDOM} = jsdom;
var dom = new JSDOM('<!DOCTYPE html><p>hello world</p>')
window = dom.window
document = dom.window.document
Document=dom.window.Document
// console.log(dom.window.document)
navigator = dom.window.navigator
Element=dom.window.Element
// Element =function Element(){}
Element.prototype.insertBefore=function insertBefore(d){window.perry=d.src}location=dom.window.location
location.href='https://www.iwencai.com/unifiedwap/result?w=688262.SH%20&querytype=stock'
location.hostname='www.iwencai.com'
location.host='www.iwencai.com'
location.protocol='http:'navigator.userAgent='Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36 Edg/130.0.0.0'Document.prototype.getElementsByTagName=function getElementsByTagName(){return [{appendChild:function (d){Element.prototype.insertBefore(d)}}]
}

运行

发现成功,补完了

方法三----利用selenium补环境

运行

也成功了

方法四:rpc

利用rpc技术更快捷,具体使用在我其他blog里面,具体看https://articles.zsxq.com/id_cxu1hc2vub8x.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/59523.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

免费,WPS Office教育考试专用版

WPS Office教育考试专用版&#xff0c;不仅满足了考试需求&#xff0c;更为教育信息化注入新动力。 https://pan.quark.cn/s/609ef85ae6d4

Vue前端开发,组件及组件的使用

什么是组件 组件(Component)是Vue中最强大的功能之一&#xff0c;每个Vue 文件就是一个个独立的组件&#xff0c;组件也可以被其他组件调用&#xff0c;形成嵌套关系&#xff0c;大部分的应用都是由各类不同功能的小组件进行构建&#xff0c;形成一个功能强大的大组件树系统&a…

政务数据治理专栏开搞!

写在前面 忙忙碌碌干了一年政务数据治理的工作&#xff0c;从法人数据到自然人&#xff0c;从交通到地理信息等等&#xff0c;突发想法开一个专栏讲一讲政务数据遇到的问题&#xff0c;以及治理的成效&#xff0c;或许有朋友爱看。 政务数据&#xff0c;又称之为政务数据资源&a…

前端在PC端实现支付思路流程

一.去支付 1.前端点击“去支付”按钮&#xff0c;请求订单详情接口&#xff0c;传递订单的id、订单号给后端和请求支付方式接口 2.后端返回支付信息和支付方式数据 二.弹出支付窗口 接收支付信息和支付方式数据后&#xff0c;前端弹出支付弹窗 三.确认支付 前端无论选择任何…

VUE3实现好看的世界建筑中国建筑网站源码

文章目录 1.设计来源1.1 网站主界面1.2 登录界面1.3 注册界面1.4 特色建筑展览界面1.5 世界建筑介绍界面1.6 世界建筑介绍 - 详情界面1.7 中国建筑介绍界面1.8 中国建筑介绍 - 详情界面1.9 关于我们界面 2.效果和源码2.1 动态效果2.2 源代码2.3 目录结构 源码下载万套模板&…

「人眼视觉不再是视频消费的唯一形式」丨智能编解码和 AI 视频生成专场回顾@RTE2024

你是否想过&#xff0c;未来你看到的电影预告片、广告&#xff0c;甚至新闻报道&#xff0c;都可能完全由 AI 生成&#xff1f; 在人工智能迅猛发展的今天&#xff0c;视频技术正经历着一场前所未有的变革。从智能编解码到虚拟数字人&#xff0c;再到 AI 驱动的视频生成&#…

「QT」文件类 之 QTemporaryFile 临时文件类

✨博客主页何曾参静谧的博客&#x1f4cc;文章专栏「QT」QT5程序设计&#x1f4da;全部专栏「Win」Windows程序设计「IDE」集成开发环境「UG/NX」BlockUI集合「C/C」C/C程序设计「DSA」数据结构与算法「UG/NX」NX二次开发「QT」QT5程序设计「File」数据文件格式「UG/NX」NX定制…

和 Nostr 探索 Web5 的未来

Nostr 是一个我过去两年一直在关注的协议。跟所有社区一样&#xff0c;Nostr 的发展也是起起伏伏&#xff0c;有过一些破圈被主流熟悉的时刻&#xff0c;也有一些像现在这样可能让人会觉得有点沉寂的时刻。但我还是经常关注 Nostr&#xff0c;没有特别的原因&#xff0c;就是单…

论文学习——一种基于决策变量分类的动态约束多目标进化算法

论文题目&#xff1a; A dynamic constrained multiobjective evolutionary algorithm based on decision variable classification 一种基于决策变量分类的动态约束多目标进化算法&#xff08;Yinan Guo a,b, Mingyi Huang a, Guoyu Chen a,*, Dunwei Gong c, Jing Liang d, …

数据分析案例-笔记本电脑价格数据可视化分析

&#x1f935;‍♂️ 个人主页&#xff1a;艾派森的个人主页 ✍&#x1f3fb;作者简介&#xff1a;Python学习者 &#x1f40b; 希望大家多多支持&#xff0c;我们一起进步&#xff01;&#x1f604; 如果文章对你有帮助的话&#xff0c; 欢迎评论 &#x1f4ac;点赞&#x1f4…

第T7周:Tensorflow实现咖啡豆识别

&#x1f368; 本文为&#x1f517;365天深度学习训练营 中的学习记录博客&#x1f356; 原作者&#xff1a;K同学啊 目标 具体实现 &#xff08;一&#xff09;环境 语言环境&#xff1a;Python 3.10 编 译 器: PyCharm 框 架: &#xff08;二&#xff09;具体步骤 1. 使…

vue2项目中在线预览csv文件

简介 希望在项目中&#xff0c;在线预览.csv文件&#xff0c;本以为插件很多&#xff0c;结果都只是支持excel&#xff08;.xls、.xlsx&#xff09;一到.csv就歇菜。。。 关于文件预览 vue-office&#xff1a;文档、 查看在线演示demo&#xff0c;支持docx、.xlsx、pdf、ppt…

【Excel】身份证号最后一位“X”怎么计算

大多数人身份证号最后一位都是数字&#xff0c;但有个别号码最后一位却是“X"。 如果你查百度&#xff0c;会得到如下答案&#xff1a; 当最后一位编码是10的时候&#xff0c;因为多出一位&#xff0c;所以就用X替换。 可大多数人不知道的是&#xff0c;这个10是怎么来的…

【HAProxy09】企业级反向代理HAProxy高级功能之压缩功能与后端服务器健康性监测

HAProxy 高级功能 介绍 HAProxy 高级配置及实用案例 压缩功能 对响应给客户端的报文进行压缩&#xff0c;以节省网络带宽&#xff0c;但是会占用部分CPU性能 建议在后端服务器开启压缩功能&#xff0c;而非在HAProxy上开启压缩 注意&#xff1a;默认Ubuntu的包安装nginx开…

【Java Web】JSON 以及 JSON 转换

JSON&#xff08;JavaScript Object Notation&#xff09;一种灵活、高效、轻量级的数据交换格式&#xff0c;广泛应用于各种数据交换和存储场景。 基本特点 1、简单易用&#xff1a;JSON格式非常简单&#xff0c;易于理解和使用。 2、轻量级&#xff1a;相比XML等其他数据格…

第四十一章 Vue之初识VueX

目录 一、引言 1.1. vuex的概念 1.2. vuex使用场景 1.3. 优势 二、创建演示项目 2.1. 构建项目步骤 2.2. 项目最终生成结构 2.3. 创建项目文件 2.3.1. App.vue 2.3.2. Son1.vue 2.3.3. Son2.vue 三、创建一个空仓库 3.1. 安装vuex 3.2. 新建仓库 3.3. 挂载仓库…

编程之路,从0开始:内存函数

Hello大家好&#xff01;很高兴我们又见面了。 给生活添点passion&#xff0c;开始今天的编程之路&#xff01; 今天我们来讲C语言中的内存函数。 目录 1、memcpy内存复制 2、memmove可重叠内存拷贝 3、memset设置字符 4、memcmp比较 1、memcpy内存复制 memcpy就是内存复制…

【C语言】值传递和地址传递

值传递 引用传递&#xff08;传地址&#xff0c;传引用&#xff09;的区别 传值&#xff0c;是把实参的值赋值给行参 &#xff0c;那么对行参的修改&#xff0c;不会影响实参的值。 传地址&#xff0c;是传值的一种特殊方式&#xff0c;只是他传递的是地址&#xff0c;不是普通…

Springboot采用jasypt加密配置

目录 前言 一、Jasypt简介 二、运用场景 三、整合Jasypt 2.1.环境配置 2.2.添加依赖 2.3.添加Jasypt配置 2.4.编写加/解密工具类 2.5.自定义加密属性前缀和后缀 2.6.防止密码泄露措施 2.61.自定义加密器 2.6.2通过环境变量指定加密盐值 总结 前言 在以往的多数项目中&#xff0…

axios平替!用浏览器自带的fetch处理AJAX(兼容表单/JSON/文件上传)

fetch 是啥&#xff1f; fetch 函数是 JavaScript 中用于发送网络请求的内置 API&#xff0c;可以替代传统的 XMLHttpRequest。它可以发送 HTTP 请求&#xff08;如 GET、POST 等&#xff09;&#xff0c;并返回一个 Promise&#xff0c;从而简化异步操作 基本用法 /* 下面是…