I am currently working on a chatbot project that utilizes the openAI API to generate responses based on specific prompts related to a particular topic. Everything works perfectly when I test the code on my local machine. However, upon deploying it to Heroku, I encountered the following error:
error [TypeError: Invalid character in header content ["Authorization"]].
I attempted to include an authorization header in the fetch() POST request, but unfortunately, the error persists. I am unsure of the source of this issue. Any insights on where this error might be originating from?
try {
fetchEventSource('/api/chat', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
Authorization: `Bearer ${encodedApiKey}`,
},
body: JSON.stringify({
question,
history,
}),
signal: ctrl.signal,
onmessage: (event) => {
if (event.data === '[DONE]') {
setMessageState((state) => ({
history: [...state.history, [question, state.pending ?? '']],
messages: [
...state.messages,
{
type: 'apiMessage',
message: state.pending ?? '',
sourceDocs: state.pendingSourceDocs,
},
],
pending: undefined,
pendingSourceDocs: undefined,
}));
setLoading(false);
ctrl.abort();
} else {
const data = JSON.parse(event.data);
if (data.sourceDocs) {
setMessageState((state) => ({
...state,
pendingSourceDocs: data.sourceDocs,
}));
} else {
setMessageState((state) => ({
...state,
pending: (state.pending ?? '') + data.data,
}));
}
}
},
});
} catch (error) {
setLoading(false);
setError('An error occurred while fetching the data. Please try again.');
console.log('error', error);
}
}
The fetch request above is where I suspect the error might be originating from, particularly in the headers section. Despite setting up the configuration variables on Heroku, the issue persists and I am unable to find a resolution.