服务器头

学习如何在 Expo Router 中为所有服务器路由响应设置自定义 HTTP 头。

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

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

🌐 Server headers in Expo Router allow you to set custom HTTP headers for security, caching, cookies, and custom metadata on route responses. Headers only apply to HTML and API route responses, and are not applicable to static assets such as images, fonts, or JavaScript bundles.

设置

🌐 Setup

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

🌐 Configure headers in the expo-router plugin in your app config:

app.json

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

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

🌐 Start the development server or export for production:

Terminal

- npx expo start

# Or export for production

- npx expo export -p web

标题会自动应用于所有 HTML 和 API 路由响应。

🌐 Headers are automatically applied to all HTML and API route responses.

配置

🌐 Configuration

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

🌐 Headers are configured as an object where keys are header names and values are either strings or arrays of strings.

app.json

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

示例

🌐 Examples

安全头

添加常用的安全头以保护你的应用：

🌐 Add common security headers to protect your application:

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 在网页上这样的功能所必需的。

🌐 Some web APIs like SharedArrayBuffer require specific Cross-Origin headers. This is required for features like expo-sqlite on web.

app.json

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

缓存控制头

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

🌐 Set caching policies for your responses:

app.json

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

自定义头

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

🌐 Add custom headers with metadata about your app:

app.json

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

工作原理

🌐 How it works

输出模式

🌐 Output modes

服务器头可以与你的应用配置中设置的两种输出模式一起使用：

🌐 Server headers work with both output modes configured in your app config:

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

标题优先级

🌐 Header precedence

expo-router 插件中定义的头部会全局生效，但不会覆盖 API 路由设置的头部。如果某个 API 路由返回的响应中包含一个在插件配置中也定义过的头部，则以路由特定的头部为准。

🌐 Headers defined in the expo-router plugin are applied globally but do not override headers set by API routes. If an API route returns a response with a header that is also defined in the plugin configuration, the route-specific header takes precedence.

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

🌐 For example, if you configure Cache-Control: public, max-age=3600 globally, but an API route that returns real-time data sets Cache-Control: no-store, the API route's header takes precedence.

已知的限制

🌐 Known limitations

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

服务器头

设置

配置

示例

工作原理

输出模式

标题优先级

已知的限制

相关