CSP -- 运营商内容劫持（广告）的终结者

我们公司最近手机端h5经常受到商户和用户的投诉，说有广告并且导致不能正常进行操作，我们商户自己当然不会加广告了，但是商户和用户可不管这些了，就认为是我们的问题

目前我们用的很多浏览器，都提供插件功能，在chrome浏览器体系下有个广告终结者插件：可以用来屏蔽网页中的广告部分。受到这个插件的影响，我先探索下广告劫持是怎么做的？我就想到通过获取网页html代码过来分析，如下js代码

settimeout(function(){$.ajax({url:"/error/ad_log",type:'post',data:{'content':$("html").html(),'url':window.location.href},success:function(){}});},3000);

在后端我分析html内容发现如下截图几个内容，通过截图发现页面多了一些js文件

="text javascript"id="1qa2ws" charset="utf-8" src="http://wap.zjtoolbarc60.10086.cn:8080/www/default/base.js">内容劫持原理

通过上图我们就分析出了，一般劫持是通过在页面加入引入一个js文件，然后这个js文件会执行各种逻辑，根据新引入的js域名搜索，你就会发现很多东西了，

知道了病状不代表就一定可以解决，例如我们公司的就很奇葩，因为广告的插入导致js全部出错用户无法进行操作（太可*，插入广告就算了，还导致别人无法正常运营）。通过搜索我发现了可以通过csp解决这个问题

csp全称为contentsecuritypolicy，即内容安全策略。主要以白名单的形式配置可信任的内容来源，在网页中，能够使白名单中的内容正常执行（包含js，css，image等等），而非白名单的内容无法正常执行，从而减少跨站脚本攻击（xss），当然，也能够减少运营商劫持的内容注入攻击。

在html的head中添加如下meta标签，将在符合csp标准的浏览器中使非同源的script不被加载执行。不支持csp的浏览器将自动会忽略csp的信息，不会有什么影响。具体兼容性可在本文末尾参考资料中找到

="content-security-policy"content="script-src'self'">使用方式二：http头部

content-security-policy:script-src'unsafe-inline''unsafe-eval''self'*.54php.cn*.yunetidc.com*.baidu.com*.cnzz.com*.duoshuo.com*.jiathis.com;report-uri/error/csp高级知识：指令集合指令取值示例说明default-src'self'cdn.example.com定义针对所有类型（js/image/css/webfont/ajax/iframe/多媒体等）资源的默认加载策略，某类型资源如果没有单独定义策略，就使用默认。script-src

'self'js.example.com

*.54php.cn

*://*.54php.cn

https://*.54php.cn

由于采用白名单方式，所以这个名单要更具业务可能会有变化，所以的谨慎使用，如果配置不当导致页面无法加载就麻烦啦

数据如下：广告蛋糕太大了，好多人都想分点

164119.4.249.166:8080225www.tjqonline.cn250221.179.140.145:9090364220.196.52.141:30000544101.251.211.235545jdwx01.b0.upaiyun.com1587wap.zjtoolbarc60.10086.cn:8080参考资料

xss终结者-csp理论与实践

普遍的http劫持