【Azure 应用服务】App Service 通过配置web.config来添加请求返回的响应头(Response Header)

简介: 【Azure 应用服务】App Service 通过配置web.config来添加请求返回的响应头(Response Header)

问题描述

在Azure App Service上部署了站点,想要在网站的响应头中加一个字段(Cache-Control),并设置为固定值(Cache-Control:no-store)

效果类似于本地IIS中设置IIS响应标头

 

有时,也会根据不同的安全要求,需要添加Response Header,如下:

#Adding security headers
X-Frame-Options "SAMEORIGIN"
X-Xss-Protection "1; mode=block"
X-Permitted-Cross-Domain-Policies "none"
X-Content-Type-Options "nosniff"
Expect-CT "max-age=86400, enforce"
Referrer-Policy "strict-origin-when-cross-origin"
Strict-Transport-Security "max-age=31536000; includeSubDomains; preload"
Content-Security-Policy "block-all-mixed-content; frame-ancestors 'self'; form-action 'self'; object-src 'none'; base-uri 'self';"
Permissions-Policy "accelerometer=(self), camera=(self), geolocation=(self), gyroscope=(self), magnetometer=(self), microphone=(self), payment=(self), usb=(self)"

 

问题解决

在App Service的web.config文件中添加配置Cache-Control为no-store,可以登录到 kudu( https://<your site name>.scm.chinacloudsites.cn/DebugConsole ) 站点查看 wwwroot 下是否存在 web.config 文件,如果没有可以新建一个,web.config配置参考如下:

<?xml version="1.0" encoding="utf-8"?>
<configuration>
    <system.webServer>
          <httpProtocol>
      <customHeaders>
        <clear />
        <add name="Cache-Control" value="no-store" />    
      </customHeaders>
    </httpProtocol>
    </system.webServer>
</configuration>

 

同理,如果是需要加上安全相关的Header,追加即可。

<?xml version="1.0" encoding="utf-8"?>
<configuration>
    <system.webServer>
          <httpProtocol>
      <customHeaders>
        <clear />
        <add name="Cache-Control" value="no-store" />    
        
        <!-- #Adding security headers -->
        <add name="X-Frame-Options" value="SAMEORIGIN" />   
        <add name="X-Xss-Protection" value="1; mode=block" />   
        <add name="X-Permitted-Cross-Domain-Policies" value="none" />   
        <add name="X-Content-Type-Options" value="nosniff" />   
        <add name="Expect-CT" value="max-age=86400, enforce" />   
        <add name="Referrer-Policy" value="strict-origin-when-cross-origin" />   
        <add name="Strict-Transport-Security" value="max-age=31536000; includeSubDomains; preload" />   
        <add name="Content-Security-Policy" value="block-all-mixed-content; frame-ancestors 'self'; form-action 'self'; object-src 'none'; base-uri 'self';" />   
        <add name="Permissions-Policy" value="accelerometer=(self), camera=(self), geolocation=(self), gyroscope=(self), magnetometer=(self), microphone=(self), payment=(self), usb=(self)" />   
      </customHeaders>
    </httpProtocol>
    </system.webServer>
</configuration>

HTTP 消息头允许客户端和服务器通过 request response传递附加信息。一个请求头由名称(不区分大小写)后跟一个冒号“:”,冒号后跟具体的值(不带换行符)组成。该值前面的引导空白会被忽略。

  • X-Frame-Options : 用来给浏览器 指示允许一个页面 可否在 <frame>, <iframe>, <embed> 或者 <object> 中展现的标记。站点可以通过确保网站没有被嵌入到别人的站点里面,从而避免 clickjacking 攻击。 SAMEORIGIN 表示该页面可以在相同域名页面的 frame 中展示。
  • X-XSS-Protection : 是 Internet Explorer,Chrome 和 Safari 的一个特性,当检测到跨站脚本攻击 (XSS (en-US))时,浏览器将停止加载页面。1;mode=block 启用XSS过滤。 如果检测到攻击,浏览器将不会清除页面,而是阻止页面加载。
  • X-Permitted-Cross-Domain-Policies : 用于允许来自 Flash 和 PDF 文档的跨域请求。none 表示完全阻止通过不同域集成 Flash 和 PDF 文档。
  • X-Content-Type-Options : 相当于一个提示标志,被服务器用来提示客户端一定要遵循在 Content-Type 首部中对  MIME 类型 的设定,而不能对其进行修改。nosniff 只应用于 "script" 和 "style" 两种类型
  • Expect-CT : 允许站点选择性报告和/或执行证书透明度 (Certificate Transparency) 要求,来防止错误签发的网站证书的使用不被察觉。max-age=86400, enforce 指定24小时的证书透明度执行
  • Referrer-Policy : 用来监管哪些访问来源信息——会在 Referer  中发送——应该被包含在生成的请求当中。strict-origin-when-cross-origin 对于同源的请求,会发送完整的URL作为引用地址
  • Strict-Transport-Security : 是一个安全功能,它告诉浏览器只能通过HTTPS访问当前资源,而不是HTTP。
  • Content-Security-Policy : 允许站点管理者控制用户代理能够为指定的页面加载哪些资源。
  • Permissions-Policy : 允许web开发者在浏览器中选择启用、禁用和修改确切特征和 API 的行为

 

问:在App Service for Linux(Node JS 应用) 中是否可以修改Header呢?

答:不可以,App Service for Linux是无法修改服务端配置的,所以无法通过服务端配置添加header的,但是可通过代码方式自行添加Security Header。使用response.setHeader(name, value)方法即可

示例代码如:

const http = require('http');
const server = http.createServer((request, response) => {
    //使用SetHeader添加响应头
    response.setHeader('Content-Type', 'text/html');
    response.setHeader('X-Foo', 'bar');
    response.setHeader("Access-Control-Allow-Origin", "*"); 
 
    response.writeHead(200, {"Content-Type": "text/plain"});
    response.end("Hello World!");
});
const port = process.env.PORT || 1337;
server.listen(port);
console.log("Server running at http://localhost:%d", port);

 

 

参考资料

response.setHeader(name, value):http://nodejs.cn/api/http/response_setheader_name_value.html

Node.js Hello World (App Service): https://github.com/Azure-Samples/nodejs-docs-hello-world

在 Azure 中创建 Node.js Web 应用:https://docs.azure.cn/zh-cn/app-service/quickstart-nodejs?pivots=platform-linux

HTTP headershttps://developer.mozilla.org/en-US/docs/Web/HTTP/Headers#security  OR  https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers

X-PERMITTED-CROSS-DOMAIN-POLICIEShttps://www.scip.ch/en/?labs.20180308

 

【完】

相关文章
|
存储 监控 安全
如何在Python Web开发中确保应用的安全性?
如何在Python Web开发中确保应用的安全性?
669 157
|
12月前
|
前端开发 算法 API
构建高性能图像处理Web应用:Next.js与TailwindCSS实践
本文分享了构建在线图像黑白转换工具的技术实践,涵盖技术栈选择、架构设计与性能优化。项目采用Next.js提供优秀的SSR性能和SEO支持,TailwindCSS加速UI开发,WebAssembly实现高性能图像处理算法。通过渐进式处理、WebWorker隔离及内存管理等策略,解决大图像处理性能瓶颈,并确保跨浏览器兼容性和移动设备优化。实际应用案例展示了其即时处理、高质量输出和客户端隐私保护等特点。未来计划引入WebGPU加速、AI增强等功能,进一步提升用户体验。此技术栈为Web图像处理应用提供了高效可行的解决方案。
|
前端开发 JavaScript 安全
前端性能调优:HTTP/2与HTTPS在Web加速中的应用
【10月更文挑战第27天】本文介绍了HTTP/2和HTTPS在前端性能调优中的应用。通过多路复用、服务器推送和头部压缩等特性,HTTP/2显著提升了Web性能。同时,HTTPS确保了数据传输的安全性。文章提供了示例代码,展示了如何使用Node.js创建一个HTTP/2服务器。
457 3
|
前端开发 JavaScript
探索现代Web应用的微前端架构
【10月更文挑战第40天】在数字时代的浪潮中,Web应用的发展日益复杂多变。微前端架构作为一种新兴的设计理念,正逐步改变着传统的单一前端开发模式。本文将深入探讨微前端的核心概念、实现原理及其在实际项目中的应用,同时通过一个简单的代码示例,揭示如何将一个庞大的前端工程拆分成小而美的模块,进而提升项目的可维护性、可扩展性和开发效率。
|
11月前
|
缓存 前端开发 应用服务中间件
Web端实时通信技术SSE在携程机票业务中的实践应用
本文介绍了携程机票前端基于Server-Sent Events(SSE)实现服务端推送的企业级全链路通用技术解决方案。文章深入探讨了 SSE 技术在应用过程中包括方案对比、技术选型、链路层优化以及实际效果等多维度的技术细节,为类似使用场景提供普适性参考和借鉴。该方案设计目标是实现通用性,适用于各种网络架构和业务场景。
362 1
|
12月前
|
缓存 前端开发 应用服务中间件
Web端实时通信技术SSE在携程机票业务中的实践应用
本文介绍了携程机票前端基于Server-Sent Events(SSE)实现服务端推送的企业级全链路通用技术解决方案。文章深入探讨了 SSE 技术在应用过程中包括方案对比、技术选型、链路层优化以及实际效果等多维度的技术细节,为类似使用场景提供普适性参考和借鉴。
451 7
|
中间件 关系型数据库 数据库
docker快速部署OS web中间件 数据库 编程应用
通过Docker,可以轻松地部署操作系统、Web中间件、数据库和编程应用。本文详细介绍了使用Docker部署这些组件的基本步骤和命令,展示了如何通过Docker Compose编排多容器应用。希望本文能帮助开发者更高效地使用Docker进行应用部署和管理。
423 19
|
Web App开发 编解码 vr&ar
使用Web浏览器访问UE应用的最佳实践
在3D/XR应用开发中,尤其是基于UE(虚幻引擎)开发的高精度场景,传统终端因硬件局限难以流畅运行高帧率、复杂效果的三维应用。实时云渲染技术,将渲染任务转移至云端服务器,降低终端硬件要求,确保用户获得流畅体验。具备弹性扩展、优化传输协议、跨平台支持和安全性等优势,适用于多种终端和场景,特别集成像素流送技术,帮助UE开发者实现低代码上云操作,简化部署流程,保留UE引擎的强大开发能力,确保画面精美且终端轻量化。
693 17
使用Web浏览器访问UE应用的最佳实践
|
监控 安全 测试技术
如何在实际项目中应用Python Web开发的安全测试知识?
如何在实际项目中应用Python Web开发的安全测试知识?
279 61
|
Kubernetes 安全 Devops
有效抵御网络应用及API威胁,聊聊F5 BIG-IP Next Web应用防火墙
有效抵御网络应用及API威胁,聊聊F5 BIG-IP Next Web应用防火墙
369 10
有效抵御网络应用及API威胁,聊聊F5 BIG-IP Next Web应用防火墙