前端显示数据乱码_数据反爬之web字体应用

最新推荐文章于 2023-12-04 11:26:18 发布
最新推荐文章于 2023-12-04 11:26:18 发布
阅读量288 收藏 1
点赞数 1
文章标签： 前端显示数据乱码
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_35135418/article/details/113367202
版权
本文介绍了前端显示数据乱码的一种反爬策略，通过猫眼电影PC端电影票价格的实例，分析了如何利用Web字体与NCR字符映射来加密数据，确保数据安全。后端将原始文本用NCR编码替换，前端通过自定义字体文件进行渲染，实现了看到与下载内容不一致的效果。
摘要由CSDN通过智能技术生成

8d65c6b072301681839bd7f7b10dd024.gif

互联网医院研发部-柴进

前言

提起web字体前端工程师应该都比较熟悉，通过它可以实现UI视觉稿中的特殊字体，让页面文字展示更加的个性化。而对于后端工程师来说web字体还有其他应用场景：数据安全领域的反数据爬取(后续简称“反爬”)。

实例分析

我们以猫眼电影PC端电影票价格为例，获取某部影片的相关影院信息如下图所示，乍看起来与普通页面并没什么区别。

7c4ec88ff7815d5531e453ed0d152978.png

通过F12打开审查元素的界面就能发现并不像看起来那样简单，定位元素发现价格「38」是类似「口口」的乱码而不是数字。

87ea941cc4efebc1afe0c730fbd679f3.png

为什么页面显示的内容与审查元素时完全不同呢？

带

最低0.47元/天 解锁文章
神奇的战士
关注
Python爬虫入门教程 63-100 Python字体反爬之一，没办法，这个必须写，反爬第3篇
梦想橡皮擦，专栏100例写作模式先行者，现象级专栏 《Python 爬虫 100 例》作者、《滚雪球学 Python 专栏》原创者
04-09 1万+
在反爬圈子的一个大类，涉及的网站其实蛮多的，目前比较常被爬虫coder欺负的网站，猫眼影视，汽车之家，大众点评，58同城，天眼查…还是蛮多的，技术高手千千万，总有五花八门的反爬技术出现，对于爬虫coder来说，干！就完了，反正也996了~ 作为一个系列的文章，那免不了，依旧拿猫眼影视“学习”吧，为什么？因为它比较典型~ 猫眼影视 打开猫眼专业版，常规操作，谷歌浏览器，开发者工具，抓取DO...
「Python爬虫」：破解网站字体加密和反反爬虫
梦子微信
08-02 2989
前言：字体反爬，也是一种常见的反爬技术，例如58同城，猫眼电影票房，汽车之家，天眼查，实习僧等网站。这些网站采用了自定义的字体文件，在浏览器上正常显示，但是爬虫抓取下来的数据要么就是乱码，要么就是变成其他字符，是因为他们采用自定义字体文件，通过在线加载来引用样式，这是CSS3的新特性，通过 CSS3，web 设计师可以使用他们喜欢的任意字体 ，然后因为爬虫不会主动加载在线的字体， 字体加密一般是网页修改了默认的字符编码集，在网页上加载他们自己定义的字体文件作为字体的样式，可以正确地显示数字，但是在源码上同
web项目乱码_数据反爬之web字体应用
weixin_39610956的博客
12-09 176
互联网医院研发部-柴进前言提起web字体前端工程师应该都比较熟悉，通过它可以实现UI视觉稿中的特殊字体，让页面文字展示更加的个性化。而对于后端工程师来说web字体还有其他应用场景：数据安全领域的反数据爬取(后续简称“反爬”)。实例分析我们以猫眼电影PC端电影票价格为例，获取某部影片的相关影院信息如下图所示，乍看起来与普通页面并没什么区别。通过F12打开审查元素的界面就能发现并不像看起来那...
前端参数乱码问题解决
一切都会好起来的，即使不在今天
07-28 362
前端这样发参数 encodeURIComponent(customerName) Java解码 URLDecoder.decode(inbox.getCustomerName(),"UTF-8")
爬虫---反反爬---前端
weixin_41245276的博客
02-19 336
前端js生成formdata中的参数，普通例如：生成16位随机字符串，高级点的加密字符串：网易音乐 font-face拼凑式，woff字体文件，猫眼电影:相对来说简单，找到字体对应的正确数值，替换就可以。 background拼凑式，与font的策略类似，美团里用到的是background拼凑。数字其实是图片，根据不同的background偏移，显示出不同的字符，并且不同页面，图片的字符排序也...
前端反爬思考，好友从百度搜到了我的文章，链接却是别人的
xingyu_qie的专栏
11-09 4103
今天感叹可以改完八阿哥早点下班，在吃饭的时候，就想着自己也写了一段时间了，看看百度这个强大的引擎能不能搜到我的博客文章。
网站的常见反爬方法总结
King
03-03 1474
总结了一些网站的反爬技巧
爬虫技术-字体反爬
shifengboy的博客
09-07 1771
文本混淆章节 1. 文本混淆简介 简单而言就是利用前端技术干扰，页面可以正常展示，而使用爬虫下载后无法提取正常的数据。 1.1 常见的干扰方式 字体反爬 2. 字体反爬 2.1 字体反爬简介 ​ 在 CSS3 之前，Web 开发者必须使用用户计算机上已有的字体。目前的技术开发者可以使用@font-face为网页指定字体，开发者可将心仪的字体文件放在 Web 服务器上，并在 CSS 样式中...
进击的反爬机制
天存信息
01-29 440
一、概念 爬虫一般是指，通过一定的规则策略，自动抓取、下载互联网上网页内容，在按照某些规则算法对这些网页进行数据抽取，形成所需要的数据集。当然，有了数据之后，就有可能进行一些非法活动。 反爬虫一般是指，网站管理员使用一定的技术手段，防止爬虫程序对网站的网页内容，进行爬取，阻止爬虫爬取网页内容获取数据后，进行一些非法活动。 反爬方与爬虫方不断的进行博弈，给爬虫方不断制造爬取难度或者一定程度的阻止了爬虫方的网页爬取。而爬虫方也在不断更新技术，来对抗反爬方设置的种种防护措施。 二、对抗过程 最开始的时候，反爬方的
月薪20k+爬虫工程师必备技能-字体反爬
jspython的博客
03-12 286
现在越来越多的网站为了反爬虫已经开始在字体上下功夫了，主要表现为在浏览器上文字显示正常，但是用爬虫抓取下来的却是乱码。比如58同城、猫眼电影、实习僧等网站。
点评网的反爬
02-27
点评网对数字做了处理，一些数字的信息像评论条数、人均、评分等都做了反爬保护。上面的网页中评论条数是1405条，但在页面源码中，除了第一个数字1以外，后面的数字我们看不到，都是一些像随机编码一样的css class。
数据采集，响应数据中文乱码解决办法
qugenpeng的博客
09-09 377
response= requests.get(base_url, headers=headers) # 响应数据 html_info = etree.HTML(response.text) a_text = html_info .xpath('//*[@id="list"]/dl/dd/a/text()') # 响应中文列表 for i in a_text: print(i) # 发现此处是中文乱码 前期打印response.text 发现整个页面是 utf-8 编码 str_info .
解决前端页面中文乱码问题
qq_63339311的博客
03-06 5705
前端页面乱码问题解决方法：解决代码： 方法： 确定开发工具的各种编码格式配置为 utf-8 确定前端页面的编码格式 request，response携带的数据的编码格式，可通过 过滤器 设置 CharacterEncodingFilter ssm\springB 等项目的 controller 中的注解 @RequestMapping(produces = “application/json;charset=UTF-8” ) 链接数据库的url 是否配置 characterEncodin
前端信息传入数据库后乱码解决
Sunblogy的博客
05-17 3812
数据库数据传入是的？？？和前端数据传入的小王呀乱码，解决方案
揭秘：6个能够击败任何爬虫的绝密 ‘反爬虫‘ 措施！
最新发布
xiaoganbuaiuk的博客
12-04 2438
掌握爬虫技术是许多开发者学习的重要一步。而在实践过程中，经常会遇到各种各样的反爬措施。那么，当你遭遇这些反爬虫措施时，应该如何应对呢？本文将为您梳理一些常见的反爬措施以及相应的解决方案，帮助您应对这些挑战。
《VUE前端查询数据页面乱码》问题解决及思考总结
jiban5678的博客
11-11 3878
其实如果数据库配置好了这个my.cnf文件(附配置好的数据库编码图)，连接的时候就不用配参数什么的了。ps:因为我是做项目时遇到的问题，在这里分享总结一下经验，敏感信息打码的请大拿们多多包涵。首先来到虚拟机，登录到命令行看一下数据库字符编码，是正常的。接着idea更换一下新建的库名字，重新部署一下代码，看效果。我的处理方式是重新建了一个数据库，重新导了一下数据。可以看到数据是有乱码的，说明问题出在了数据层面。如果数据库显示正常，判断是前端还是后端出了问题“再次执行查询，核对数据是否正常。
JAVAWEB中乱码问题
weixin_30906671的博客
03-05 307
JavaWeb开发中乱码问题处理 其实，任何问题都是有理可循的，只要弄明白原理，由原理入手设计解决方案，很多问题也就迎刃而解了。在程序设计中，我们不仅要明白怎么做，更要知道为什么这么做，这才是提升能力的必经之路。 下面，我们来分析一下Javaweb开发中常见的乱码产生的原因及其解决方案。 响应乱码原理 服务器发送数据到浏览器，有字符和字节两种方式，这两种方...
SpringMVC中乱码问题的解决配置filter乱码过滤器
热门推荐
weixin_44953227的博客
01-31 2万+
第一种 在web.xml中配置 SpringMVC 的乱码过滤器 <!--配置 SpringMVC 的乱码过滤器--> <filter> <filter-name>encoding</filter-name> <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class> &lt
前端项目写入数据库中文乱码
m0_55225805的博客
07-24 1407
前端项目和MySql数据库的联调。
JSP读取Oracle数据乱码解决方法
"JSP从Oracle数据库中读取数据时出现乱码问题" 在JSP开发过程中，遇到从Oracle数据库中读取数据时出现乱码的情况，这通常涉及到字符编码的不一致。在这个问题中，JSP页面设置的编码是gb2312，而Oracle数据库的编码...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值