web安全方案丨技术开发分享录

web安全方案

{{ detail.nickname }}

转载 翻译 {{ formatTime(detail.create_time) }} 字数 {{ detail.content && detail.content.length }} 阅读 {{ detail.read_num }} {{ formatTag(v) }}

"## 一、使用内容安全策略\n\n完善的内容安全策略(CSP)是前端应用程序安全的基石。CSP是浏览器中引入的一种标准,用于检测和缓解某些类型的代码注入攻击,包括跨站点脚本(XSS)和点击劫持。\n\n```html\n<meta http-equiv=\"Content-Security-Policy\" content=\"default-src 'none'; script-src 'self'; img-src 'self'; style-src 'self'; connect-src 'self'\">\n```\n\nMDN手册:https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy\n\n## 二、启用XSS保护模式\n\n如果用户输入确实注入了恶意代码,我们可以通过提供 \"X-XSS-Protection\": \"1; mode = block\" 头指令来指示浏览器阻止响应。\n\n```php\nheader(\"X-XSS-Protection: 1; mode=block\"); // php header头\n```\n\nMDN手册:https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/X-XSS-Protection\n\n## 三、禁用iframe嵌入以防止点击劫持攻击\n\n点击劫持是一种攻击,网站A上的用户被诱骗对网站B执行某些操作。为了实现这一点,恶意用户将网站B嵌入到一个不可见的iframe中,然后将iframe放置在网站A上毫无防备的用户的光标之下,因此当用户单击,或者更确切地说,认为他们单击了网站A上的元素时,他们实际上是单击了网站B上的某个东西。\n\n我们可以通过提供 X-Frame-Options 响应头来防止此类攻击,该响应头禁止在框架中呈现网站:\n\n```nginx\nadd_header X-Frame-Options sameorigin always; # nginx配置\n```\n\nMDN手册:https://developer.mozilla.org/zh-CN/docs/Web/HTTP/X-Frame-Options\n\n## 四、限制对浏览器功能和API的访问\n\n使用 Feature-Policy 头指示浏览器拒绝访问我们的应用不需要的某些功能和API。\n\n```\nconst helmet = require('helmet');\nconst app = express();\napp.use(helmet.frameguard({ action: \"sameorigin\" }));\n```\n\nMDN手册:https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Feature-Policy\n\n## 五、不要泄露referrer值\n\n为了防止referrer 值泄漏,我们将 Referrer-Policy 标头设置为 no-referrer :\n\n```html\n<meta name=\"referrer\" content=\"no-referrer\">\n```\n\nMDN手册:https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/meta\n\n## 六、对第三方脚本使用子资源完整性\n\n对于您使用的所有第三方脚本,请确保在可能的情况下包括 integrity 属性。浏览器具有 Subresource Integrity 功能,该功能可以验证您正在加载的脚本的加密哈希,并确保它未被篡改。\n\n你的 script 标签如下所示:\n\n```html\n<script src=\"https://example.com/example-framework.js\"\n        integrity=\"sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8wC\"\n        crossorigin=\"anonymous\"></script>\n```\n\n值得说明的是,此技术对第三方库有用,但对第三方服务的作用较小。大多数情况下,当你为第三方服务添加脚本时,该脚本仅用于加载另一个从属脚本。无法检查依赖脚本的完整性,因为可以随时对其进行修改,因此在这种情况下,我们必须依靠严格的内容安全策略。\n\nMDN手册:https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/script\n\n参考链接:\n\n- https://segmentfault.com/a/1190000022500797"
PS:写作不易,如要转裁,请标明转载出处。

如果此篇对您有帮助,可小额赞助,以兹鼓励!

猜你想看