When submitting an HTML encoded text to the server, everything runs smoothly on the development environment. However, once it is deployed to a Netlify server, the same request triggers a 500 error and the server side logging middleware only recognizes a POST request without any body.
The server file responsible for handling the POST request is located at: server/api/handlePost.post.ts
export default defineEventHandler(async (event) => {
const { rawLog } = getQuery(event);
if (rawLog != null) {
const myRawLog = JSON.parse(rawLog as string) as rawLogArticle;
//post it to the server...
return { statusCode: 200, statusMessage: "Success" };
} else {
return { statusCode: 500, statusMessage: "SERVER ISSUE" };
}
The client-side script for posting content is in: pages/post/write.vue
<script setup lang="ts">
if (body.length > 0 && _title.length > 0) {
const { data: response } = await useFetch('/api/handlePost', {
method: "post",
query: {
rawLog: JSON.stringify(newLogContent)
}
})
if (response.value?.statusCode == 200) {
await navigateTo("/")
} else {
console.error("something went wrong")
}
</script>
The post body uses the TinyMCE text editor's HTML content. If there are double line breaks
or
extra spaces at the end of a sentence
in the text, the server throws a 500 error. Despite the Chrome network tab showing that the request was sent with the post body included.
By manually removing the npsb;
character from the request body, the request goes through without any problems.