修改网页数据

浏览器里按F12，修改找到那行价格数字，网页双击，数据改成0.01，修改回车。网页页面上的数据标价立刻变了。刷新一下，修改又回到原样。网页这是数据绝大多数人第一次接触"修改网页数据"的场景——看起来改了，其实什么都没改。修改

前端页面上的网页东西，本质上只是数据浏览器根据服务器发来的数据渲染出来的一层皮。你在Elements面板里编辑的修改HTML，只存在于你本机的网页内存里。服务器根本不知道你干了什么，数据它下次发数据过来，照样是原来的价格。所以改页面显示和改数据库，完全是两件事。

那为什么有人觉得改网页能骗过系统？

因为确实存在一些场景，前端数据会被回传。比如某些表单提交时，页面上有个隐藏的存着商品单价，你把它改了再提交，后端如果没做二次校验，直接拿这个值去算总价，那就真的出问题了。早年电商刚兴起那阵子，这种漏洞不少。有人把单价改成负数下单，平台还得倒找他钱。现在主流平台基本都堵上了，但一些中小网站、内部管理系统，仍然存在类似问题。

我见过一个案例：某公司内部审批系统，页面上有个下拉框选审批级别，前端只允许普通员工选到"部门经理"这一级。有人用开发者工具把那个select的选项改了，直接提交"总经理审批"，居然通过了。后端完全信任了前端传来的值。这种问题的根源不在浏览器能不能改，而在后端该不该信。

改网页数据的几种常见手段

最直接的就是开发者工具。Chrome DevTools、Firefox的Inspector，都能实时编辑DOM和CSS。改文字、改颜色、隐藏元素、删掉付费墙的遮罩层，几秒钟的事。

再进一步是用Console执行JavaScript。比如document.querySelector('.price').textContent = '0'，效果和手动编辑一样，但可以批量操作。有人写脚本自动抢票、自动填表，也是在这个层面做文章。

还有一种更隐蔽的：拦截网络请求。用Proxy工具或者浏览器插件，在请求发出前或响应返回后篡改数据。比如服务器返回的JSON里余额是100，你在中间把它改成10000，页面就显示一万。当然，这只是显示层面的欺骗，实际消费时该不够还是不够。

真正危险的是第三种——如果后端接口没有鉴权或校验，篡改请求参数就能直接操作数据。比如把userId=123改成userId=456，就能看到别人的订单信息。这叫越权漏洞，跟"修改网页数据"只有一线之隔。

防御的核心逻辑

一句话：前端的一切都不可信。用户能看到的数据、能提交的字段、能调用的接口，都必须假定会被篡改。价格在后端算，权限在后端判，关键参数在后端校验。前端做的验证只是为了用户体验——让用户早点知道填错了，而不是为了安全。

我见过不少开发者偷懒，把该后端做的事丢给前端。比如用JavaScript判断用户是不是VIP，是就显示隐藏内容。这种把戏，会按F12的人三十秒就能绕过。隐藏内容本身已经发到了浏览器，只是CSS让它不显示而已。

修改网页数据这件事，门槛低到几乎为零。任何人花十分钟就能学会改页面上的文字。但真正造成影响的，从来不是浏览器里那点改动，而是后端有没有把该守的门守住。