SvelteKit开启SSR时报500错误，求排查解决方法

移除export const ssr = false;后出现500错误，说明你的load函数在服务器端执行时发生了未捕获的错误——启用SSR时load会在服务器端运行，而ssr: false时仅在客户端运行。问题大概率出在getPosts()函数的服务器端兼容性上，按以下步骤排查：

1. 查看服务器端错误日志 #

这是定位问题的核心。运行npm run dev后，控制台会输出500错误的详细栈信息，常见报错包括：

• Sanity API请求失败（权限不足、项目ID/数据集配置错误）
• 环境变量未定义（比如process.env.SANITY_PROJECT_ID不存在）
• 代码依赖了客户端专属API（比如window、document）

2. 检查getPosts()的实现逻辑 #

确认这个函数是否包含服务器端无法执行的代码：

• 如果用到window/document等浏览器API，需要用SvelteKit的browser变量做环境判断，拆分客户端与服务器端逻辑：

  import { browser } from '$app/environment';
  import { getPostsClient } from './client';
  import { getPostsServer } from './server';
  
  export async function getPosts() {
    if (browser) {
      return getPostsClient(); // 客户端用公开配置的Sanity客户端
    }
    return getPostsServer(); // 服务器端用带私有token的Sanity客户端
  }
  

• 检查Sanity客户端配置：服务器端访问Sanity API通常需要私有token，且建议关闭CDN（设置useCdn: false），如果你的getPosts()在服务器端复用了客户端的公开配置，会导致权限请求失败。

3. 验证环境变量的可用性 #

确保服务器端能获取到Sanity所需的环境变量（如SANITY_PROJECT_ID、SANITY_DATASET、SANITY_TOKEN）：

• 变量需放在项目根目录的.env文件中，无需加VITE_前缀（服务器端环境变量无需暴露给客户端）
• 可在getPosts()中临时打印变量，确认服务器端能读取到：

  console.log('Server env check:', process.env.SANITY_PROJECT_ID);
  

4. 给load函数添加错误捕获 #

临时在load中加入try-catch，打印详细错误信息，帮助快速定位问题：

import { getPosts } from '$lib/utils/sanity';
import { error } from '@sveltejs/kit';
import type { PageLoad } from './$types';

export const load = (async () => {
    try {
        const posts = await getPosts();
        if (posts) {
            return { posts };
        }
        throw error(404, 'Not found');
    } catch (err) {
        console.error('Server-side load error:', err);
        throw error(500, 'Failed to fetch posts');
    }
}) satisfies PageLoad;

内容的提问来源于stack exchange，提问作者user16413733