ssrContext 对象是 SSR 上下文，应用的所有 Vue 组件都使用它来渲染。
¥The ssrContext Object is the SSR context with which all the app’s Vue components are rendered with.
用法(Usage)
¥Usage
警告
ssrContext 对象仅在 SSR 版本中可用，在服务器端编译（使用 process∙env∙SERVER === true 时）时可用。
¥The ssrContext Object is available only on SSR builds, on the server-side compilation (when process∙env∙SERVER === true).
此外，它还作为参数提供给 启动文件、Pinia 实例 和 Vue 路由 初始化函数以及 preFetch 方法：
¥Among other places, it is supplied as parameter to boot files, to the Pinia instance and Vue Router initialization functions, and to the preFetch method:
// a boot file
export default defineBoot(({ ..., ssrContext }) => { /* ... */ })
// src/router/index.js
export default defineRouter(({ ..., ssrContext }) { /* ... */ })
// src/store/index.js
export default defineStore(({ ..., ssrContext }) { /* ... */ })
// with preFetch:
preFetch: definePreFetch(({ ..., ssrContext }) { /* ... */ })你还可以在 Vue 组件中访问 ssrContext。以下是两个示例，一个使用 Composition API，一个使用 Options API：
¥You can also access the ssrContext in your Vue components. Below are two examples, one with Composition API and one with Options API:
import { useSSRContext } from 'vue'
export default {
// ...
setup () {
// we need to guard it and call it only on SSR server-side:
const ssrContext = process.env.SERVER ? useSSRContext() : null
// ...do something with it
}
}ssrContext 结构剖析(Anatomy of ssrContext)
¥Anatomy of ssrContext
ssrContext: {
req, // Express.js object
res, // Express.js object
$q, // The Quasar's $q Object
nonce, // (optional to set it yourself)
// The global "nonce" attribute to use
onRendered, // Registers a function to be executed server-side after
// app has been rendered with Vue. You might need this
// to access ssrContext again after it has been fully processed.
// Example: ssrContext.onRendered(() => { /* ... */ })
rendered // (optional to set it yourself)
// Set this to a function which will be executed server-side
// after the app has been rendered with Vue.
// We recommend using the "onRendered" instead.
//
// Purpose: backward compatibility with Vue ecosystem packages
// (like @vue/apollo-ssr)
// Example: ssrContext.rendered = () => { /* ... */ }
}有关 “nonce” 属性用途的更多信息，请参阅 MDN。
¥More information on the purpose of the “nonce” property is available on MDN.
req 和 res 是 Express.js 当前服务器客户端的对象。req 的一个用例是访问 req.url 以获取客户端请求的 URL。
¥The req and res are Express.js’s objects for the current server client. One use-case for req is accessing req.url to get the URL that the client is requesting.
提示
你也可以将自己的内容注入 ssrContext，但请勿篡改任何私有属性（以下划线开头的属性，例如 _someProp）。
¥Feel free to inject your own stuff into ssrContext too, but do NOT tamper with any of the private props (props that start with an underscore, eg. _someProp).