useRuntimeContext

该函数主要用于获取 Runtime 上下文,只能在函数组件中使用。

使用姿势

import { useRuntimeContext } from '@modern-js/runtime';

export function App() {
  const runtimeContext = useRuntimeContext();
  return <div>Hello World</div>
}

函数签名

type RuntimeContext = {
  context: RequestContext;
};

context

用于获取请求上下文

使用示例

区分运行环境

function App() {
  const { context } = useRuntimeContext();

  if (context.isBrowser === true) {
    // 浏览器端执行逻辑
    console.log('browser render')
  } else {
    // 服务器端执行逻辑 logger 功能需开启
    context.logger.info('server render')
  }
}

请求上下文

开启 SSR 时,在 Node 环境和浏览器端环境可以获取到同构的请求上下文。

稍有不同的是 Node 环境还支持设置响应头、响应码,并提供了 Logger 日志与 Metrics 打点。

TIP

当 SSR 未开启时,仅包含可在浏览器端获取的部分信息。

RequestContext
ServerContext
ClientContext
type RequestContext = ServerContext | ClientContext;