sveltejs/kit · error

Can only read '${name}' on the server during rendering (not

Error message

Can only read '${name}' on the server during rendering (not in e.g. `load` functions), as it is bound to the current request via component context. This prevents state from leaking between users
				'For more information, see https://svelte.dev/docs/kit/state-management#avoid-shared-state-on-the-server

What it means

Server-side `$app/state` exports (`page`, `form`, etc.) read request-specific data from Svelte component context, which only exists while rendering components. Accessing them outside rendering (e.g. inside a `load` function or module code) on the server would risk leaking one user's state to another, so `context_dev` throws. Read these states in components, or use `load`'s own event parameters.

Source

Thrown at packages/kit/src/runtime/app/state/server.js:13

import { DEV } from 'esm-env';
import { getContext } from 'svelte';

function context() {
	return getContext('__request__');
}

/** @param {string} name */
function context_dev(name) {
	try {
		return context();
	} catch {
		throw new Error(
			`Can only read '${name}' on the server during rendering (not in e.g. \`load\` functions), as it is bound to the current request via component context. This prevents state from leaking between users. ` +
				'For more information, see https://svelte.dev/docs/kit/state-management#avoid-shared-state-on-the-server'
		);
	}
}

export const page = {
	get data() {
		return (DEV ? context_dev('page.data') : context()).page.data;
	},
	get error() {
		return (DEV ? context_dev('page.error') : context()).page.error;
	},
	get form() {
		return (DEV ? context_dev('page.form') : context()).page.form;
	},
	get params() {
		return (DEV ? context_dev('page.params') : context()).page.params;

View on GitHub (pinned to 03f1687fe6)

Solutions

1. Move the read into a component (e.g. inside `onMount` or the component body) where context exists
2. In `load`, use the `event.params`, `event.url`, and returned `data` instead of `$app/state`
3. For server-side helpers, accept the needed values as explicit arguments

Example fix

// before (in load)
import { page } from '$app/state';
export const load = () => ({ id: page.params.id });
// after
export const load = ({ params }) => ({ id: params.id });

import { browser } from '$app/environment';
function safePageRead(read) {
  if (!browser) throw new Error('read $app/state page only during component rendering or in browser');
  return read();
}

const canUseAppState = () => { try { context(); return true; } catch { return false; } };

try {
  const id = page.params.id;
} catch (e) {
  if (e.message.includes('bound to the current request')) {
    // fall back to load-event params or pass value as argument
  } else throw e;
}

When it happens

Trigger: Calling `page.data`, `page.params`, `page.url`, `form`, `error`, or `route` from a `load` function, a module-level statement, or any non-component server code in DEV mode where Svelte's `context()` is unavailable.

Common situations: Migrating from `$app/stores` to `$app/state` and reading `page` in `load`; using `page.data` in a helper called from `load`; accessing `page` at module top level for SSR config.

Related errors

• Cannot access cloudflare:workers in a prerenderable route
• The configured Vite SSR environment must be a RunnableDevEnv
• ${prerendered.error}
• Cannot call '${__.name}.withOverride()' on the server
• Can only call updated.check() in the browser

AI-assisted analysis of sveltejs/kit@03f1687fe6 (2026-09-02). Data as JSON: /api/errors/fc6b7356f5bc60b1. Report an issue: GitHub.