問題描述

在Azure App Service上部署了站點，想要在網站的響應頭中加一個字段(Cache-Control)，并設定為固定值(Cache-Control：no-store)

效果類似于本地IIS中設定IIS響應标頭

【Azure 應用服務】App Service 通過配置web.config來添加請求傳回的響應頭(Response Header)

有時，也會根據不同的安全要求，需要添加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 headers：https://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-POLICIES：https://www.scip.ch/en/?labs.20180308

【完】

當在複雜的環境中面臨問題，格物之道需：濁而靜之徐清，安以動之徐生。雲中，恰是如此!

【Azure 應用服務】App Service 通過配置web.config來添加請求傳回的響應頭(Response Header)

問題描述

問題解決

參考資料