如何集成SvelteKit和Google Forms?

Question

SvelteKit在1月19日的重大更改(有关详细信息，请参阅此处)意味着我的Google表单集成不再有效。

首先让它工作是一个小小的困难，我无法将其更新 - 我反复收到错误消息，"要访问请求正文，请使用text/json/arrayBuffer/formData方法，例如body = await request.json()"，以及指向 GitHub 对话的链接。

这是我Contact组件...

<script>
let submitStatus;
const submitForm = async (data) => {
submitStatus = 'submitting';
const formData = new FormData(data.currentTarget);
const res = await fetch('contact.json', {
method: 'POST',
body: formData
});
const { message } = await res.json();
submitStatus = message;
};
const refreshForm = () => {
/* Trigger re-render of component */
submitStatus = undefined;
};
</script>

。这是相应的contact.json.js：

export const post = async (request) => {
const name = request.body.get('name');
const email = request.body.get('email');
const message = request.body.get('message');
const res = await fetch(`URL TO RELEVANT GOOGLE FORM GOES HERE`);
if (res.status === 200) {
return {
status: 200,
body: { message: 'success' }
};
} else {
return {
status: 404,
body: { message: 'failed' }
};
}
};

任何帮助将不胜感激！

Answer 1

事实上，修复相对简单，只涉及对现有代码的微小更改。我必须访问event.request(解构为request)，然后从那里继续，由这个类似问题的答案提示。所以，在那之后，contact.json.js看起来像...

export const post = async ({ request }) => {
const body = await request.formData();
const name = body.get('name');
const email = body.get('email');
const message = body.get('message');
const response = await fetch(`URL TO RELEVANT GOOGLE FORM GOES HERE`);
if (response.status === 200) {
return {
status: 200,
body: { message: 'success' }
};
} else {
return {
status: 404,
body: { message: 'failed' }
};
}
};

(另请注意，整个表单是基于WebJeda的这段视频，该视频现在不适用于最新的SvelteKit版本，但可以通过这个简单的更改。