useChat "An error occurred"

Issue

I am using useChat and I get the error "An error occurred".

Background

Error messages from streamText are masked by default when using toUIMessageStream for security reasons (secure-by-default). This prevents leaking sensitive information to the client.

Solution

To forward error details to the client or to log errors, use the onError function when calling toUIMessageStream.

export function errorHandler(error: unknown) {
  if (error == null) {
    return 'unknown error';
  }

  if (typeof error === 'string') {
    return error;
  }

  if (error instanceof Error) {
    return error.message;
  }

  return JSON.stringify(error);
}

const result = streamText({
  // ...
});

return createUIMessageStreamResponse({
  stream: toUIMessageStream({
    stream: result.stream,
    onError: errorHandler,
  }),
});

In case you are using createUIMessageStream, you can pass the onError function to it:

const response = createUIMessageStreamResponse({
  stream: createUIMessageStream({
    // ...
    async execute({ writer }) {
      // ...
    },
    onError: errorHandler,
  }),
});