Cloudflare可以添加自定义的HTTP头吗?

9

有没有办法在Cloudflare中添加自定义标头?

我们有一些https ajax来缓存静态文件,但它无法处理响应头中的"Access-Control-Allow-Credentials"等标头,导致在Chrome上失败。

3个回答

11

Scott Helme发表了一种方法,使用最近发布的Cloudflare Workers进行操作。

https://scotthelme.co.uk/security-headers-cloudflare-worker/

let securityHeaders = {
  "Content-Security-Policy": "upgrade-insecure-requests",
  "Strict-Transport-Security": "max-age=1000",
  "X-Xss-Protection": "1; mode=block",
  "X-Frame-Options": "DENY",
  "X-Content-Type-Options": "nosniff",
  "Referrer-Policy": "strict-origin-when-cross-origin",
}

let sanitiseHeaders = {
  "Server": "My New Server Header!!!",
}

let removeHeaders = [
  "Public-Key-Pins",
  "X-Powered-By",
  "X-AspNet-Version",
]

addEventListener('fetch', event => {
  event.respondWith(addHeaders(event.request))
})

async function addHeaders(req) {
  let response = await fetch(req)
  let newHdrs = new Headers(response.headers)

  if (newHdrs.has("Content-Type") && !newHdrs.get("Content-Type").includes("text/html")) {
    return new Response(response.body, {
      status: response.status,
      statusText: response.statusText,
      headers: newHdrs
    })
  }

  Object.keys(securityHeaders).map(function(name, index) {
    newHdrs.set(name, securityHeaders[name]);
  })

  Object.keys(sanitiseHeaders).map(function(name, index) {
    newHdrs.set(name, sanitiseHeaders[name]);
  })

  removeHeaders.forEach(function(name) {
    newHdrs.delete(name)
  })

  return new Response(response.body, {
    status: response.status,
    statusText: response.statusText,
    headers: newHdrs
  })
}

6
要添加自定义标题,请在Cloudflare中选择Workers

CloudFlare Workers

要添加自定义标头,例如Access-Control-Allow-CredentialsX-Frame-Options,请添加以下小脚本:-
addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request))
})

async function handleRequest(request) {
  let response = await fetch(request)
  let newHeaders = new Headers(response.headers)
  newHeaders.set("Access-Control-Allow-Credentials", "true")
  newHeaders.set("X-Frame-Options", "SAMEORIGIN")
  
  // ... and any more required headers

  return new Response(response.body, {
    status: response.status,
    statusText: response.statusText,
    headers: newHeaders
  })
}

创建了工作者后,您需要将其与路由匹配,例如:

Match route to worker

如果您现在使用Chrome Dev工具测试端点,您将看到响应头。

-7

Cloudflare 不支持这种可能性


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接