关于前端页面测试和抵御 clickjacking attack 的一些方法
点击劫持(clickjacking)是一种欺骗用户的攻击,当他们实际点击另一件事时,他们认为他们正在点击另一件事。 它的另一个名称,用户界面 (UI) 修正,更好地描述了正在发生的事情。 用户以为他们使用的是网页的普通 UI,但实际上有一个隐藏的 UI 在控制; 换句话说,UI 已被修复。 当用户点击他们认为安全的东西时,隐藏的 UI 会执行不同的操作。
由于 HTML 框架 (iframe) 能够通过框架在其他网页中显示网页,因此攻击成为可能。 如果网页允许自己在框架内显示,攻击者可以用隐藏的透明层覆盖原始网页,并使用自己的 JavaScript 和 UI 元素。 然后,攻击者诱骗用户访问恶意页面,该页面看起来就像用户知道并信任的站点。 没有迹象表明原始站点上有隐藏的 UI。 用户单击链接或按钮,期望原始站点执行特定操作,然后攻击者的脚本运行。 但是攻击者的脚本也可以执行预期的操作,让它看起来没有出错。
我们可以使用下面这个工具网站来检测自己的网站是否存在被 clickjacking 攻击的漏洞。
https://clickjacker.io/
只需要把自己的网站 url,填入输入框,即可检测:
我本地开发的网站,使用 localhost 运行,当然没办法被这个工具网站扫描,所以我把它们发布到阿里云上,通过后者的公网 ip 地址进行访问。
首先使用 pm2 list
查看阿里云服务器上运行的服务器进程:
使用 pm2 stop all
停掉所有的进程:
在 meta
元素中设置 X-Frame-Options 是没有用的! 例如, meta http-equiv="X-Frame-Options" content="deny"
没有效果。
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options
X-Frame-Options 仅通过设置 HTTP 标头起作用,如下例所示。
const frameguard = require('frameguard');
app.use(frameguard({ action: 'SAMEORIGIN' }));
上面的代码效果如下:
使用本文开头提到的工具网站进行扫描:
上面的代码生效了,现在的输出是:
it is safe from clickjacking attack.
另一个指令:CSP: frame-ancestors
,同样不支持在 meta
元素里定义:
var express = require('express');
var app = express();app.use(function(req, res, next) {res.setHeader("Content-Security-Policy", "script-src 'self'");return next();
});
https://stackoverflow.com/questions/21048252/nodejs-where-exactly-can-i-put-the-content-security-policy
上述代码的作用,让工具网站的检查重新显示绿灯:
关于前端页面测试和抵御 clickjacking attack 的一些方法相关推荐
- 前端 页面测试工具 sitespeed.io
上2个核心网址 第一个官网 第二个博客 本人使用node 环境进行sitespeed.io使用的 电脑mac系统 所以 其它的 不多说了 第一 安装node.js 配置全局环境 ...
- 前端页面生成pdf方案
前端页面生成pdf方案 使用jsPDF的html方法生成 直接将html节点传入jsPDF生成pdf,效果一般 const pdf = new jsPDF('p', 'pt', 'a4'); cons ...
- Web前端页面的浏览器兼容性测试心得(三)总结一些IE8兼容问题的解决方案
Web前端页面的浏览器兼容性测试心得(三)总结一些IE8兼容问题的解决方案 参考文章: (1)Web前端页面的浏览器兼容性测试心得(三)总结一些IE8兼容问题的解决方案 (2)https://www. ...
- moco的使用,moco测试前端页面、moco的启动、moco前端测试工具、moco的例子
moco的使用,moco测试前端页面.moco的启动.moco前端测试工具.moco的例子 moco的介绍 moco的启动 moco例子 注意 不带参数的get请求 返回字符串 带参数的get请求 返 ...
- 学成在线--2.CMS前端页面查询开发
文章目录 0.思路总结 1.创建CMS模块的目录架构 2.创建页面并配置路由 1)在page目录新建page_list.vue,扩展名为.vue. 2)在cms的router下配置路由. 3)在bas ...
- html-javascript前端页面刷新重载的方法汇总
记得我在兴安得力实习要转正的时候,我领导象征性的给我出了一套测试题目,里面就有js闭包和页面刷新等题目.今天把很久之前的测试题目之一,js页面刷新的方法以及页面自动刷新跳转和返回上一页和下一页等方法总 ...
- vue 新建的页面如何访问_Vue.js—实现前后端分离架构中前端页面搭建(四)(完)...
[Vue.js实现前后端分离架构中前端页面搭建] 二十.实现服务端登录业务 前提:已经有单机版Eureka,端口8761.启动开Eureka 1. 新建父项目 新建backend_parent. 为了 ...
- 使用ajax获取后台数据怎么打印,我用ajax获取后台数据并展示在前端页面的方法【源码】...
<我用ajax获取后台数据并展示在前端页面的方法[源码]>由会员分享,可在线阅读,更多相关<我用ajax获取后台数据并展示在前端页面的方法[源码](2页珍藏版)>请在人人文库网 ...
- iview构建基本html页面,写前端页面步骤----vue+iview
1:用iview构建基本HTML页面 2:在export default{ }中写一个data(){return:{变量:值}}全局对象,用于传递与绑定HTML参数. 3:在export defaul ...
最新文章
- godaddy 管理mysql_在godaddy上使用MySQL和Entity Framework的安全例...
- SAP CRM WebClient UI上note下拉列表里类型的过滤逻辑
- 在Eclipse中使用Java 12
- lrzsz linux与windows互传
- Magento数据库结构:EAV
- Linux学习笔记(一)——简介
- asp html转word文档,asp生成word文档
- Exchange Server 2010高可用性配置
- Python之路,Day21 - 常用算法学习
- ajax 传实体对象,前端ajax或axios发送数据后端实体类接受(实例和报错原因)
- 如何选择SAP培训?
- 应该怎么学大数据?该从哪学起?
- 时代落在英伟达身上的是粒什么沙,国产GPU的机会又在哪?
- 教程篇(7.0) 03. FortiGate基础架构 虚拟域(VDOM) ❀ Fortinet 网络安全专家 NSE 4
- 机器学习之Kmeans
- 《Solar Energy》期刊介绍(SCI 2区)
- 最最最常见的链路聚合、IRF堆叠配置
- Robomongo使用教程:踩着前辈的路
- 用人工智能判断红楼梦后40回是否是曹雪芹写的
- # COCO2017 数据集下载
热门文章
- lasso回归_线性回归amp;lasso回归amp;岭回归介绍与对比
- linux is not unix由来,一些奇怪的 unix 指令名字的由来
- echarts line 去掉最外围方框_最容易被忽略的简单技巧,3000块的化妆班都学不到...
- Apache Karaf配置远程调试
- 移动端下拉刷新原理和实例
- 一篇文章彻底说清JS的深拷贝/浅拷贝
- android 成长日记 8.Fragment学习之方法回调
- CIALBrowser
- 史无前例的 HTML5 资源参考指南
- 点关机后主机不能自动关机的原因