SvelteKit报错‘Handler should return a response’，已返回响应仍报错？

我编写了一个模拟授权POST请求的简单API端点服务器函数：

/** @type {import('./$types').RequestHandler} */

import { json, error } from '@sveltejs/kit'

export async function POST({ request }) {
    const data = await request.json()

    if (!data.username || !data.password) {
        return error(400, 'Missing username or password.')
    }

    return json({ username: data.username, id: 1 })
}

同时在+page.svelte中编写了调用该接口的表单逻辑：

async function login() {
        const response = await fetch('/api/auth/login', {
            method: 'POST',
            body: JSON.stringify({
                username,
                password
            })
        })
        const resJSON = await response.json()
        console.log('Form submitted', resJSON)
    }

但终端出现错误提示：Error: Invalid response from route /api/auth/login: handler should return a Response object。明明通过json({})返回了对象，为何还会出现这个报错？

这个报错核心是SvelteKit版本与代码API不兼容。

在SvelteKit 1.0及以后的版本中，json()、error()这类响应辅助函数的导入路径和使用规则发生了变化：

• 它们不再从@sveltejs/kit导出，而是要从@sveltejs/kit/server导入
• API端点必须放在+server.js文件中（比如src/routes/api/auth/login/+server.js），而不是+page.js——后者是用于页面数据预加载的，不能直接处理HTTP请求

修复步骤 #

1. 修改导入语句：

import { json, error } from '@sveltejs/kit/server'

2. 确保你的API处理器文件是+server.js，而不是其他类型的路由文件。

另外补充个小细节：你的前端请求里最好加上Content-Type: application/json头，虽然这不是当前报错的直接原因，但能避免后续解析JSON时出问题：

async function login() {
    const response = await fetch('/api/auth/login', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({
            username,
            password
        })
    })
    const resJSON = await response.json()
    console.log('Form submitted', resJSON)
}

内容的提问来源于stack exchange，提问作者better-strangers