服务器标头

编辑页面

了解如何为 Expo Router 中的所有服务器路由响应设置自定义 HTTP 标头。

重要服务器头信息在 SDK 54 及更高版本中可用，并且需要 expo-server 来提供已导出的应用。

Expo Router 中的服务器头信息允许你为路由响应设置自定义 HTTP 头，用于安全、缓存、Cookie 和自定义元数据。头信息仅适用于 HTML 和 API 路由响应，不适用于静态资源，例如图片、字体或 JavaScript 包。

设置

在你的应用配置中的 expo-router 插件里配置头信息：

app.json

{
  "expo": {
    "plugins": [
      [
        "expo-router",
        {
          "headers": {
            "X-Frame-Options": "DENY"
          }
        }
      ]
    ]
  }
}

启动开发服务器或导出用于生产：

Terminal

- npx expo start

# 或导出用于生产

- npx expo export -p web

头信息会自动应用于所有 HTML 和 API 路由响应。

配置

头信息被配置为一个对象，其中键为头名称，值可以是字符串或字符串数组。

app.json

{
  "expo": {
    "plugins": [
      [
        "expo-router",
        {
          "headers": {
            "X-Frame-Options": "DENY",
            "X-Content-Type-Options": "nosniff",
            "Set-Cookie": ["session=abc123; HttpOnly", "preference=dark; Path=/"]
          }
        }
      ]
    ]
  }
}

示例

安全头信息

添加常见的安全头信息来保护你的应用：

app.json

{
  "expo": {
    "plugins": [
      [
        "expo-router",
        {
          "headers": {
            "X-Frame-Options": "DENY",
            "X-Content-Type-Options": "nosniff",
            "Referrer-Policy": "strict-origin-when-cross-origin",
            "X-XSS-Protection": "1; mode=block"
          }
        }
      ]
    ]
  }
}

用于 SharedArrayBuffer 的跨域头信息

某些 Web API，例如 SharedArrayBuffer，需要特定的跨域头信息。这对于像 expo-sqlite 在 web 上这样的功能是必需的。

app.json

{
  "expo": {
    "plugins": [
      [
        "expo-router",
        {
          "headers": {
            "Cross-Origin-Embedder-Policy": "credentialless",
            "Cross-Origin-Opener-Policy": "same-origin"
          }
        }
      ]
    ]
  }
}

Cache-Control 头信息

为你的响应设置缓存策略：

app.json

{
  "expo": {
    "plugins": [
      [
        "expo-router",
        {
          "headers": {
            "Cache-Control": "public, max-age=3600, s-maxage=86400"
          }
        }
      ]
    ]
  }
}

自定义头信息

添加包含你的应用元数据的自定义头信息：

app.json

{
  "expo": {
    "plugins": [
      [
        "expo-router",
        {
          "headers": {
            "X-App-Version": "1.0.0",
            "X-Environment": "production"
          }
        }
      ]
    ]
  }
}

工作原理

输出模式

服务器头信息适用于在你的 app config 中配置的两种输出模式：

static：在使用 expo-server 提供预渲染 HTML 文件时应用头信息
server：将头信息应用于动态渲染的响应

头信息优先级

在 expo-router 插件中定义的头信息会全局应用，但不会覆盖 API 路由设置的头信息。如果某个 API 路由返回的响应中包含一个同时也在插件配置中定义的头信息，则该路由特定的头信息优先。

例如，如果你全局配置了 Cache-Control: public, max-age=3600，但某个返回实时数据的 API 路由设置了 Cache-Control: no-store，则该 API 路由的头信息优先。

已知限制

重定向：头信息不适用于重定向响应
静态资源：头信息仅应用于 HTML 和 API 路由响应，不适用于图片、字体或 JavaScript 包等静态资源

服务器标头

设置

配置

示例

工作原理

输出模式

头信息优先级

已知限制

相关内容